@charset "UTF-8";
* {
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
  font-size: 14px;
  word-wrap: break-word;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

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

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

ins {
  background-color: #ff9;
  color: #333;
  text-decoration: none;
}

mark {
  background-color: #ff9;
  color: #333;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

input, select {
  font-size: 14px;
  vertical-align: middle;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
  line-height: 0;
}

/**************************************************************************/
body {
  font-family: 'Roboto', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode","メイリオ", Meiryo, Arial, Verdana, sans-serif;
  background: #fff;
  color: #333;
  line-height: 1.6;
}

input, textarea {
  font-family: 'Roboto', "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode","メイリオ", Meiryo, Arial, Verdana, sans-serif;
  color: #333;
  line-height: 1.6;
}

/*  固定　画像表示 */
.full_img {
  width: 100%;
}

.productimg {
  width: 97%;
}

.logoimg {
  width: 260px;
}

.searchbutton {
  width: 60px;
  height: 50px;
}

.imgharf {
  width: 50%;
}

.catalogimg {
  width: 142px;
}

.img72 {
  margin: 0 1px;
  width: 17%;
}

.imgRL {
  width: 30%;
}

.img100 {
  margin: 0 1px;
  width: 100px;
}

.clearof {
  overflow: hidden;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text_s {
  font-size: 75%;
}

.text_1 {
  color: #FF0000;
}

/*   赤   */
.border_1 {
  margin: 10px 0;
  padding: 10px;
}

.more {
  text-align: right;
}

.red {
  color: #CC3333;
}

.gray {
  color: #7E7E7E;
}

.f_l {
  float: left;
}

.f_r {
  float: right;
}

/*  画像枠 */
.imgborder {
  border: 1px solid #CCC;
}

form {
  margin: 0;
  font-size: 100%;
}

input, textarea {
  padding: 5px;
  font-size: 110%;
}

textarea {
  padding: 5px;
  width: 100%;
}

select {
  font-size: 110%;
  padding: 5px;
}

hr {
  margin: 0 auto;
}

a {
  text-decoration: none;
  outline: none;
}

a:link {
  color: #333;
}

a:visited {
  color: #333;
}

a:hover {
  color: #999;
}

a:active {
  color: #999;
}

/* contents
----------------------------------------------------*/
#page {
  width: 100%;
  margin: 0 auto;
  padding: 0;
  font-size: 100%;
  color: #333333;
  -webkit-text-size-adjust: none;
}

.info {
  margin: 10px auto;
  text-align: left;
  color: #333333;
  line-height: 15px;
}

/*  100%    */
section {
  display: block;
  width: auto;
  margin: 0px auto 15px;
}

footer section {
  margin: 0 !important;
}

/*  97% */
/*  section内title等  */
section > :not([class="full"]):not([class="title"]):not([class="accordion"]):not([class="freearea"]):not([class="pager"]):not([class="pagelist"]):not([class="titlebar_list"]):not([class="titlebar_g"]):not([class="titlebar_g_o"]):not([class="titlebar_b"]):not([id="sub_img"]):not([id="imgRL"]):not([id="product_img"]):not([class="customersbox"]):not([class="bgn2"]) {
  margin-left: 10px;
  margin-right: 10px;
  width: auto;
}

/*  検索box   */
#searchbox {
  display: none;
  position: absolute;
  top: 0;
  background: #000;
  margin: 0 auto;
  padding-bottom: 10px;
  text-align: left;
  width: 100%;
  color: #fff;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.8);
}

/*下検索*/
#searchbox2 {
  margin: 0 auto;
  text-align: left;
  width: 100%;
}

#searchbox .title {
  text-align: left;
  width: 95%;
  text-shadow: none;
  padding: 10px 0;
  background: none;
  box-shadow: none;
}

#searchbox h1 {
  color: #fff;
  text-shadow: none;
}

#search_form div {
  margin: 10px 0;
}

.search_form {
  width: 100%;
  background: #FFF;
  padding: 10px;
  margin: 0 auto;
  color: #333333;
}

.search_form select {
  width: 100%;
}

.search_form .input_l input {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

#searchbox2 .search_form {
  background: #EEE;
  line-height: 1.6;
  padding: 15px 15px 5px;
}

.search_form .keyword_search,
.search_form .price_search {
  padding: 10px 0 5px;
  display: inline-block;
}

#close {
  text-align: center;
  color: #333333;
  background: #FFF;
  position: absolute;
  padding: 16px 15px;
  top: 0px;
  right: 10px;
  font-size: 150%;
}

#close {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*  HEADER  */
#header {
  margin: 0 auto 10px;
}

#header section {
  margin: 0;
  width: 100%;
}

/*  logo    */
/*

.logo {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}

.logo .l {
  float: left;
}

.logo .r {
  float: right;
}
*/
/*  マイページ*/
/*
#header nav {
  margin: 10px auto 10px;
  text-align: center;
  width: 100%;
}

#header nav a {
  text-decoration: none
}
*/
/* header common */
/*
#header ul {
  list-style-type: disc;
  padding: 0 25px
}

#header ol {
  list-style-type: decimal;
  padding: 0 25px
}
*/
/* header toppage */
/*
#top_header ul {
  list-style-type: disc;
  padding: 0 25px
}

#top_header ol {
  list-style-type: decimal;
  padding: 0 25px
}
*/
#contents {
  margin: 0 auto 10px;
}

/*  tag */
.tag {
  margin: 0 0 10px;
}

.tagline {
  color: #999;
  font-size: 75%;
}

.recommend {
  color: #FF9900;
  margin-right: 3px;
  font-size: 90%;
  display: inline-block;
}

.recommend img {
  vertical-align: -2px;
}

.price {
  color: #CC3333;
  font-size: 85%;
}

.fixedprice {
  text-decoration: line-through !important;
  color: #333333;
  font-size: 85%;
}

.catch {
  display: block;
  font-size: 110%;
  font-weight: bold;
  color: #333;
  margin: 10px 0 10px;
  text-shadow: none;
  line-height: 25px;
}

/*  NEWS date   */
.date {
  color: #686868;
}

.new {
  background: #BE1F0F;
  color: #fff;
  width: 100px;
  padding: 2px 3px;
  font-size: 75%;
  margin-right: 3px;
  text-shadow: none !important;
}

.sale {
  background: #E9D108;
  color: #fff;
  width: 100px;
  padding: 2px 3px;
  font-size: 75%;
  margin-right: 3px;
  white-space: nowrap;
  text-shadow: none !important;
}

.soldout {
  font-size: 75%;
  text-align: right;
}

.soldout span {
  color: #CC3333;
  width: 93%;
  text-align: center;
  border: solid 2px #D60000;
  background: #FFF;
  padding: 3px;
  font-weight: bold;
  display: inline-block;
  border-radius: 5px;
}

.pickup {
  color: #fff;
  width: 100px;
  padding: 2px 3px;
  font-size: 75%;
  margin-right: 3px;
  background: #FF3300;
  white-space: nowrap;
  text-shadow: none !important;
}

.member {
  color: #fff;
  width: 100px;
  padding: 2px 3px;
  font-size: 75%;
  margin-right: 3px;
  background: #999999;
  white-space: nowrap;
  text-shadow: none !important;
}

