/** File Path
-----------------------------------------*/
/** Colors
-----------------------------------------*/
/** Calendar
-----------------------------------------*/
/** Font Size
-----------------------------------------*/
/** Mixin
-----------------------------------------*/
/** Icons
-----------------------------------------*/
* {
  box-sizing: border-box; }

html {
  font-size: 16px; }

body {
  margin: 0;
  padding: 0;
  background: #fff;
  line-height: 1.5;
  font-family: ".SFUIText", sans-serif;
  color: #333; }

h1, h2, h3, h4, h5, h6, p, ul, li, dl, dt, dd, figure {
  margin: 0;
  padding: 0; }

ul, li {
  list-style: none; }

img {
  border: 0; }

img.fluid {
  width: 100%; }

a {
  outline: 0;
  color: #09c;
  text-decoration: none; }

button {
  border: none; }

/** Text
-----------------------------------------*/
span.price {
  font-weight: bold;
  color: #e74c3c; }

#content_wrap {
  padding-top: 50px; }

/** Header
-----------------------------------------*/
#header {
  display: flex;
  position: fixed;
  width: 100%;
  height: 50px;
  z-index: 1000;
  overflow: hidden;
  padding: 0 5px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); }

#header_logo {
  display: block;
  width: 68px;
  padding: 12px 0; }

#header_search {
  display: block;
  width: 100%;
  height: 36px;
  margin: 7px 7px 0;
  background: #ecf0f1; }
  @media screen and (max-width: 320px) {
    #header_search {
      width: auto; } }
  #header_search input {
    width: 100%;
    height: 36px;
    padding-left: 30px;
    border: none;
    border-radius: 0;
    background: 5px center no-repeat;
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23666%22%3E%3Cpath%20d%3D%22M21.7%2020.3l-4.5-4.5c1.1-1.4%201.8-3.3%201.8-5.3%200-4.7-3.8-8.5-8.5-8.5s-8.5%203.8-8.5%208.5c0%204.7%203.8%208.5%208.5%208.5%202%200%203.8-0.7%205.3-1.8l4.5%204.5c0.2%200.2%200.5%200.3%200.7%200.3s0.5-0.1%200.7-0.3c0.4-0.4%200.4-1%200-1.4zM4%2010.5c0-3.6%202.9-6.5%206.5-6.5s6.5%202.9%206.5%206.5c0%201.8-0.7%203.4-1.9%204.6%200%200%200%200%200%200s0%200%200%200c-1.2%201.2-2.8%201.9-4.6%201.9-3.6%200-6.5-2.9-6.5-6.5z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
    background-size: 20px auto;
    font-size: 16px;
    -webkit-appearance: none; }

#header_cart {
  display: block;
  position: relative;
  width: 48px;
  height: 36px;
  margin: 7px 0 0;
  background: center center no-repeat;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2228%22%20height%3D%2228%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22%230c4da2%22%3E%3Cpath%20d%3D%22M13%2017c0%201.104%200.894%202%202%202%201.104%200%202-0.896%202-2%200-1.106-0.896-2-2-2-1.106%200-2%200.894-2%202zM3%2017c0%201.104%200.895%202%202%202%201.103%200%202-0.896%202-2%200-1.106-0.897-2-2-2-1.105%200-2%200.894-2%202zM6.547%2012.172l11.068-3.162c0.211-0.061%200.385-0.289%200.385-0.51v-5.5h-14v-1.6c0-0.22-0.181-0.4-0.399-0.4h-3.202c-0.219%200-0.399%200.18-0.399%200.4v1.6h2l1.91%208.957%200.090%200.943v1.649c0%200.219%200.18%200.4%200.4%200.4h13.2c0.22%200%200.4-0.182%200.4-0.4v-1.549h-11.248c-1.15%200-1.174-0.551-0.205-0.828z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  background-size: 20px auto; }
  @media screen and (max-width: 320px) {
    #header_cart {
      width: 40px; } }
  #header_cart .cart_count {
    display: block;
    position: absolute;
    right: -5px;
    top: 0;
    min-width: 16px;
    height: 16px;
    padding: 3px 5px 0;
    border-radius: 30px;
    background: #e74c3c;
    line-height: 1;
    text-align: center;
    font-size: 10px;
    font-weight: bold;
    color: #fff; }

#header_nav_toggle {
  display: block;
  width: 48px;
  height: 36px;
  margin: 7px 0 0;
  background: center center no-repeat;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%230c4da2%22%3E%3Cpath%20d%3D%22M21%2011h-18c-0.6%200-1%200.4-1%201s0.4%201%201%201h18c0.6%200%201-0.4%201-1s-0.4-1-1-1z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M3%207h18c0.6%200%201-0.4%201-1s-0.4-1-1-1h-18c-0.6%200-1%200.4-1%201s0.4%201%201%201z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M21%2017h-18c-0.6%200-1%200.4-1%201s0.4%201%201%201h18c0.6%200%201-0.4%201-1s-0.4-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  background-size: 20px auto; }
  @media screen and (max-width: 320px) {
    #header_nav_toggle {
      width: 40px; } }

/** Sidebar Nav
-----------------------------------------*/
#sidebar_nav {
  width: 280px;
  height: auto;
  background: #fff; }
  @media screen and (max-width: 320px) {
    #sidebar_nav {
      width: auto; } }
  #sidebar_nav .sidebar_header {
    display: flex;
    align-items: flex-end;
    position: relative;
    height: 40px;
    padding: 20px 25px 10px;
    background: #fff; }
    #sidebar_nav .sidebar_header button {
      display: block;
      position: absolute;
      right: 0;
      top: 0;
      width: 48px;
      height: 48px;
      border: none;
      background: center center no-repeat;
      background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%230c4da2%22%3E%3Cpath%20d%3D%22M13.4%2012l5.3-5.3c0.4-0.4%200.4-1%200-1.4s-1-0.4-1.4%200l-5.3%205.3-5.3-5.3c-0.4-0.4-1-0.4-1.4%200s-0.4%201%200%201.4l5.3%205.3-5.3%205.3c-0.4%200.4-0.4%201%200%201.4%200.2%200.2%200.4%200.3%200.7%200.3s0.5-0.1%200.7-0.3l5.3-5.3%205.3%205.3c0.2%200.2%200.5%200.3%200.7%200.3s0.5-0.1%200.7-0.3c0.4-0.4%200.4-1%200-1.4l-5.3-5.3z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E'); }
  #sidebar_nav .sidebar_body {
    padding: 0 20px; }
    #sidebar_nav .sidebar_body ul {
      padding: 20px 0; }
      #sidebar_nav .sidebar_body ul a {
        display: block;
        padding: 6px;
        font-weight: bold;
        color: #0c4da2; }
      #sidebar_nav .sidebar_body ul.nav_main {
        font-size: 1rem;
        border-bottom: 1px solid #eee; }
      #sidebar_nav .sidebar_body ul.nav_sub {
        font-size: .8rem; }

.section {
  margin-bottom: 40px; }
  .section.column {
    padding: 0 10px; }
  .section h1 {
    margin: 0 0 .5rem;
    color: #0c4da2;
    font-size: 18px; }
  .section h2 {
    margin: 0 0 .5rem;
    color: #0c4da2;
    font-size: 18px; }

#wholesale_header {
  padding: 8px 10px;
  border-bottom: 2px solid #fff;
  background: #00B0F0;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
  color: #fff; }
  #wholesale_header #wholesale_name {
    display: inline-block;
    margin: 0 .2rem 0 1rem;
    font-size: 14px; }

/** Carousel
-----------------------------------------*/
.carousel_item {
  position: relative;
  width: 100%;
  padding-top: 75%; }
  .carousel_item .cover {
    object-fit: cover; }