.cool {
  color: #fff;
  width: 100px;
  padding: 2px 3px;
  font-size: 75%;
  margin-right: 3px;
  background: #0033ff;
  white-space: nowrap;
  text-shadow: none !important;
}

.listmenu .date, .comment_l .date {
  font-size: 75%;
}

.note {
  color: #333333;
  font-size: 75%;
}

/*  freearea    */
.freearea {
  margin: 0 10px;
}

/*  title   */
#contents .title {
  margin: 20px 10px 15px;
  padding: 0px 10px;
  background: #FFFFFF;
  color: #333;
  vertical-align: middle;
  text-align: left;
  border-left: solid 3px #A40000;
}

.title h1 {
  display: inline;
  font-size: 130%;
  margin: 0;
  padding: 0 0 0 0px;
  text-align: left;
  letter-spacing: 2px;
}

.title img {
  margin: 0;
  vertical-align: top;
  margin-left: 5px;
}

/*  一覧はこちら  */
.title p {
  float: right;
  margin-right: 10px;
  margin-top: -5px;
  padding: 6px 0;
  height: 20px;
}

.title p a {
  margin: 0 auto 0;
  padding: 4px 20px 4px 10px;
  height: 20px;
  text-decoration: none;
  font-size: 75%;
  border: 1px solid #333;
  background: #666 url("../img/icon_title_tri.png") no-repeat 95% center;
  font-weight: bold;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: #ffffff;
  text-shadow: 3px 3px 3px #000;
  vertical-align: middle;
  text-align: left;
}

.title_c {
  margin: 0 0 10px;
  padding: 8px 0;
  font-size: 110%;
  background: none;
  color: #333;
  width: auto;
  vertical-align: middle;
  margin: 0 auto;
  text-align: center;
}

.title_c h1 {
  color: #333;
  letter-spacing: 2px;
}

/*  タイトルバー  */
.titlebar {
  padding: 0 4px;
  margin: 0;
  font-size: 110%;
  background: #EEEEEE;
  color: #333333;
  text-shadow: none;
  border: 1px solid #999;
  border-top: none;
  vertical-align: middle;
  text-align: left;
}

.titlebar_list .accordion:first-of-type {
  border-top: 1px solid #999;
}