.carousel_dot {
  margin-top: 10px;
  text-align: center; }
  .carousel_dot span {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin: 0 6px;
    text-indent: -9999px;
    background: center center no-repeat;
    background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20viewBox%3D%220%200%2010%2010%22%20width%3D%2210%22%20height%3D%2210%22%20stroke%3D%22%230c4da2%22%20stroke-width%3D%221%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E'); }
    .carousel_dot span.selected {
      background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20viewBox%3D%220%200%2010%2010%22%20width%3D%2210%22%20height%3D%2210%22%20fill%3D%22%230c4da2%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%225%22%20cy%3D%225%22%20r%3D%225%22%2F%3E%3C%2Fsvg%3E'); }

.amp-carousel-button-next {
  right: 0; }

.amp-carousel-button-prev {
  left: 0; }

/** amp-accordion reset
-----------------------------------------*/
.section .amp-accordion_head,
.amp-accordion_head {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
  background: transparent; }

/** Optional Search
-----------------------------------------*/
.optional_search .form_group {
  display: flex;
  align-items: center;
  min-height: 42px;
  margin: 0 0 6px;
  padding: 3px;
  background: #ecf0f1; }
  .optional_search .form_group.multi {
    display: block;
    width: 100%;
    padding: 0 10px; }

.optional_search .expand_toggle {
  display: flex;
  align-items: center;
  height: 42px;
  padding: 0 3px 0 24px;
  border: none;
  outline: none;
  background: left center no-repeat;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23666%22%3E%3Cpath%20d%3D%22M12%201c-6.1%200-11%204.9-11%2011s4.9%2011%2011%2011%2011-4.9%2011-11-4.9-11-11-11zM12%2021c-5%200-9-4-9-9s4-9%209-9c5%200%209%204%209%209s-4%209-9%209z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M16%2011h-3v-3c0-0.6-0.4-1-1-1s-1%200.4-1%201v3h-3c-0.6%200-1%200.4-1%201s0.4%201%201%201h3v3c0%200.6%200.4%201%201%201s1-0.4%201-1v-3h3c0.6%200%201-0.4%201-1s-0.4-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
  font-size: 1rem;
  font-weight: normal;
  color: #333; }

.optional_search section[expanded] .expand_toggle {
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23666%22%3E%3Cpath%20d%3D%22M12%201c-6.1%200-11%204.9-11%2011s4.9%2011%2011%2011%2011-4.9%2011-11-4.9-11-11-11zM12%2021c-5%200-9-4-9-9s4-9%209-9c5%200%209%204%209%209s-4%209-9%209z%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M16%2011h-8c-0.6%200-1%200.4-1%201s0.4%201%201%201h8c0.6%200%201-0.4%201-1s-0.4-1-1-1z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E'); }

.optional_search .form_multi {
  display: block;
  padding-bottom: 10px; }
  .optional_search .form_multi:after {
    content: '';
    display: block;
    clear: both; }
  .optional_search .form_multi.hidden {
    display: none; }
  .optional_search .form_multi label {
    float: left;
    width: auto;
    min-width: 45%;
    margin: 3px 3px 3px 0; }

.optional_search .form_multi_title {
  display: flex;
  align-items: center;
  height: 42px; }

.optional_search label {
  display: block;
  overflow: hidden;
  padding: 0 10px;
/*
  white-space: nowrap;
*/
  font-size: 16px;
  color: #333;
  width: 9rem; }

.optional_search input[type="text"],
.optional_search input[type="date"],
.optional_search input[type="number"],
.optional_search input[type="email"],
.optional_search input[type="tel"],
.optional_search select,
.optional_search textarea {
  width: 100%;
  height: 36px;
  padding-left: 10px;
  padding-right: 10px;
  border: none;
  border-bottom: 2px solid #B0BDC0;
  border-radius: 0;
  outline: none;
  background: transparent;
  font-family: ".SFUIText", sans-serif;
  font-size: 16px;
  color: #333;
  -webkit-appearance: none; }
  .optional_search input[type="text"]:focus,
  .optional_search input[type="date"]:focus,
  .optional_search input[type="number"]:focus,
  .optional_search input[type="email"]:focus,
  .optional_search input[type="tel"]:focus,
  .optional_search select:focus,
  .optional_search textarea:focus {
    border-color: #007AFF; }

.optional_search select {
  padding-right: 40px;
  background: right center no-repeat;
  background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240%22%20height%3D%2220%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22%23819498%22%3E%3Cpath%20d%3D%22M18.7%208.3c-0.4-0.4-1-0.4-1.4%200l-5.3%205.3-5.3-5.3c-0.4-0.4-1-0.4-1.4%200s-0.4%201%200%201.4l6%206c0.2%200.2%200.5%200.3%200.7%200.3s0.5-0.1%200.7-0.3l6-6c0.4-0.4%200.4-1%200-1.4z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E'); }
  .optional_search select.short {
    width: 80px; }

.optional_search textarea {
  height: 5rem; }

.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-justify-content: center;
  width: 100%;
  margin: 15px 0;
  text-align: center;
  font-weight: bold; }
  .btn.btn_search {
    display: block;
    height: 50px;
    background: linear-gradient(to right, #0c4da2 0%, #00eaff 100%);
    font-size: 1rem;
    color: #fff; }
  .btn.btn_detail {
    height: 34px;
    background: linear-gradient(to right, #ff9900 0%, #ffd060 100%);
    font-size: .9rem;
    color: #fff; }
  a.btn.btn_detail {
	text-align:center;
	padding:6px 0;
  }

::-webkit-input-placeholder {
  color: #333; }

/** Footer
-----------------------------------------*/
footer {
  padding: 70px 0 0;
  background: linear-gradient(to bottom, rgba(0, 216, 255, 0) 0px, #0c4da2 70px); }

#footer {
  display: flex;
  padding: 30px 10px 60px;
  background: #0c4da2; }
  #footer .his_id {
    width: 50%;
    padding-right: 10px; }
  #footer .his_id small {
    display: block;
    margin: 5px 0 0;
    font-size: .7rem;
    font-family: ".SFUIText", sans-serif;
    color: rgba(255, 255, 255, 0.8); }
  #footer nav {
    width: 50%;
    padding-left: 10px; }
    #footer nav li {
      margin-bottom: .3rem;
      font-size: .9rem; }
      #footer nav li a {
        color: rgba(255, 255, 255, 0.8); }