.titlebar .open {
  text-align: left;
  padding: 10px 25px 10px 4px;
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_open1.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar .open.active {
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_close1.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar .closed {
  text-align: left;
  padding: 10px 4px;
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_close1.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar .closed.active {
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_open1.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

/*  タイトルバー green    */
.titlebar_g_o {
  padding: 10px 8px;
  margin: 0;
  font-size: 120%;
  background: #DDD;
  color: #333333;
  text-shadow: none;
  vertical-align: middle;
  text-align: left;
}

.titlebar_g .open {
  padding: 10px 4px;
  background-image: url("../img/arrow_close_g1.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_g .open.active {
  background-image: url("../img/arrow_open_g1.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_g .closed {
  padding: 10px 4px;
  background-image: url("../img/arrow_open_g1.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_g .closed.active {
  background-image: url("../img/arrow_close_g1.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_g {
  padding: 0 4px;
  margin: 0;
  font-size: 120%;
  background: url("../img/gradation_green_401.png") repeat-x 97% center;
  color: #ffffff;
  text-shadow: none;
  vertical-align: middle;
  text-align: left;
}

#pi_cart.stock {
  border: solid 1px #AAAAAA;
  margin: 10px 10px 20px;
}

/*  タイトルバー blue */
.titlebar_b {
  padding: 5px 8px;
  font-size: 100%;
  background: #EEEEEE;
  color: #333333;
  text-shadow: none;
  vertical-align: middle;
  text-align: left;
}

#read .accordion {
  margin: 0;
  border-bottom: 1px solid #333333;
}

#read .accordion:first-of-type {
  border-top: 1px solid #333333;
}

.titlebar_b + aside {
  text-align: left;
  padding: 10px 0;
  border-top: 1px solid #333333;
}

.titlebar_b .open {
  padding: 10px 4px 10px 5px;
  background-image: url("../img/arrow_open_gl.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_b .open.active {
  background-image: url("../img/arrow_close_gl.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_b .closed {
  padding: 10px 4px 10px 5px;
  background-image: url("../img/arrow_close_gl.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.titlebar_b .closed.active {
  background-image: url("../img/arrow_open_gl.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

/*  カテゴリータイトル   */
.categorybar {
  padding: 6px 4px;
  text-align: left;
  margin: 0;
  font-size: 100%;
  background: #FFFFFF;
  vertical-align: middle;
}

.categorylink {
  background: #FFFFFF !important;
  vertical-align: middle;
  border-left: solid 1px #CCC;
  border-right: solid 1px #CCC;
}

/*  listmenu    */
section .listmenu, .itemlist {
  margin: 10px auto 20px;
  word-wrap: break-word;
}

.itemlist li, .listmenu li {
  border: 1px solid #999999;
  border-left: none;
  border-right: none;
  border-bottom: none;
  list-style-type: none;
  text-align: left;
  font-size: 100%;
  line-height: 20px;
}

/*  list LR*/
.li_l {
  margin: 0 20px 0 0;
  float: left;
}

.li_r {
  overflow: hidden;
  padding-bottom: 5px;
  line-height: 1.2;
}

/*キャッチコピー削除*/
.li_r .tagline {
  display: none;
}

.listmenu li a, .itemlist a, .titlebar + aside a, .bgn li a {
  padding: 12px 12px;
  overflow: hidden;
  display: block;
  text-decoration: none;
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_tri1.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.ar_link_r a {
  background: none;
}

.listmenu li, .itemlist li, .titlebar + aside a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0.4);
}

.itemlist li:last-child, .listmenu li:last-child, .bgn li:last-child {
  border-bottom: 1px solid #999999;
}

/*  news icon   */
#news .listmenu li:first-child {
  margin: 0;
}

#news .listmenu a {
  padding-left: 35px;
  background-image: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_tri1.png"), url("../img/icon_news1.jpg");
  background-position: 97% center, 5px center;
  background-repeat: no-repeat, no-repeat;
}

#news .listmenu span {
  color: #000;
}

.itemlist, .titlebar + aside ul, .formlist ul {
  margin: 0;
}

.payment ul {
  margin: 0;
}

.payment li {
  padding: 5px 12px;
  padding-left: 35px;
  overflow: hidden;
  display: block;
  text-decoration: none;
  background-image: url("../img/icon_news1.jpg");
  background-position: 5px center;
  background-repeat: no-repeat, no-repeat;
  list-style-type: none;
  text-align: left;
}

/*  背景無し    */
.titlebar + aside .listmenu li, .formlist ul li {
  margin: 0;
  background: #fff;
}

.bgn li {
  border: 1px solid #CCCCCC;
  background: #fff;
  border-bottom: none;
  list-style-type: none;
  text-align: left;
  font-size: 100%;
  line-height: 20px;
}

.bgn {
  margin: 5px auto;
}

.bgn2 .categorylink {
  margin: 0;
  border-top: 1px solid #999999 !important;
}

/*  accordion top処理*/
.titlebar + aside .listmenu li:first-child {
  border-top: none;
}

.listmenu2 ul {
  list-style-type: none;
  margin: 0 auto;
  width: 97%;
}

.listmenu2 .l {
  float: left;
  overflow: hidden;
  width: 49%;
  text-align: left;
}

.listmenu2 .r {
  float: right;
  width: 49%;
  text-align: left;
}

.listmenu2 .l li, .listmenu2 .r li {
  border-right: none;
  border-left: none;
}

.listmenu3 {
  margin: 5px auto;
  width: 97%;
  text-shadow: none;
}

.listmenu3 .l {
  float: left;
  overflow: hidden;
  width: 49%;
  text-align: center;
}

.listmenu3 .r {
  float: right;
  overflow: hidden;
  width: 49%;
  text-align: center;
}

.listmenu3 a {
  border: 1px solid #999;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc) !important;
  color: #333333;
  padding: 20px 0 !important;
  text-decoration: none;
  display: block;
}

/*  ranking */
.whitelist li:nth-child(odd) {
  padding: 4px 5px;
}

.whitelist li:nth-child(even) {
  background: none;
  padding: 4px 5px;
}

/* input */
.input_l input {
  width: 100%;
}

.input_m input {
  width: 50%;
}

.input_s input {
  width: 20%;
}

.input_2 input {
  width: 40%;
}

.copy {
  margin-top: 15px !important;
  text-align: center;
  font-size: 75%;
}

.copy, .ch {
  text-align: center;
  margin: 10px auto;
}

/*  商品説明    */
.description {
  margin: 0;
  padding: 0;
  /*border-bottom: 1px solid #CCCCCC;*/
}

.description .titlebar_g_o {
  display: none;
}

.description aside {
  margin: 10px 10px;
  text-align: left;
  height: auto !important;
  overflow: hidden;
}

.description aside ul {
  list-style-type: disc;
  padding: 0 25px;
}

.productprice {
  margin: 20px 5px 0;
  text-align: left;
}

.productprice p {
  font-size: 120%;
  font-weight: bold;
  display: inline;
}

.productprice div:last-child {
  font-size: 75%;
  /*margin-top: 10px;*/
}

.description .seemore {
  padding: 5px 5px 0;
  text-align: center;
  font-size: 120%;
  color: #3B91D6;
  display: none !important;
}

/*  在庫返品sns */
.form_menu {
  margin: 10px 0;
}

.sns {
  margin: 20px 0;
  position: relative;
  overflow: hidden;
}

.sns ul {
  position: relative;
  left: 50%;
  float: left;
  list-style-type: none;
}

.sns li {
  position: relative;
  left: -50%;
  float: left;
  margin: 0 5px;
}

/*  商品詳細    */
.product_name ul {
  margin: 5px auto;
  width: 97%;
  line-height: 20px;
  text-align: left;
  list-style-type: none;
}

.product_name li {
  margin: 6px 0;
  text-align: left;
}

.product_name dt {
  width: 70px;
  padding: 5px 0;
  display: block;
  float: left;
  margin: 5px 0;
  text-align: left;
}

.product_name dd {
  text-align: left;
  width: 65%;
  padding: 5px 0;
  display: block;
  margin: 5px 0;
  float: left;
}

/*  商品画像    */
#main {
  margin: 0 auto;
  text-align: center;
}

.product_img .nb {
  position: relative;
  overflow: hidden;
}

.product_img ul {
  position: relative;
  left: 50%;
  float: left;
  list-style-type: none;
}

.product_img li {
  position: relative;
  left: -50%;
  float: left;
  margin: 0 3px;
}

.product_img li p {
  display: table-cell;
  vertical-align: middle;
  height: 200px;
}

/*  サムネール   */
#sub_img, #imgRL {
  margin: 10px auto;
  padding: 0 2px;
  text-align: center;
}

.comment {
  margin: 10px 0;
}

.comment .plus, .comment .minus {
  margin: 5px 0;
}

.review .comment:last-of-type {
  border-bottom: 1px solid #CCCCCC;
}

.arrowbg {
  border-left: 15px solid transparent;
  border-top: 16px solid #999;
  position: absolute;
  bottom: 5px;
  left: 119px;
  width: 0;
  height: 14px;
}

.arrow {
  border-left: 14px solid transparent;
  border-top: 14px solid #fff;
  position: absolute;
  bottom: 5px;
  left: 121px;
  width: 0;
  height: 15px;
}

/*  form 1 */
.shopping_form {
  text-align: left;
}

.shopping_form .variation1, .variation2, .variation3 {
  border-collapse: collapse;
  border-spacing: 0;
  width: 97%;
  margin: 10px auto 30px;
  table-layout: auto;
  background: #FFF;
}

/*  バリエリスト見出し */
.shopping_form .variation1 th, .variation2 th, .variation3 th {
  padding: 10px 5px;
  font-size: 75%;
  background: #F4F4F4;
  border: 1px solid #DDD;
  color: #333;
}

.shopping_form .variation1 td, .variation2 td {
  padding: 10px 10px;
  border: 1px solid #DDD;
  vertical-align: middle;
  text-align: left;
}

.variation3 th, .variation3 td {
  border: 1px solid #DDD;
  font-size: 100%;
}

.shopping_form .variation3 {
  width: 50%;
  text-align: center;
}

/*  button select   */
.shopping_form select {
  margin: 5px 0;
  text-align: left;
  width: 93%;
}

.shopping_form p {
  margin: 10px auto;
  text-align: center;
}

.shopping_form .variation1 td:nth-child(1) {
  width: 80%;
  font-size: 75%;
}

.shopping_form .variation1 td:nth-child(2) {
  width: 5%;
  text-align: center;
  white-space: normal;
}

.shopping_form .variation1 td:nth-child(3) {
  width: 15%;
  white-space: nowrap;
  text-align: center;
  padding: 0 5px;
}

.shopping_form .soldout {
  font-size: 75%;
  text-align: center;
}

.variation1 img {
  width: 104px;
  height: 24px;
}

.variation2 td:nth-child(1) {
  width: 80%;
  font-size: 75%;
}

.variation2 td:nth-child(2) {
  width: 5%;
  border-right: 1px solid #fff;
  text-align: center;
}

.variation2 td:nth-child(3) {
  width: 15%;
}

.variation2 a {
  margin-left: 5px;
}

.variation2 .ok {
  color: #359e65;
}

.variation2 .few {
  color: #ef9848;
}

/*  備考購入数   */
.remark {
  margin: 5px 0;
  text-align: left;
  width: 100%;
}

.remark dl {
  font-size: 120%;
}

.remark dt {
  float: left;
  width: 22%;
  margin: 5px 0;
  vertical-align: middle;
}

.remark dd {
  float: none;
  margin: 3px 0;
  white-space: nowrap;
}

.remark span {
  position: relative;
  top: 5px;
  display: block;
}

.remark td {
  vertical-align: middle;
}

.remark .l {
  width: 30%;
}

.remark .r {
  width: 70%;
  text-align: left;
}

.input100 {
  width: 80%;
}

.input10 {
  width: 20%;
}

.stock hr {
  border-color: #939394;
}

.stock select {
  max-width: 100%;
}

.pager {
  margin: 0 auto;
  padding: 5px 0;
  background: #EEEEEE;
  color: #666666;
  text-align: left;
  font-size: 80%;
}

.sort {
  margin: 5px auto 5px;
  padding: 0;
  width: 90%;
  text-align: center;
}

.sortimg {
  width: 52px;
  height: 36px;
}

.mailicon {
  width: 34px;
  height: 24px;
}

.req {
  margin: 5px 0;
  text-align: left;
  font-size: 75%;
}

.req span {
  position: relative;
  top: -8px;
}

/*  cssonly */
.pagelist {
  margin: 10px auto 5px;
  text-align: center;
  font-size: 80%;
}

.pagelist2 {
  margin: 20px auto 5px;
  text-align: center;
  font-size: 80%;
}

.pagelist li, .pagelist2 li {
  display: inline;
  margin: 0 2px;
  color: #666;
}

.pagelist li span, .pagelist2 li span {
  display: -moz-inline-box;
  display: inline-block;
  padding: 8px 8px;
  border: 1px #5A5A5A solid;
  font-weight: bold;
  text-shadow: none;
  background: #767676;
  background: -moz-linear-gradient(top, #767676, #343434);
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  color: #FFF;
}

.pagelist li a, .pagelist2 li a {
  display: -moz-inline-box;
  display: inline-block;
  padding: 8px 8px;
  border: 1px #999999 solid;
  font-weight: bold;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc);
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  color: #333333;
  text-decoration: none;
  text-shadow: none;
}

.pagelist li a:hover, .pagelist2 li a:hover {
  border: 1px #666 solid;
  background: #767676;
  background: -moz-linear-gradient(top, #767676, #343434);
  color: #FFF;
}

.pagelist .back a, .pagelist2 .back a {
  padding: 13px 7px 13px 33px;
  background: #ccc url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") no-repeat 5% center;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") no-repeat 5% center, -moz-linear-gradient(top, #ffffff 0%, #cccccc 100%);
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") no-repeat 5% center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #cccccc));
  color: #4D4D4D;
  text-decoration: none;
  vertical-align: middle;
}

.pagelist .back a:hover, .pagelist2 .back a:hover {
  background: #ccc url("../img/arrow_left_w.png") no-repeat 5% center;
  background: url("../img/arrow_left_w.png") no-repeat 5% center, -moz-linear-gradient(top, #767676 0%, #343434 100%);
  background: url("../img/arrow_left_w.png") no-repeat 5% center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #767676), color-stop(100%, #343434));
  color: #fff;
}

.pagelist .next a, .pagelist2 .next a {
  padding: 13px 33px 13px 7px;
  background: #ccc url("../img/arrow_right_bk.png") no-repeat 95% center;
  background: url("../img/arrow_right_bk.png") no-repeat 95% center, -moz-linear-gradient(top, #ffffff 0%, #cccccc 100%);
  background: url("../img/arrow_right_bk.png") no-repeat 95% center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #cccccc));
  color: #4D4D4D;
  text-decoration: none;
  vertical-align: middle;
}

.pagelist .next a:hover, .pagelist2 .next a:hover {
  background: #ccc url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -moz-linear-gradient(top, #767676 0%, #343434 100%);
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -webkit-gradient(linear, left top, left bottom, color-stop(0%, #767676), color-stop(100%, #343434));
  color: #fff;
}

/*back disable*/
.pagelist .back_b, .pagelist2 .back_b {
  display: -moz-inline-box;
  display: inline-block;
  padding: 13px 7px 13px 33px;
  border: 1px solid #cccccc;
  font-weight: bold;
  background: #eee url("../img/arrow_left2.png") no-repeat 5% center;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  color: #bbbbbb;
  text-shadow: none;
  vertical-align: middle;
}

/*next disable*/
.pagelist .next_b, .pagelist2 .next_b {
  display: -moz-inline-box;
  display: inline-block;
  padding: 13px 33px 13px 7px;
  border: 1px solid #cccccc;
  font-weight: bold;
  background: #eee url("../img/arrow_right_bk2.png") no-repeat 95% center;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  color: #bbbbbb;
  text-shadow: none;
  vertical-align: middle;
}

.result {
  position: relative;
  overflow: hidden;
}

.result ul {
  position: relative;
  left: 50%;
  float: left;
  list-style-type: none;
}

.result li {
  position: relative;
  left: -50%;
  float: left;
  margin: 0 -10px;
  font-size: 120%;
}

.result .back {
  background: url("../img/preview_h30_w80_not_active.png") no-repeat 0 0;
  text-align: left;
  display: block;
  padding: 6px 25px;
  font-size: 150%;
}

.result .next {
  background: url("../img/next_h30_w80_not_active.png") no-repeat center right;
  text-align: left;
  display: block;
  padding: 8px 25px;
  font-size: 150%;
}

.result .back:hover {
  background: url("../img/preview_h30_w80_active.png") no-repeat 0 0;
}

.result .next:hover {
  background: url("../img/next_h30_w80_active.png") no-repeat 0 right;
}

.result a {
  text-decoration: none;
  color: #fff;
  font-weight: bold;
  display: block;
  text-shadow: none;
  padding: 6px 25px;
}

/*  ボタン */
.btn {
  margin: 0 auto;
}

.btn button {
  width: 80%;
  margin: 20px auto;
  border: 1px solid #999;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc);
  color: #333333;
  text-align: center;
  font-weight: bold;
  vertical-align: middle;
  padding: 10px 3px;
  color: #333333;
  text-decoration: none;
  vertical-align: middle;
  display: block;
}

.submit {
  margin: 10px auto;
  text-align: center;
}

/* 検索   */
.submit_gr {
  font-size: 100%;
  width: 50%;
  padding: 8px 3px;
  letter-spacing: 2px;
  font-weight: bold;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  border: none;
  background: #325E49;
  color: #FFF;
}

.submit_or {
  width: 70%;
  margin: 0 auto;
  color: #fff !important;
  border: 1px solid #325E49 !important;
  background: #325E49;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -moz-linear-gradient(top, #325E49, #325E49);
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -webkit-gradient(linear, left top, left bottom, from(#325E49), to(#325E49));
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
  font-size: 100%;
  padding: 12px 30px 12px 0px;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
  display: block;
  text-align: center;
}

/* カート */
.shopping_form .variation1 td, .variation2 td {
  padding: 10px 5px;
}

.curt_s {
  padding: 5px 3px;
  font-size: 75%;
  width: 100%;
  min-width: 8em;
}

.curt_l {
  padding: 10px;
  font-size: 120%;
  width: 80%;
  color: #fff !important;
  font-weight: bold;
}

.curt_s, .curt_l {
  border: 1px solid #325E49 !important;
  background: #325E49;
  background: -moz-linear-gradient(top, #325E49, #325E49);
  margin: 0 auto;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
}

.curt_l button:hover, .curt_s button:hover {
  border-top-color: #325E49;
  border-left-color: #325E49;
  border-bottom-color: #fff;
  border-right-color: #fff;
  background: #325E49;
  color: #ffffff;
}

.curt_l button:active, .curt_s button:active {
  border-top-color: #325E49;
  background: #325E49;
}

/* 入荷連絡を希望する   */
.request_s {
  padding: 5px 3px;
  font-size: 75%;
  width: 100%;
}

.request_l {
  padding: 10px;
  font-size: 120%;
  width: 80%;
  color: #fff !important;
  font-weight: bold;
}

.request_s, .request_l {
  border: 1px solid #336699;
  background: #999999;
  background: -moz-linear-gradient(top, #99CCFF, #3366CC);
  margin: 0 auto;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
}

.request_l button:hover, .request_s button:hover {
  border-top-color: #3366CC;
  border-top-left: #3366CC;
  background: #3366CC;
}

.request_l button:active, .request_s button:active {
  border-top-color: #1b435e;
  background: #3366CC;
}

/*      */
.formtable {
  margin: 0 auto;
  width: 97%;
}

.formtable h3 {
  margin: 5px auto;
  text-align: left;
}

.formtable table {
  border: 1px #999999 solid;
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  font-size: 90%;
  color: #333333;
}

.formtable table th {
  padding: 5px;
  border: #999999 solid;
  border-width: 0 0 1px 1px;
  background: #EDF2ED;
  font-weight: bold;
  line-height: 120%;
  text-align: left;
}

.formtable table td {
  padding: 5px;
  border: 1px #999999 solid;
  border-width: 0 0 1px 1px;
  text-align: left;
}

.formtable table .l {
  padding: 5px;
  border: #999999 solid;
  border-width: 0 0 1px 1px;
  background: #EEEEEE;
  line-height: 120%;
  text-align: left;
  width: 40%;
}

.formtable table .r {
  padding: 5px;
  border: 1px #999999 solid;
  border-width: 0 0 1px 1px;
  text-align: left;
  width: 60%;
}

.table2 {
  margin: 5px 0;
}

.table2 td {
  background: #EEEEEE;
}

.table2 td[rowspan="2"] {
  width: 100px;
  height: 100px;
  vertical-align: middle;
}

.table2 td:only-of-type {
  vertical-align: middle;
  background: none;
}

.formtable .table3 td:nth-child(1) {
  width: 48%;
}

.formtable .table3 td:nth-child(2) {
  width: 26%;
  text-align: center;
}

.formtable .table3 td:nth-child(3) {
  width: 26%;
  text-align: center;
}

.formtable .table4 td:nth-child(1) {
  width: 45%;
  vertical-align: top;
}

.formtable .table4 td:nth-child(2) {
  width: 18%;
}

.formtable .table4 td:nth-child(3) {
  width: 17%;
}

.formtable .table4 td:nth-child(4) {
  width: 20%;
}

.required {
  margin: 10px auto;
  text-align: left;
  width: 97%;
  color: #333333;
}

.error {
  color: #FF0000;
  border: 1px solid #f00;
  padding: 20px 0;
  text-align: left;
}

.attention {
  margin: 2em 1em;
  border: 1px solid #F00;
  padding: 0.5em;
}

.formbox {
  margin: 0 auto;
  padding-bottom: 20px;
  text-align: center;
  border: 1px solid #CCCCCC;
  overflow: hidden;
}

.formbox_n {
  margin: 0 auto;
  padding-bottom: 20px;
  text-align: center;
}

.formbox input, textarea {
  color: #666;
  border: 1px solid #999;
}

.formbar {
  margin: 0;
  padding: 10px;
  text-align: left;
  background: #EEEEEE;
  border-bottom: 1px solid #CCCCCC;
}

.formbar2 {
  margin: 0;
  padding: 10px;
  text-align: left;
  background: #EEEEEE;
  border-bottom: none;
}

.formlist {
  margin: 20px auto;
  padding: 10px 0;
  text-align: center;
}

.formlist .bar {
  margin: 0;
  padding: 10px;
  text-align: left;
  background: #EEEEEE;
  border: 1px solid #CCCCCC;
  border-bottom: none;
}

.formcontents {
  margin: 0 auto;
  width: 95%;
}

.formcontents dl {
  margin: 0 auto;
  list-style-type: none;
  width: 95%;
}

.formcontents dt {
  margin: 10px auto;
  text-align: center;
}

.formcontents dd {
  margin: 10px auto;
  text-align: left;
}

.formcontents p {
  margin: 20px auto;
}

.formbar2 + .formcontents p {
  margin: 10px auto;
}

.radio {
  position: relative;
  top: -4px;
}

.formcontents ul li {
  word-wrap: break-word;
}

/*  button orange固定 */
.button_or input {
  width: 70%;
  margin: 10px auto;
  font-size: 100%;
  padding: 15px 20px;
  border: 1px solid #FF6600;
  background: #ffcc99;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 97% center, -moz-linear-gradient(top, #ffcc99, #ff9900);
  /* For Internet Explorer 5.5 - 7  */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffcc99, endColorstr=#ff9900);
  /* For Internet Explorer 8 */
  -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffcc99, endColorstr=#ff9900);
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}

/*  button  orange2固定   */
.button_closing input {
  width: 70%;
  margin: 0 auto;
  font-size: 100%;
  padding: 15px 20px;
  border: 1px solid #F4BD2B;
  background: #ffffff;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 97% center, -moz-linear-gradient(top, #ffe885, #f4b81c);
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  font-weight: bold;
  vertical-align: middle;
}

/*  button gray可変*/
.button {
  margin: 40px auto;
  font-size: 100%;
  text-align: center;
}

.btg_r, .btg_l {
  display: inline;
}

.btg_l a {
  border: 1px solid #5A5A5A;
  width: 100%;
  padding: 15px 10px 15px 40px;
  text-shadow: 0 1px 1px #ccc;
  text-decoration: none;
  color: #4D4D4D;
  background: #ffffff;
  font-size: 75%;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") no-repeat 5% center, -moz-linear-gradient(top, #ffffff, #cccccc);
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") no-repeat 5% center, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#CCCCCC));
}

.btg_r button, .btg_r input, .btg_r a {
  border: 1px solid #5A5A5A;
  padding: 15px 40px 15px 10px;
  text-shadow: 0 1px 1px #ccc;
  text-decoration: none;
  color: #4D4D4D;
  background: #ffffff;
  font-size: 75%;
  display: inline;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  background: url("../img/rightarrow1.png") no-repeat 95% center, -moz-linear-gradient(top, #ffffff, #cccccc);
  background: url("../img/rightarrow1.png") no-repeat 95% center, -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#CCCCCC));
}

.bto_r input {
  border: 1px solid #FF6600;
  padding: 15px 40px 15px 10px;
  text-shadow: 0 1px 1px #ccc;
  text-decoration: none;
  color: #fff;
  background: #ffcc99;
  font-size: 75%;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -moz-linear-gradient(top, #ffcc99, #ff9900);
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_right.png") no-repeat 95% center, -webkit-gradient(linear, left top, left bottom, from(#ffcc99), to(#ff9900));
  border-radius: 1px;
}

.form_t {
  margin: 10px 0 0;
  text-align: left;
}

.form_t p {
  margin: 10px 0 5px;
  padding: 0px 0 0px 10px;
  font-size: 110%;
  vertical-align: middle;
  text-align: left;
  font-weight: bold;
  border-left: solid 3px #a40000;
}

.address {
  margin: 0;
  display: inline;
}

.address input {
  width: 50%;
  margin: 0;
  height: 44px;
  padding: 0px 10px;
  border: 1px solid #999;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc);
  color: #333333;
  text-align: center;
  font-weight: bold;
  border-radius: 1px;
  vertical-align: middle;
  display: inline;
  font-size: 100%;
  text-decoration: none;
}

.formnavi {
  margin: 0 auto;
}

.formnavi dl, .formnavi div {
  margin: 20px auto;
  width: 90%;
}

.formnavi dt {
  float: left;
  width: 47%;
  text-align: left;
}

.formnavi dd {
  float: right;
  width: 47%;
  text-align: right;
}

.ar_link_l {
  width: 80%;
  padding: 5px 0 5px 25px;
  text-align: left;
  margin: 10px 0;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left_18_18.png") no-repeat 0 center;
  margin-left: 1px;
  text-indent: -1px;
}

.ar_link_r {
  width: 80%;
  padding: 5px 0 5px 25px;
  text-align: left;
  margin: 10px 0;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_18_18.png") no-repeat 0 center;
  margin-left: 1px;
  text-indent: -1px;
}

.formnavi .a_l {
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_left.png") left center;
  background-repeat: no-repeat;
  background-position: 5% center;
  padding: 15px 0px 15px 35px;
  color: #4D4D4D;
  text-shadow: 0 1px 1px #ccc;
  text-decoration: none;
  vertical-align: middle;
  display: block;
}

.formnavi .a_r {
  background-image: url("../img/arrow_right_bk.png");
  background-repeat: no-repeat;
  background-position: 95% center;
  padding: 15px 35px 15px 0px;
  color: #4D4D4D;
  text-shadow: 0 1px 1px #ccc;
  text-decoration: none;
  vertical-align: middle;
  display: block;
}

.del {
  margin: 5px auto;
}

.edit {
  margin: 15px auto;
}

.del input {
  padding: 5px 10px;
  border-radius: 1px;
  font-size: 12px;
  line-height: 1.1;
  border: 1px #666 solid;
  background: #767676;
  background: -moz-linear-gradient(top, #767676, #343434);
  color: #fff;
  text-decoration: none;
}

.edit input {
  padding: 5px 10px;
  border-radius: 1px;
  font-size: 12px;
  line-height: 1.1;
  border: 1px #999999 solid;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc);
  color: #4D4D4D;
  text-decoration: none;
}

.update input {
  padding: 5px 10px;
  border-radius: 1px;
  font-size: 12px;
  line-height: 1.1;
  border: 1px #999999 solid;
  background: #ffffff;
  background: -moz-linear-gradient(top, #ffffff, #cccccc);
  color: #4D4D4D;
  text-decoration: none;
}

/*  ranking */
.prize {
  font-size: 130%;
  background: -moz-linear-gradient(top, #FCFDFC 0%, #DDDCDD 100%) !important;
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FCFDFC), color-stop(100%, #DDDCDD)) !important;
  color: #333333;
}

.prize img {
  position: relative;
  top: 3px;
  margin-right: 3px;
}

.commentbox {
  margin: 0 auto;
  padding-bottom: 20px;
  overflow: hidden;
  border: 1px solid #CCCCCC;
}

.commentbar {
  margin: 0;
  padding: 10px;
  text-align: left;
  background: #EDF2ED;
  border-bottom: 1px solid #CCCCCC;
}

.commentcontents {
  margin: 10px auto;
  width: 95%;
  text-align: left;
  font-size: 90%;
}

.commentcontents p {
  text-align: left;
}

.commentcontents div {
  margin: 10px auto;
}

.yet {
  color: #7E7E7E;
}

section .customersbox:last-of-type {
  border-bottom: 1px solid #CCCCCC;
}

.customerscomment, .shopcomment {
  margin: 0 auto;
  width: 100%;
  display: block !important;
}

.customerbar {
  border-top: 1px solid #CCCCCC;
  color: #333333;
  background: #FCFDFC;
  background: -moz-linear-gradient(top, #FCFDFC, #E8EEE8);
  padding: 5px 3px;
}

.customerscomment p {
  margin: 10px auto;
  color: #333333;
  text-align: left;
}

.minus {
  display: none;
  color: #333333;
  text-align: left;
}

.shopcomment p {
  text-align: left;
  background: #FCEAE2;
  margin: 10px 0;
  padding: 8px;
}

.shopcomment .f_l, .shopcomment .f_r {
  padding: 6px 0;
  font-size: 75%;
}

.shopcomment .f_r {
  margin-right: 22px;
}

.shopcomment .f_l {
  background: url("../img/shopicon_43_20.png") no-repeat 0 center;
  padding-left: 50px;
  color: #3B91D6;
  width: 138px;
}

.plus {
  margin: 0;
  background-image: url("../img/plus.png");
  background-repeat: no-repeat;
  background-position: right center;
  padding: 2px 0;
}

.plus.active {
  background-image: url("../img/minus.png");
}

.plus.act {
  background-image: url("../img/minus.png");
}

.plus.act2 {
  background-image: url("../img/minus.png");
}

/*
.shopcomment .minus:before,
.shopcomment:before {
  content: " ";
  display: block;
  height: 0.1px;
  font-size: 0.1em;
  line-height: 0;
  border: 1px dashed #999999
}
*/
.commenttitle {
  text-align: left;
  padding: 4px;
  background-image: url("../img/arrow_tri.png");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.commenttitle {
  border-top: 1px solid #CCCCCC;
  border-bottom: 1px solid #CCCCCC;
}

.commenttitle a {
  text-decoration: none;
  margin: 5px 0;
  display: block;
}

.commenttitle p {
  color: #333333;
}

.rightarrow {
  text-align: right;
}

.rightarrow > div {
  float: right;
  text-align: right;
  padding: 5px 0 5px 25px;
  text-align: left;
  margin: 10px 0;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_18_18.png") no-repeat 0 center;
  margin-left: 1px;
}

/*  購入はこちら  */
.price + .rightarrow a {
  background: none;
  text-decoration: underline;
}

.price + .rightarrow div {
  padding: 5px 0 5px 15px;
}

.catalog {
  margin: 0 auto;
  width: 100%;
}

.catalog p {
  display: inline;
}

/* 会員規約 */
#contents section aside.agreement div.formbox {
  padding-bottom: 0;
}

aside.agreement {
  margin-bottom: -20px;
}

aside.agreement pre {
  white-space: -moz-pre-wrap;
  /* Mozilla */
  white-space: -pre-wrap;
  /* Opera 4-6 */
  white-space: -o-pre-wrap;
  /* Opera 7 */
  white-space: pre-wrap;
  /* CSS3 */
  word-wrap: break-word;
  /* IE 5.5+ */
  font-size: 12px;
}

/***** 複数カテゴリ対応用 *****/
/*トップページの見出し位置調整*/
#sortarea div.sps-itemCategoryGroup {
  width: auto;
}

nav.sps-itemCategoryGroup + nav.sps-itemCategoryGroup {
  margin-top: 5px !important;
}

#sortarea div.sps-itemCategoryMidashi {
  margin: 10px 0;
}

/*トップページのカテゴリ横幅調整*/
#sortarea div.sps-itemCategoryGroup > *:not([class="title sps-itemCategoryMidashi"]) {
  width: auto;
  margin-left: auto;
  margin-right: auto;
}

/*サイトマップの見出し位置調整*/
#contents nav.sps-itemCategoryGroup {
  width: auto;
}

#contents nav.sps-itemCategoryGroup > div.titlebar_list {
  width: auto;
  margin-left: auto;
  margin-right: auto;
}

/*サイトマップ用下層エリア*/
.listmenu li.sps-itemCategorySub {
  padding: 0 0 2px 15px;
}

/*サイトマップ用下層（第2階層以下）エリアの右線*/
.listmenu li.sps-itemCategorySub .titlebar, .listmenu li.sps-itemCategorySub li {
  border-right: none;
}

/*サイトマップ用リンクバー*/
.titlebar_list .sps-titleLinkBar {
  padding-right: 0;
}

.titlebar_list .sps-titleLinkBar h1 a {
  display: block;
  margin: 0;
  padding: 10px 20px 10px 4px;
  text-align: left;
  background: url("https://www.otaru-kaiyo.co.jp/pic-labo/arrow_tri1.png") no-repeat 97% center;
  text-decoration: none;
  color: #333333;
}

/*************************************************/
/*** キーワードリンクデザイン ***/
/* theme1〜5の共通レイアウト */
#sps-keywordBox ul {
  margin: 0 auto;
  padding: 0.3em 0.5em 0 0;
}

#sps-keywordBox li {
  display: inline-block;
}

#sps-keywordBox li a {
  display: block;
  margin: 0 0 0.8em 0.5em;
  padding: 0.5em 1em;
  border-radius: 4px;
  text-decoration: none;
  font-size: 0.9em;
}

/* theme1のデザイン */
#sps-keywordBox li a {
  border: 1px solid #CCCCCC;
  background: -moz-linear-gradient(top, #fcfdfc, #e8eee8);
  background-image: -webkit-gradient(linear, center top, center bottom, from(#fcfdfc), to(#e8eee8));
}

/***** 購入履歴の評価コメントデザイン *****/
/* theme1のデザイン */
.review p {
  float: right;
  margin-right: 10px;
  margin-top: -40px;
  padding: 6px 0;
  height: 20px;
}

.review p a {
  position: relative;
  top: -10px;
  margin: 0 auto 0;
  padding: 4px 20px 4px 10px;
  text-decoration: none;
  font-size: 75%;
  border: 1px solid #333;
  background: #666 url("../img/icon_title_tri.png") no-repeat 95% center;
  font-weight: bold;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: #ffffff;
  text-shadow: 3px 3px 3px #000;
  vertical-align: middle;
  text-align: left;
}

/* theme1〜5のみimage非表示 */
.listmenu li.image-none > a:first-child {
  background-image: none;
}

.review p.btn {
  float: none;
  height: auto;
  margin: 0;
  padding: 5px 10px;
}

.review p.btn button {
  margin: 0 auto;
}

/*************************************************/
/* お気に入り */
/*************************************************/
.wishBtnHidden {
  display: none;
}

/* 商品詳細_通常 */
.stock p[class^="wish_area"] {
  margin: 15px auto;
  min-height: 54px;
  text-align: center;
  vertical-align: middle;
}

.stock .wish_add {
  color: #fff !important;
  font-size: 120%;
  font-weight: bold;
  padding: 10px;
  width: 80%;
  border: 1px solid #999999 !important;
  background: #ffcc99;
  background: -moz-linear-gradient(top, #DCDCDC, #828282);
  margin: 0 auto;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  text-decoration: none;
  vertical-align: middle;
}

.stock .wish_add_ok {
  padding-bottom: 20px;
  text-decoration: underline;
  vertical-align: middle;
}

/* 商品詳細_ばりごと */
.stock p.variations {
  min-height: 24px;
  padding-top: 10px;
}

.stock .variations .wish_add {
  border: 1px solid #999999 !important;
  background: #ffcc99;
  background: -moz-linear-gradient(top, #DCDCDC, #828282);
  border-radius: 1px;
  font-weight: normal;
  color: #fff;
  font-size: 100%;
  margin: 0 auto;
  text-decoration: none;
  vertical-align: middle;
  font-size: 75%;
  min-width: 8em;
  padding: 5px 3px;
}

.stock .variations .wish_add_ok {
  padding-top: 10px;
  font-size: 75%;
}

/* 商品一覧 リスト表示 */
.itemlist .wish_area {
  float: right;
  margin: -30px 10px 0;
  padding: 0;
}

.itemlist .itemlist_bottom a {
  padding-bottom: 45px !important;
}

.itemlist .wish_area .wish_add {
  margin: -15px 5px 0 0;
  padding: 7px 7px;
  position: relative;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  font-size: 80%;
  font-weight: bold;
  color: black !important;
  background: -moz-linear-gradient(center top, #ffffff, #cccccc) repeat scroll 0 0 rgba(0, 0, 0, 0);
  border: 1px solid #CCCCCC;
  border-radius: 5px;
  -webkit-appearance: none;
}

.itemlist .wish_area .wish_add_ok {
  text-decoration: underline;
  padding: 10px;
  font-size: 80%;
}

/* 商品一覧 カタログ表示 */
.cataloglist ul.clearof {
  text-align: left;
  font-size: 0;
}

.cataloglist .box {
  font-size: 12px;
  display: inline-block;
  margin: 0 2% 5px 0;
  width: 49%;
  vertical-align: top;
  text-align: left;
}

.cataloglist .box:nth-child(even) {
  margin-right: 0;
}

.cataloglist .box a {
  text-decoration: none;
  background: none;
  padding: 0;
  display: block;
}

div.box .catalogimg {
  width: 100%;
  box-sizing: border-box;
  vertical-align: bottom;
}

.cataloglist .bg {
  height: auto;
  text-align: right;
  vertical-align: middle;
}

.cataloglist .itemname {
  font-size: 1em;
  font-weight: normal;
  padding: 0 3%;
  margin: 5px 0 10px;
  line-height: 130%;
  text-align: left;
}

.cataloglist a .itemname {
  color: #333;
}

.cataloglist .price {
  line-height: 130%;
  font-weight: normal;
  font-size: 1em;
}

.cataloglist .price br {
  display: none;
}

.cataloglist .original_price {
  font-size: 0.9em;
  font-weight: normal;
  margin: 5px 0 0;
}

.cataloglist .list_price, .cataloglist .sales_price {
  display: block;
  padding-left: 3%;
  padding-right: 3%;
}

.cataloglist .initial_price {
  display: block;
  margin: 5px 0 10px;
  padding-left: 3%;
  padding-right: 3%;
  color: #CC3333;
}

.cataloglist .soldout {
  margin: 5px 0 10px;
  padding: 0 3%;
}

.cataloglist .soldout span {
  box-sizing: border-box;
  line-height: 100%;
  padding: 4px 5px;
  width: auto;
}

.cataloglist .recommend {
  margin: 10px 0;
  display: block;
  font-size: 1em;
  font-weight: normal;
  padding: 0 3%;
  text-align: right;
}

.cataloglist a .recommend {
  text-decoration: none;
  margin: 10px 0;
}

.cataloglist .wish_area {
  text-align: center;
  margin: 10px 0;
}

.cataloglist .wish_area .wish_add {
  font-size: 80%;
  font-weight: bold;
  color: black !important;
  background: -moz-linear-gradient(center top, #ffffff, #cccccc) repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
  border: 1px solid #CCCCCC;
  border-radius: 5px;
  padding: 5px 15px;
  -webkit-appearance: none;
}

.cataloglist .wish_area .wish_add_ok {
  text-decoration: underline;
  font-size: 80%;
  margin: 3px 0;
  padding: 12px 5px;
}

/***** お気に入りリスト *****/
/* 画像ON */
.itemlist .wish_button_area {
  float: right;
  margin: -45px 15px 0;
  padding: 0;
}

.itemlist .wish_button_area .wish_add_cart {
  padding: 5px 3px;
  font-size: 75%;
  min-width: 8em;
  border: 1px solid #FF6600 !important;
  background: #ffcc99;
  background: -moz-linear-gradient(top, #ffcc99, #ff9900);
  margin: 0 auto;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
}

.itemlist .wish_button_area .wish_del {
  text-decoration: underline;
  position: relative;
  vertical-align: middle;
  font-size: 12px;
  padding-right: 5px;
  cursor: pointer;
}

.itemlist .wish_button_area .wish_text_black {
  position: relative;
  padding-right: 2px;
  vertical-align: middle;
  font-size: 12px;
}

.itemlist .wish_text_red {
  font-size: 12px;
  color: red;
  font-weight: bold;
}

/* カタログ表示 */
.cataloglist .wish_button_area {
  margin-top: 10px;
  text-align: center !important;
  width: 100%;
}

.cataloglist .wish_button_area .wish_add_cart {
  padding: 5px 3px;
  font-size: 75%;
  width: 80%;
  min-width: 8em;
  border: 1px solid #FF6600 !important;
  background: #ffcc99;
  background: -moz-linear-gradient(top, #ffcc99, #ff9900);
  margin: 0 auto;
  border-radius: 1px;
  -webkit-border-radius: 1px;
  -moz-border-radius: 1px;
  color: #fff;
  text-decoration: none;
  vertical-align: middle;
  margin-right: 2px;
}

.cataloglist .wish_button_area .wish_del {
  margin: 10px auto 0;
  width: 50px;
  height: 25px;
  text-decoration: underline;
  display: block;
  vertical-align: middle;
  font-size: 12px;
  cursor: pointer;
}

.cataloglist .wish_button_area .wish_text_black {
  position: relative;
  vertical-align: middle;
  font-size: 12px;
  padding: 5px 0 7px 0;
  display: block;
}

.cataloglist .wish_text_red {
  font-size: 11px;
  color: red;
  text-align: right;
  padding: 0 0 6px;
  line-height: 130%;
}

/* option information style */
.td_lineheight {
  line-height: 150%;
}

.option_style, .history_option_style {
  padding: 4px 0px;
  position: relative;
  width: 100%;
}

.option_style .option_name, .history_option_style .option_name {
  line-height: 18px;
  text-align: left;
  width: 65%;
  word-break: break-all;
  float: left;
}

.option_style .option_price, .history_option_style .option_price {
  text-align: right;
  line-height: 18px;
  width: 28%;
  float: right;
  padding-right: 4px;
}

.option_style:after, .history_option_style:after {
  content: "";
  display: table;
  clear: both;
}

.history_option_style, .history_option_style .option_name, .history_option_style .option_price {
  padding-bottom: 2px !important;
  margin: 0 !important;
}

.history_option_style .option_name {
  font-size: 85%;
}

tr.kago_option_info {
  padding: 2px 5px !important;
  line-height: 120%;
}

tr.kago_option_info td.option_name, tr.kago_option_info td.option_name_last, tr.kago_option_info td.option_price, tr.kago_option_info td.option_price_last {
  border-bottom: none;
  border-top: none;
}

tr.kago_option_info td.option_name_last, tr.kago_option_info td.option_price_last {
  border-bottom: 1px #999999 solid;
}

td.no_border_bottom {
  border-bottom: none !important;
}

span.option_point_calc {
  color: blue;
}

/* End option information style */
/* まとめ割引 */
.bundle_name {
  display: inline-block;
  margin: 5px 0px;
  padding: 3px;
  border: 1px solid #f00;
  line-height: 1.3;
  text-decoration: none;
  font-size: 80%;
  color: #f00;
}

td.kago_bundle_info {
  border-top: none !important;
  padding: 0px 5px 5px !important;
}

/* スマホ決済方法アコーディオン */
#contents .sps-pm_accordion .paywrap {
  border: 1px solid #e0e0e0;
  background-color: #ffffff;
  padding: 0;
}

#contents .sps-pm_accordion .paytitlewrap {
  border-bottom: 1px solid #e0e0e0;
  vertical-align: middle;
  background-color: #f4f4f4;
}

#contents .sps-pm_accordion .paybodywrap {
  padding: 0.5em 0;
}

#contents .sps-pm_accordion .pm-section, #contents .sps-pm_accordion .pm-section .form_t {
  margin-top: 0;
  margin-bottom: 0;
}

#contents .sps-pm_accordion .pm-section + .pm-section .paywrap {
  border-top: none;
}

#contents .sps-pm_accordion .paytitlewrap label {
  display: block;
  padding: 0.4em 0.4em 0.2em;
}

#contents .sps-pm_accordion .paytitlewrap label input {
  margin: 0 0.5em 0 0;
  transform: scale(1.3);
}

/** submitリンク */
.guest_area_link {
  width: 246px;
  margin: 1em auto;
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  vertical-align: middle;
  font-size: 18px;
  text-align: center;
  color: black;
}

.guest_area_link a {
  background: none;
  color: #626262;
}

.login_area_link {
  width: 246px;
  margin: 1em auto;
  border: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  vertical-align: middle;
  font-size: 18px;
  text-align: center;
  color: black;
}

.login_area_link a {
  background: none;
  color: #626262;
}

.cart_guest_area_separator {
  margin: 10px 20px;
  height: 2px;
  background-color: #e0e0e0;
  border: 0;
}

/* アコーディオン開閉ボタン */
.formbar .accordion-open {
  text-align: left;
  padding: 10px 50px 10px 4px;
  background-image: url("../img/arrow_open2.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

.formbar .accordion-open.active {
  background-image: url("../img/arrow_close2.jpg");
  background-repeat: no-repeat;
  background-position: 97% center;
}

/* カレンダー修正*/
#pi_calendar div.cal_wrapper table.cal tr:nth-child(1) th p.month {
  margin: 0 !important;
}

/*パンくず修正*/
#bread-crumb ol li {
  list-style: none;
  display: inline-block;
}