@charset "UTF-8";
/* (C) HARBOR HOUSE */
/*----------------------------------------
	clearfix
----------------------------------------*/
.container:after, .contents:after, .headerIndex .headerNav:after, header .headerNav:after, .fLeftNav ul:after, .pickupArea:after, .infoArea:after, .secInfo .infoList:after, .howto02 ol:after, .btnAbout:after, .btnRecruitChange:after, .aboutHeadline:after, .detail:after, .groupList:after, .btnSp:after, .secFlow ol:after, .bbq .timetable:after, .secKakigoya h3:after, .btnAreaList ul:after, .secShopShimaiArea .shopList li:after, .shopList > li:after, .shopDetail:after, .shopDetailClosed:after, .entryList:after, .entryList .entryListDetail .entryMeta:after, .entryTitle:after, .entryTitle .entryMeta:after, #snsBtm .sns:after, #snsSingleTop .sns:after, .secAuthor:after, .paginate:after, .staffList:after, .staffDetailArea:after, .precepts:after, .english .shopDetail:after, .english .shopDetail li:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8+, and Opera
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
}

td,
th {
  padding: 0;
}

/*----------------------------------------
	body
----------------------------------------*/
body {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", verdana, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif;
  font-size: 15px;
  font-size: 0.9375rem;
  color: #000;
  text-align: center;
  line-height: 168%;
}
@media only screen and (max-width: 787px) {
  body {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
body.english {
  font-family: 'Source Sans Pro', sans-serif;
}

a {
  color: #EB604B;
  outline: none;
  text-decoration: underline;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
a:hover {
  color: #000;
}
@media only screen and (min-width: 788px) and (max-width: 998px) {
  a:hover {
    opacity: 1 !important;
    filter: alpha(opacity=100);
  }
  a:hover img {
    opacity: 1 !important;
    filter: alpha(opacity=100);
  }
}
@media only screen and (max-width: 787px) {
  a:hover {
    opacity: 1 !important;
    filter: alpha(opacity=100);
  }
  a:hover img {
    opacity: 1 !important;
    filter: alpha(opacity=100);
  }
}
a:active {
  color: #EB604B;
}

.clearfix {
  min-height: 1px;
  _height: 1%;
}
.clearfix:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

@media only screen and (max-width: 787px) {
  .spNone {
    display: none !important;
  }
}

@media only screen and (min-width: 788px) and (max-width: 998px) {
  .tabNone {
    display: none !important;
  }
}

@media only screen and (min-width: 999px) {
  .pcNone {
    display: none !important;
  }
}

/*----------------------------------------
	container
----------------------------------------*/
.container {
  margin: 0 auto;
  width: 980px;
  text-align: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .container {
    width: 100%;
  }
}

.contents {
  text-align: left;
}

article.contents {
  padding: 0 0 160px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  article.contents {
    padding: 30px 0 40px;
  }
}

.breadcrumb {
  margin-bottom: 30px;
  width: 100%;
}
@media only screen and (max-width: 787px) {
  .breadcrumb {
    margin-bottom: 0;
    height: auto;
  }
}
.breadcrumb nav {
  margin: 0 auto;
  text-align: right;
}
@media only screen and (max-width: 787px) {
  .breadcrumb nav {
    padding: 0 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
  }
}
.breadcrumb nav span {
  line-height: 20px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #666;
}
.breadcrumb nav span:first-child:before {
  display: none;
}
.breadcrumb nav span:first-child i {
  margin-right: 5px;
}
.breadcrumb nav span:last-child {
  padding-right: 20px;
}
.breadcrumb nav span:last-child a {
  text-decoration: none;
}
.breadcrumb nav span:before {
  margin: 0 10px;
  content: ">";
}
.breadcrumb nav span a {
  color: #666;
}
.breadcrumb nav span a:hover {
  color: #000;
}

.headline .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .headline .container {
    padding: 0 10px;
  }
}
.headline h2 {
  margin: 0 0 40px;
  height: 50px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .headline h2 {
    margin: 20px 0;
    height: auto;
    background: none !important;
    text-indent: 0;
    white-space: normal;
    overflow: visible;
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.headline h2 i {
  position: absolute;
  top: 0;
  left: 0;
  text-indent: 0;
  font-size: 50px;
  font-size: 3.125rem;
}
@media only screen and (max-width: 787px) {
  .headline h2 i {
    margin-right: 10px;
    position: relative;
    top: -3px;
    left: inherit;
    font-size: 26px !important;
    font-size: 1.73333rem !important;
    vertical-align: middle;
  }
}
.headline p {
  width: 450px;
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .headline p {
    width: auto;
    font-size: 12px;
    font-size: 0.75rem;
  }
}

.attention, .headline .attention {
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 148%;
}
@media only screen and (max-width: 787px) {
  .attention, .headline .attention {
    font-size: 11px;
    font-size: 0.6875rem;
  }
}

.fcRed {
  color: #E50012;
}

.fcOrange {
  color: #EB604B;
}

.fcBlue {
  color: #194375;
}

.btnBase {
  padding: 0 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  table-layout: fixed;
}
.btnBase a {
  width: 100%;
  height: 80px;
  display: table-cell;
  border: 1px solid #E50012;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  text-align: center;
  font-size: 18px;
  font-size: 1.125rem;
  color: #E50012;
  text-decoration: none;
  vertical-align: middle;
  font-weight: bold;
}
.btnBase a i {
  margin: -6px 20px 0 0;
  width: 54px;
  height: 50px;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  font-size: 60px;
  font-size: 3.75rem;
  font-weight: normal;
}
.btnBase a:hover {
  background: #E50012;
  color: #FFF;
}
.btnBase a:hover i {
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .btnBase a {
    width: 100%;
    height: 50px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    font-size: 1rem;
  }
  .btnBase a i {
    margin: -6px 10px 0 0;
    width: 30px;
    height: 27px;
    font-size: 30px;
    font-size: 1.875rem;
  }
}

.btn2Layer a > span {
  display: inline-block;
  text-align: left;
}
.btn2Layer a > span span {
  display: block;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 110%;
  font-weight: normal;
}
.btn2Layer a i {
  margin-top: -27px;
}

.btnAreaHalf .btnBase {
  margin: 0 20px 0 0;
  padding: 0;
  width: 450px;
  float: right;
}
.btnAreaHalf .btnBase:first-child {
  margin: 0 0 0 20px;
  float: left;
}
.btnAreaHalf .btnBase a {
  width: 100%;
}
@media only screen and (max-width: 787px) {
  .btnAreaHalf .btnBase {
    margin: 0 10px;
    width: auto;
    float: none;
  }
  .btnAreaHalf .btnBase:first-child {
    margin: 0 10px 10px;
  }
}

/* 2colum */
.rightArea {
  width: 635px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .rightArea {
    margin: 0 10px;
    width: auto;
    float: none;
  }
}

.contentsArea {
  width: 660px;
  float: left;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-box;
  display: -webkit-flexbox;
  display: -moz-flexbox;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-box-lines: multiple;
  -moz-box-lines: multiple;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -webkit-flex-pack: justify;
  -moz-flex-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  -moz-justify-content: space-between;
  justify-content: space-between;
}
@media only screen and (max-width: 787px) {
  .contentsArea {
    margin: 0 10px;
    width: auto;
    float: none;
  }
}

.leftArea {
  width: 290px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .leftArea {
    margin: 40px 10px 0;
    width: auto;
    float: none;
  }
}

.sidebarArea {
  width: 280px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .sidebarArea {
    margin: 40px 10px 30px;
    width: auto;
    float: none;
  }
}

.redTable {
  width: 100%;
}
.redTable th, .redTable td {
  padding: 15px 20px;
  border: 1px solid #E50012;
  vertical-align: middle;
  font-size: 14px;
  font-size: 0.875rem;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  line-height: 146%;
}
.redTable th {
  width: 260px;
  background: #EB3B49;
  font-weight: normal;
  color: #FFF;
}
.redTable ol {
  margin: 0;
  padding: 0 0 0 22px;
}
@media only screen and (max-width: 787px) {
  .redTable tr {
    display: inline;
  }
  .redTable tr th, .redTable tr td {
    margin-top: -1px;
    padding: 10px 15px;
    width: 100%;
    display: block;
    font-size: 12px;
    font-size: 0.75rem;
  }
}

/*----------------------------------------
	IE6 Upgrade Warning
----------------------------------------*/
#ieError {
  color: #FFF;
  background: #000;
  padding: 20px;
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 1000;
  width: 100%;
  opacity: 0.8;
  filter: alpha(opacity=80);
  -ms-filter: "alpha( opacity=80 )";
}
#ieError strong {
  color: #FFF;
}
#ieError a {
  color: #D90000;
  text-decoration: underline;
}

/*----------------------------------------
	アイコン
----------------------------------------*/
.icon-singlefish {
  width: 35px;
  height: 20px;
  display: inline-block;
  background: url(../images/common/icon-singlefish.png) no-repeat 0 0;
  background-size: 35px 20px;
}

.subPage .sidebarArea .wp_rp_footer {
  display: none;
}

/*----------------------------------------
	ページャー設定
----------------------------------------*/
@media only screen and (min-width: 788px) {
  .spPager {
    display: none;
  }
}
@media only screen and (max-width: 787px) {
  .wp-pagenavi {
    padding-top: 30px !important;
    clear: both;
  }
  .wp-pagenavi .nextpostslink {
    display: none !important;
  }
  .wp-pagenavi .first, .wp-pagenavi .last {
    display: inline-block !important;
  }

  .spPager {
    float: right !important;
    width: 48%;
  }
  .spPager .nextpostslink {
    display: block;
    background: #EB604B;
    color: #FFF;
    height: 100%;
    padding-bottom: 30px;
  }
  .spPager span.pagerTable {
    display: table;
    height: 100%;
    min-height: 3em;
    width: 100%;
  }
  .spPager span.pagerTable span.pagerCell {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding-top: 30px;
  }
}
/*----------------------------------------
	header
----------------------------------------*/
/* index */
.headerIndex {
  margin: 0;
  width: 100%;
  height: 750px;
  position: relative;
  background-color: #72A8DC;
  background: -webkit-radial-gradient(top, ellipse cover, #9ACFEB 0%, #72A8DC 100%);
  background: -moz-radial-gradient(top, ellipse cover, #9ACFEB 0%, #72A8DC 100%);
  background: -ms-radial-gradient(top, ellipse cover, #9ACFEB 0%, #72A8DC 100%);
  background: -o-radial-gradient(top, ellipse cover, #9ACFEB 0%, #72A8DC 100%);
  background: radial-gradient(ellipse at top, #9ACFEB 0%, #72A8DC 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#9ACFEB', EndColorStr='#72A8DC');
}
@media only screen and (max-width: 787px) {
  .headerIndex {
    margin-bottom: 20px;
    height: 440px;
  }
}
.headerIndex:before {
  content: "";
  width: 166px;
  height: 750px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/index/seaweed_left.png) no-repeat;
}
@media only screen and (max-width: 787px) {
  .headerIndex:before {
    width: 97px;
    height: 440px;
    -moz-background-size: contain;
    -o-background-size: contain;
    -webkit-background-size: contain;
    background-size: contain;
  }
}
.headerIndex:after {
  content: "";
  width: 174px;
  height: 750px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/index/seaweed_right.png) no-repeat;
}
@media only screen and (max-width: 787px) {
  .headerIndex:after {
    width: 102px;
    height: 440px;
    -moz-background-size: contain;
    -o-background-size: contain;
    -webkit-background-size: contain;
    background-size: contain;
  }
}
.headerIndex .headerNav {
  height: 750px;
  background: url(../images/index/seaweed_top.png) no-repeat 220px 0;
}
.headerIndex .headerNav h1 {
  margin: 0;
  position: absolute;
  top: 12px;
  left: 4px;
  z-index: 1;
}
.headerIndex .headerNav h1 a {
  width: 138px;
  height: 138px;
  display: block;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFF url(../images/common/logo_header.png) no-repeat center;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.headerIndex .headerNav h1 a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
@media only screen and (max-width: 787px) {
  .headerIndex .headerNav {
    height: auto;
    background: none;
  }
  .headerIndex .headerNav h1 {
    padding-top: 20px;
    position: static;
    text-align: center;
  }
  .headerIndex .headerNav h1 a {
    margin: 0 auto;
    width: 100px;
    height: 100px;
    -moz-background-size: 65%;
    -o-background-size: 65%;
    -webkit-background-size: 65%;
    background-size: 65%;
  }
}
.headerIndex .hTopNav {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 14px;
  right: 0;
  z-index: 1;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hTopNav {
    width: 100%;
    position: relative;
    text-align: center;
  }
}
.headerIndex .hTopNav li {
  margin: 0 10px;
  display: inline-block;
  list-style: none;
}
.headerIndex .hTopNav li a {
  color: #FFF;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hTopNav li a {
    font-size: 12px;
    font-size: 0.75rem;
    font-weight: normal;
  }
}
.headerIndex .hTopNav li a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.headerIndex .hTopNav li a i {
  margin-right: 7px;
  font-size: 19px;
  font-size: 1.1875rem;
  color: #FFF;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hTopNav li a i {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
.headerIndex .hTopNav li.btnEnglish a, .headerIndex header .hTopNav li.btnJapanese a, header .headerIndex .hTopNav li.btnJapanese a, .headerIndex .hTopNav .english .fRightNav li.btnJapanese a, .english .fRightNav .headerIndex .hTopNav li.btnJapanese a {
  padding: 2px 12px;
  display: inline-block;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #FFF;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hTopNav li.btnEnglish a, .headerIndex header .hTopNav li.btnJapanese a, header .headerIndex .hTopNav li.btnJapanese a, .headerIndex .hTopNav .english .fRightNav li.btnJapanese a, .english .fRightNav .headerIndex .hTopNav li.btnJapanese a {
    padding: 0 12px;
  }
}
.headerIndex .hBotNav {
  position: absolute;
  bottom: 15px;
  left: 0;
  right: 0;
  z-index: 3;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav {
    margin-top: 30px;
    width: 100%;
    position: relative;
    bottom: 0;
    text-align: center;
  }
}
.headerIndex .hBotNav h2 {
  margin: 0 15px;
  display: none;
  background: #FFF;
  text-align: center;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 240%;
  cursor: pointer;
}
.headerIndex .hBotNav h2.btnActive {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav h2 {
    display: block;
  }
}
.headerIndex .hBotNav h2 i {
  margin-right: 2px;
}
.headerIndex .hBotNav ul {
  margin: 0 0 20px;
  padding: 0;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul {
    margin: 0 15px;
  }
}
.headerIndex .hBotNav ul li {
  margin: 0;
  width: 130px;
  display: inline-block;
  list-style: none;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li {
    width: 100%;
    display: block;
    text-align: left;
  }
  .headerIndex .hBotNav ul li:last-child a {
    border: none;
    -moz-border-radius-bottomleft: 6px;
    -webkit-border-bottom-left-radius: 6px;
    border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }
}
.headerIndex .hBotNav ul li a {
  width: 100%;
  display: inline-block;
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  font-size: 16px;
  font-size: 1rem;
}
.headerIndex .hBotNav ul li a * {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.headerIndex .hBotNav ul li a:hover div {
  -moz-transform: scale(1.3, 1.3);
  -ms-transform: scale(1.3, 1.3);
  -webkit-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li a:hover div {
    -moz-transform: none;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
  }
}
.headerIndex .hBotNav ul li a:hover i {
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li a {
    padding-left: 15px;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 270%;
    display: block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #E50012;
    border-bottom: 1px dashed #FFF;
    color: #FFF;
  }
  .headerIndex .hBotNav ul li a:hover {
    background: #FFF;
    color: #E50012;
  }
  .headerIndex .hBotNav ul li a:hover i {
    color: #E50012;
  }
}
.headerIndex .hBotNav ul li div {
  margin: 0 auto 15px;
  width: 70px;
  height: 70px;
  display: table;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFF;
}
.headerIndex .hBotNav ul li div span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
.headerIndex .hBotNav ul li div span i {
  margin-top: 2px;
  font-size: 46px;
  font-size: 2.875rem;
  color: #000;
  font-weight: normal;
  display: block;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li div {
    margin: 0;
    width: auto;
    display: inline;
    background: none;
  }
  .headerIndex .hBotNav ul li div span {
    display: inline;
  }
  .headerIndex .hBotNav ul li div span i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
    display: inline;
  }
}
.headerIndex .hBotNav ul li:first-child i {
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li:first-child i {
    font-size: 16px;
    font-size: 1rem;
  }
}
.headerIndex .hBotNav ul li:nth-child(6) i {
  margin-top: -4px;
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li:nth-child(6) i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
.headerIndex .hBotNav ul li:last-child i {
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .headerIndex .hBotNav ul li:last-child i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}

/* other */
header {
  margin-bottom: 10px;
  width: 100%;
  min-width: 980px;
  height: 170px;
  background: #73A8DC;
  position: relative;
}
@media only screen and (max-width: 787px) {
  header {
    min-width: 300px;
    height: 230px;
  }
}
header:before {
  content: "";
  width: 126px;
  height: 170px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/common/seaweed_left.png) no-repeat;
}
@media only screen and (max-width: 787px) {
  header:before {
    width: 97px;
    height: 230px;
    background: url(../images/index/seaweed_left.png) no-repeat;
    -moz-background-size: 90%;
    -o-background-size: 90%;
    -webkit-background-size: 90%;
    background-size: 90%;
  }
}
header:after {
  content: "";
  width: 141px;
  height: 170px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/common/seaweed_right.png) no-repeat;
}
@media only screen and (max-width: 787px) {
  header:after {
    width: 102px;
    height: 230px;
    background: url(../images/index/seaweed_right.png) no-repeat right top;
    -moz-background-size: 90%;
    -o-background-size: 90%;
    -webkit-background-size: 90%;
    background-size: 90%;
  }
}
header .headerNav {
  height: 170px;
  background: url(../images/common/seaweed_top.png) no-repeat 154px 0;
  position: relative;
}
header .headerNav:before {
  content: "";
  width: 295px;
  height: 87px;
  display: block;
  position: absolute;
  bottom: 0;
  left: -36px;
  background: url(../images/common/seaweed_bottom.png) no-repeat;
}
@media only screen and (max-width: 787px) {
  header .headerNav:before {
    background: none;
  }
}
header .headerNav h1 {
  margin: 0;
  position: absolute;
  top: 12px;
  left: 4px;
  z-index: 1;
}
header .headerNav h1 a {
  width: 138px;
  height: 138px;
  display: block;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFF url(../images/common/logo_header.png) no-repeat center;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
header .headerNav h1 a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
@media only screen and (max-width: 787px) {
  header .headerNav {
    height: auto;
    background: none;
  }
  header .headerNav h1 {
    padding-top: 20px;
    position: static;
    text-align: center;
  }
  header .headerNav h1 a {
    margin: 0 auto;
    width: 100px;
    height: 100px;
    background-size: 65%;
  }
}
header .hTopNav {
  margin: 0;
  padding: 0;
  position: absolute;
  top: 14px;
  right: 0;
  z-index: 1;
}
@media only screen and (max-width: 787px) {
  header .hTopNav {
    width: 100%;
    position: relative;
    text-align: center;
  }
}
header .hTopNav li {
  margin: 0 10px;
  display: inline-block;
  list-style: none;
}
header .hTopNav li a {
  color: #FFF;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  header .hTopNav li a {
    font-size: 12px;
    font-size: 0.75rem;
    font-weight: normal;
  }
}
header .hTopNav li a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
header .hTopNav li a i {
  margin-right: 7px;
  font-size: 19px;
  font-size: 1.1875rem;
  color: #FFF;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  header .hTopNav li a i {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
header .hTopNav li.btnEnglish a, header .hTopNav li.btnJapanese a, header .hTopNav .english .fRightNav li.btnJapanese a, .english .fRightNav header .hTopNav li.btnJapanese a {
  padding: 2px 12px;
  display: inline-block;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #FFF;
}
@media only screen and (max-width: 787px) {
  header .hTopNav li.btnEnglish a, header .hTopNav li.btnJapanese a, header .hTopNav .english .fRightNav li.btnJapanese a, .english .fRightNav header .hTopNav li.btnJapanese a {
    padding: 0 12px;
  }
}
header .hTopNav li.btnJapanese a {
  padding: 2px 20px 2px 18px;
}
header .hBotNav {
  position: absolute;
  bottom: 0;
  right: -5px;
  z-index: 3;
}
@media only screen and (max-width: 787px) {
  header .hBotNav {
    margin-top: 30px;
    width: 100%;
    position: relative;
    bottom: 0;
    right: 0;
    text-align: center;
  }
}
header .hBotNav h2 {
  margin: 0 15px;
  display: none;
  background: #FFF;
  text-align: center;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 240%;
  cursor: pointer;
}
header .hBotNav h2.btnActive {
  -moz-border-radius-bottomleft: 0;
  -webkit-border-bottom-left-radius: 0;
  border-bottom-left-radius: 0;
  -moz-border-radius-bottomright: 0;
  -webkit-border-bottom-right-radius: 0;
  border-bottom-right-radius: 0;
}
@media only screen and (max-width: 787px) {
  header .hBotNav h2 {
    display: block;
  }
}
header .hBotNav h2 i {
  margin-right: 2px;
}
header .hBotNav ul {
  margin: 0 0 20px;
  padding: 0;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul {
    margin: 0 15px;
  }
}
header .hBotNav ul li {
  margin: 0;
  width: 105px;
  display: inline-block;
  list-style: none;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li {
    width: 100%;
    display: block;
    text-align: left;
  }
  header .hBotNav ul li:last-child a {
    border: none;
    -moz-border-radius-bottomleft: 6px;
    -webkit-border-bottom-left-radius: 6px;
    border-bottom-left-radius: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }
}
header .hBotNav ul li a {
  width: 100%;
  display: inline-block;
  text-decoration: none;
  color: #FFF;
  font-weight: bold;
  font-size: 13px;
  font-size: 0.8125rem;
}
header .hBotNav ul li a * {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
header .hBotNav ul li a:hover div {
  -moz-transform: scale(1.3, 1.3);
  -ms-transform: scale(1.3, 1.3);
  -webkit-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li a:hover div {
    -moz-transform: none;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
  }
}
header .hBotNav ul li a:hover i {
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li a {
    padding-left: 15px;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 270%;
    display: block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background: #E50012;
    border-bottom: 1px dashed #FFF;
    color: #FFF;
  }
  header .hBotNav ul li a i {
    color: #FFF !important;
  }
  header .hBotNav ul li a:hover {
    background: #FFF;
    color: #E50012;
  }
  header .hBotNav ul li a:hover i {
    color: #E50012 !important;
  }
}
header .hBotNav ul li div {
  margin: 0 auto 10px;
  width: 50px;
  height: 50px;
  display: table;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFF;
}
header .hBotNav ul li div span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
header .hBotNav ul li div span i {
  display: block;
  font-size: 32px;
  font-size: 2rem;
  color: #000;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li div {
    margin: 0;
    width: auto;
    display: inline;
    background: none;
  }
  header .hBotNav ul li div span {
    display: inline;
  }
  header .hBotNav ul li div span i {
    display: inline;
    font-size: 16px;
    font-size: 1rem;
  }
}
header .hBotNav ul li:first-child i {
  font-size: 28px;
  font-size: 1.75rem;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li:first-child i {
    font-size: 16px;
    font-size: 1rem;
  }
}
header .hBotNav ul li:last-child i {
  margin-top: -5px;
  font-size: 28px;
  font-size: 1.75rem;
}
@media only screen and (max-width: 787px) {
  header .hBotNav ul li:last-child i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}

.fixedHeader {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 1;
}
@media only screen and (max-width: 787px) {
  .fixedHeader {
    display: none !important;
  }
}

#categoryNav {
  margin: 0 0 40px;
  height: 50px;
  background: #EA3341;
  z-index: 99999;
}
@media only screen and (max-width: 787px) {
  #categoryNav {
    width: 100%;
    height: auto;
    overflow-y: hidden;
    overflow-x: scroll;
  }
}
#categoryNav nav {
  height: 50px;
  background: #EA3341;
}
#categoryNav .categoryList {
  margin: 0 auto;
  padding: 0;
  width: 980px;
  list-style: none;
}
#categoryNav .categoryList:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}
@media only screen and (max-width: 787px) {
  #categoryNav .categoryList {
    width: 100%;
  }
}
#categoryNav .categoryList li {
  float: left;
  width: 140px;
}
@media only screen and (max-width: 787px) {
  #categoryNav .categoryList li:first-child {
    width: 100%;
  }
}
@media only screen and (max-width: 787px) {
  #categoryNav .categoryList li {
    width: 50%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
#categoryNav .categoryList li a {
  border-left: 1px solid #D70000;
  display: block;
  text-align: center;
  font-size: 12px;
  font-size: 0.75rem;
  font-weight: bold;
  line-height: 50px;
  color: #FFF;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  #categoryNav .categoryList li a {
    background: #EA3341;
    font-weight: normal;
    border-bottom: 1px solid #D70000;
    font-size: 10px;
    font-size: 0.625rem;
  }
}
@media only screen and (min-width: 788px) {
  #categoryNav .categoryList li a:hover {
    background-color: rgba(255, 255, 255, 0.3);
  }
}
#categoryNav .categoryList li a i {
  margin-right: 3px;
  font-size: 12px;
  font-size: 0.75rem;
}
#categoryNav .categoryList li:last-child a {
  border-right: 1px solid #D70000;
}
@media only screen and (max-width: 787px) {
  #categoryNav .categoryList li:last-child a {
    border-right: none;
  }
}

/*----------------------------------------
	footer
----------------------------------------*/
footer {
  min-width: 980px;
  background: #E50012;
}
@media only screen and (max-width: 787px) {
  footer {
    min-width: 300px;
  }
}
footer .container {
  padding: 32px 0;
}
footer li {
  list-style: none;
  line-height: 200%;
}
footer li a {
  color: #FFF;
  text-decoration: none;
}
footer li a:hover {
  color: #EB604B;
  text-decoration: underline;
}

.pagetop {
  position: fixed;
  bottom: 80px;
  right: 20px;
  z-index: 9;
}
.pagetop a {
  width: 95px;
  height: 95px;
  display: block;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #FFF;
  text-align: center;
}
.pagetop a img {
  margin-top: 5px;
}
.pagetop a:hover {
  background: #E50012;
}
@media only screen and (max-width: 787px) {
  .pagetop a {
    width: 50px;
    height: 50px;
  }
  .pagetop a img {
    max-width: 100%;
    height: auto;
  }
  .pagetop a img {
    margin: 0;
  }
}

.fLeftNav {
  width: 474px;
  float: right;
}
.fLeftNav ul {
  margin: 0;
  padding: 0;
  width: 30%;
  float: left;
}
.fLeftNav ul:first-child {
  width: 40%;
}
@media only screen and (max-width: 787px) {
  .fLeftNav {
    padding-left: 30px;
    width: auto;
    float: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .fLeftNav ul {
    width: auto !important;
    float: none;
  }
  .fLeftNav ul a {
    font-size: 16px;
    font-size: 1rem;
  }
  .fLeftNav ul a:before {
    margin-right: 10px;
    content: ">";
    font-size: 12px;
    font-size: 0.75rem;
    display: inline-block;
    position: relative;
    top: -2px;
  }
}

.fRightNav {
  padding-bottom: 10px;
  width: 206px;
  float: right;
  border-left: 1px solid #FFF;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .fRightNav {
    margin-bottom: 10px;
    width: auto;
    float: none;
    border-left: none;
    border-bottom: 1px dotted #FFF;
  }
}
.fRightNav ul {
  margin: 0;
  padding: 0 0 0 30px;
}
.fRightNav ul:first-child {
  padding-bottom: 10px;
}
.fRightNav ul:first-child li {
  display: inline-block;
  vertical-align: top;
}
.fRightNav ul:first-child li a {
  text-decoration: none;
}
.fRightNav ul:first-child li i {
  font-size: 29px;
  font-size: 1.8125rem;
}
@media only screen and (max-width: 787px) {
  .fRightNav ul:last-child a {
    font-size: 16px;
    font-size: 1rem;
  }
  .fRightNav ul:last-child a:before {
    margin-right: 10px;
    content: ">";
    font-size: 12px;
    font-size: 0.75rem;
    display: inline-block;
    position: relative;
    top: -2px;
  }
}
.fRightNav ul .btnEnglish, .fRightNav ul header .hTopNav li.btnJapanese, header .hTopNav .fRightNav ul li.btnJapanese, .english .fRightNav ul .btnJapanese {
  margin-left: 10px;
}
.fRightNav ul .btnEnglish a, .fRightNav ul header .hTopNav li.btnJapanese a, header .hTopNav .fRightNav ul li.btnJapanese a, .english .fRightNav ul .btnJapanese a {
  padding: 0 12px;
  display: inline-block;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #FFF;
  text-decoration: none;
}
.fRightNav ul .btnEnglish a:hover, .fRightNav ul header .hTopNav li.btnJapanese a:hover, header .hTopNav .fRightNav ul li.btnJapanese a:hover, .english .fRightNav ul .btnJapanese a:hover {
  background: #FFF;
  color: #E50012;
}
.fRightNav ul li a {
  font-size: 12px;
  font-size: 0.75rem;
}

.copy {
  margin: 0;
  padding-top: 92px;
  width: 300px;
  float: left;
  background: url(../images/common/logo_footer.png) no-repeat;
  color: #FFF;
}
.copy small {
  display: inline-block;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 132%;
}
@media only screen and (max-width: 787px) {
  .copy {
    width: auto;
    float: none;
    background-position: center;
    -moz-background-size: 40px auto;
    -o-background-size: 40px auto;
    -webkit-background-size: 40px auto;
    background-size: 40px auto;
  }
  .copy small {
    display: block;
    text-align: center;
  }
}

/*----------------------------------------
	sidebar
----------------------------------------*/
.rightArea .bnrArea {
  margin-bottom: 40px;
}
.rightArea .bnrArea li {
  margin-bottom: 20px;
}

.sideEventList h3 {
  margin: 0 0 20px;
  font-size: 18px;
  font-size: 1.125rem;
  vertical-align: top;
}
.sideEventList h3 i {
  margin-right: 5px;
  font-size: 24px;
  font-size: 1.5rem;
}
.sideEventList ul {
  margin: 0;
  padding: 0;
}
.sideEventList ul li {
  margin-bottom: 20px;
  padding-bottom: 20px;
  list-style: none;
  border-bottom: 1px dotted #CCC;
  line-height: 156%;
}
.sideEventList ul li a {
  padding: 0 10px;
  width: 100%;
  display: block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 13px;
  font-size: 0.8125rem;
  text-decoration: none;
  color: #333;
}
.sideEventList ul li a:hover {
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .sideEventList ul li a {
    width: auto;
  }
}

.bnrArea .wp_rp_content .wp_rp_publish_date,
.bnrArea .wp_rp_content .wp_rp_category {
  display: none;
}
.bnrArea .wp_rp_content h3 {
  margin: 0;
  padding: 15px;
  background: url(../images/common/icon-singlefish.png) no-repeat 234px 14px #ECECEC;
  background-size: 35px 20px;
  border-top: 1px solid #DDD;
  border-right: 1px solid #DDD;
  border-left: 1px solid #DDD;
  font-size: 15px;
  font-size: 0.9375rem;
}
.bnrArea .wp_rp_content ul {
  margin: 0;
  padding: 0;
}
.bnrArea .wp_rp_content ul li {
  margin: 0;
  padding: 15px;
  border-right: 1px solid #DDD;
  border-left: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
}
.bnrArea .wp_rp_content ul li:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}
.bnrArea .wp_rp_content ul li a.wp_rp_thumbnail {
  width: 62px;
  max-height: 62px;
  display: block;
  float: left;
  overflow: hidden;
}
@media only screen and (max-width: 787px) {
  .bnrArea .wp_rp_content ul li a.wp_rp_thumbnail {
    width: 24%;
    height: auto;
  }
}
.bnrArea .wp_rp_content ul li a.wp_rp_thumbnail:hover {
  opacity: 1;
  filter: alpha(opacity=100);
}
.bnrArea .wp_rp_content ul li a.wp_rp_title {
  width: 175px;
  float: right;
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: bold;
  line-height: 1.5;
  text-decoration: none;
  color: #333;
}
@media only screen and (max-width: 787px) {
  .bnrArea .wp_rp_content ul li a.wp_rp_title {
    width: 72%;
    text-align: left;
  }
}
.bnrArea .wp_rp_content ul li a.wp_rp_title:hover {
  text-decoration: underline;
}

/*@import "style_font_iconvault";*/
@font-face {
  font-family: 'icomoon';
  src: url("icomoon/icomoon.eot?z2v76g");
  src: url("icomoon/icomoon.eot?z2v76g#iefix") format("embedded-opentype"), url("icomoon/icomoon.ttf?z2v76g") format("truetype"), url("icomoon/icomoon.woff?z2v76g") format("woff"), url("icomoon/icomoon.svg?z2v76g#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-anniversary:before {
  content: "\e900";
}

.icon-arrow483:before {
  content: "\e600";
}

.icon-arrow487:before {
  content: "\e601";
}

.icon-arrowhead7:before {
  content: "\e602";
}

.icon-arrowheads3:before {
  content: "\e603";
}

.icon-bull1:before {
  content: "\e604";
}

.icon-clock61:before {
  content: "\e605";
}

.icon-commercial3:before {
  content: "\e606";
}

.icon-contact:before {
  content: "\e607";
}

.icon-cutlery6:before {
  content: "\e608";
}

.icon-eye8:before {
  content: "\e609";
}

.icon-facebook:before {
  content: "\e60a";
}

.icon-facebook30:before {
  content: "\e60b";
}

.icon-fishing:before {
  content: "\e60c";
}

.icon-four74:before {
  content: "\e60d";
}

.icon-harborhouse:before {
  content: "\e60e";
}

.icon-house158:before {
  content: "\e60f";
}

.icon-internet5:before {
  content: "\e610";
}

.icon-mail_round:before {
  content: "\e611";
}

.icon-map35:before {
  content: "\e612";
}

.icon-menu55:before {
  content: "\e613";
}

.icon-navigate6:before {
  content: "\e614";
}

.icon-news3:before {
  content: "\e615";
}

.icon-phone16:before {
  content: "\e616";
}

.icon-right39:before {
  content: "\e617";
}

.icon-right127:before {
  content: "\e618";
}

.icon-spoon2:before {
  content: "\e619";
}

.icon-wearmagic:before {
  content: "\e61a";
}

.icon-zauo_pagetop:before {
  content: "\e61b";
}

.icon-zauo_sushi2:before {
  content: "\e61c";
}

.icon-zauologo:before {
  content: "\e61d";
}

.icon-beverage2:before {
  content: "\e901";
}

.icon-chat13:before {
  content: "\e902";
}

.icon-fishing1:before {
  content: "\e903";
}

.icon-microphone52:before {
  content: "\e904";
}

.icon-question30:before {
  content: "\e905";
}

.icon-user:before {
  content: "\e906";
}

.icon-calendar146:before {
  content: "\e907";
}

.icon-twitter:before {
  content: "\e908";
}

.icon-zauo:before {
  content: "\e909";
}

.icon-google-plus:before {
  content: "\e90a";
}

.icon-facebook2:before {
  content: "\e90b";
}

.icon-twitter2:before {
  content: "\e90c";
}

.icon-share:before {
  content: "\e90d";
}

.icon-pocket:before {
  content: "\e90e";
}

.icon-hatena:before {
  content: "\e90f";
}

.icon-fish:before {
  content: "\e61d";
}

/*----------------------------------------
	index
----------------------------------------*/
.mainVisual {
  width: 100%;
  height: 750px;
  background: url(../images/index/p_mainvisual.png) no-repeat center 130px;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (max-width: 787px) {
  .mainVisual {
    height: auto;
    position: absolute;
    top: 230px;
    left: 0;
    right: 0;
    z-index: 2;
    background-position: center 8px;
    -moz-background-size: 52px;
    -o-background-size: 52px;
    -webkit-background-size: 52px;
    background-size: 52px;
  }
}

.illustArea {
  padding-top: 110px;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: center;
  overflow-x: hidden;
}
@media only screen and (max-width: 787px) {
  .illustArea {
    padding-top: 0;
  }
}

.slider .slick-track {
  display: table;
  table-layout: fixed;
}
@media only screen and (max-width: 787px) {
  .slider .slick-track {
    height: 190px;
  }
}
.slider .slick-slide {
  height: 530px;
  display: table-cell !important;
  text-align: center;
  vertical-align: middle;
  float: none !important;
}
@media only screen and (max-width: 787px) {
  .slider .slick-slide {
    height: 190px;
  }
}
.slider .slick-slide span {
  margin-left: 20%;
  display: block;
}
.slider .slick-slide span div {
  margin-left: 0 !important;
}
.slider .slick-slide img {
  margin: 0 auto;
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .slider .slick-slide img {
    max-height: 190px;
  }
}

.index {
  position: relative;
}
@media only screen and (max-width: 787px) {
  .index {
    padding-top: 0;
  }
}

.indexBnrArea {
  padding-top: 60px;
  border-top: 1px solid #EDEDED;
  width: 100%;
}
@media only screen and (max-width: 787px) {
  .indexBnrArea {
    height: auto;
    position: static;
  }
}

.recruitIllust {
  margin-bottom: 40px;
}
@media only screen and (max-width: 787px) {
  .recruitIllust {
    margin: 0 auto 10px;
    width: 290px;
  }
  .recruitIllust img {
    max-width: 100%;
    height: auto;
  }
}
.recruitIllust a:hover {
  opacity: 0.6;
  filter: alpha(opacity=60);
}
.recruitIllust img {
  vertical-align: bottom;
}

.pickupArea {
  margin-bottom: 60px;
}
@media only screen and (max-width: 787px) {
  .pickupArea {
    margin-bottom: 20px;
  }
}
.pickupArea a {
  margin-left: 55px;
  width: 290px;
  height: 270px;
  display: table;
  table-layout: fixed;
  float: left;
  text-align: center;
  color: #FFF;
  text-decoration: none;
  position: relative;
  z-index: 0;
}
.pickupArea a:first-child {
  margin-left: 0;
}
.pickupArea a section {
  width: 290px;
  height: 270px;
  display: table-cell;
  vertical-align: middle;
  position: relative;
  z-index: 3;
}
.pickupArea a section h2 {
  margin: 10px 0 20px;
  font-size: 23px;
  font-size: 1.4375rem;
}
.pickupArea a section h2 span {
  margin-bottom: 20px;
  display: block;
  font-size: 15px;
  font-size: 0.9375rem;
}
@media only screen and (max-width: 787px) {
  .pickupArea a {
    margin: 0 3px 10px !important;
    width: calc(33.3333% - 6px);
    height: 120px;
  }
  .pickupArea a section {
    width: 100%;
    height: 120px;
  }
  .pickupArea a section h2 {
    margin: 0 0 5px;
    font-size: 16px;
    font-size: 1rem;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
    text-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.7);
  }
  .pickupArea a section h2 span {
    margin-bottom: 5px;
    font-size: 12px;
    font-size: 0.75rem;
  }
  .pickupArea a:before {
    height: 120px;
    -moz-background-size: contain;
    -o-background-size: contain;
    -webkit-background-size: contain;
    background-size: contain;
    background-position: -15% 0;
  }
  .pickupArea a:after {
    height: 120px;
    -moz-background-size: contain;
    -o-background-size: contain;
    -webkit-background-size: contain;
    background-size: contain;
    background-position: 115% 0;
  }
  .pickupArea a p {
    margin: 0;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
    text-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.7);
  }
}

.btnBbq {
  background: #F2BC7D;
}
.btnBbq:hover {
  background: #FEF8F2;
  color: #F2BC7D;
}
.btnBbq:before {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/index/illust_bbq_left.png) no-repeat left top;
}
.btnBbq:after {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/index/illust_bbq_right.png) no-repeat right top;
}

.btnKakigoya {
  background: #6F6F6F;
}
.btnKakigoya:hover {
  background: #F4FAFB;
  color: #6F6F6F;
}
.btnKakigoya:before {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/index/illust_kaki_left.png) no-repeat left top;
}
.btnKakigoya:after {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/index/illust_kaki_right.png) no-repeat right top;
}

.btnMainShop {
  background: #8CB2E4;
}
.btnMainShop:hover {
  background: #F3F7FC;
  color: #8CB2E4;
}
.btnMainShop:before {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/index/illust_honten_left.png) no-repeat left top;
}
.btnMainShop:after {
  content: "";
  width: 100%;
  height: 270px;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  background: url(../images/index/illust_honten_right.png) no-repeat right top;
}

.indexLeft {
  width: 635px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .indexLeft {
    width: 100%;
    float: none;
  }
}

.indexRight {
  width: 290px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .indexRight {
    width: 100%;
    float: none;
  }
}

.topBlogArea,
.zauoBlogTitle {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .topBlogArea,
  .zauoBlogTitle {
    padding-top: 0;
    border-top: none;
  }
}
.topBlogArea h2,
.zauoBlogTitle h2 {
  margin: 0 0 30px;
  height: 33px;
  background: url(../images/blog/hl_blog.gif) no-repeat 47px top;
  -moz-background-size: contain;
  -o-background-size: contain;
  -webkit-background-size: contain;
  background-size: contain;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  font-size: 20px;
  font-size: 1.25rem;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .topBlogArea h2,
  .zauoBlogTitle h2 {
    margin-bottom: 20px;
    background-size: 126px auto;
    background-position: 31px top;
    text-indent: 0;
    white-space: normal;
    overflow: visible;
  }
}
.topBlogArea h2 a,
.zauoBlogTitle h2 a {
  display: block;
  width: 205px;
  height: 37px;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .topBlogArea h2 a,
  .zauoBlogTitle h2 a {
    width: auto;
    height: auto;
    text-decoration: none;
    font-size: 0px;
    font-size: 0rem;
  }
}
.topBlogArea h2 a:hover,
.zauoBlogTitle h2 a:hover {
  background: rgba(255, 255, 255, 0.5);
}
.topBlogArea h2 i,
.zauoBlogTitle h2 i {
  position: absolute;
  top: 0;
  left: 0;
  text-indent: 0;
  font-size: 34px;
  font-size: 2.125rem;
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .topBlogArea h2 i,
  .zauoBlogTitle h2 i {
    margin-right: 5px;
    display: inline-block;
    font-size: 24px;
    font-size: 1.5rem;
    position: static;
  }
}

.topBlogArea {
  margin: 0 auto 60px;
  padding-top: 30px;
}
@media only screen and (max-width: 787px) {
  .topBlogArea .container.topTitle {
    width: 96%;
  }
}

@media only screen and (max-width: 787px) {
  .zauoBlogTitle {
    margin: 0 10px 20px;
  }
}
@media only screen and (max-width: 787px) {
  .zauoBlogTitle h2 {
    margin-top: 47px;
    padding: 0 0 25px;
  }
}
@media only screen and (max-width: 787px) {
  .zauoBlogTitle .btnBlogList {
    top: 0;
    right: 10px;
  }
}

.btnBlogList {
  margin: 0;
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .btnBlogList {
    top: 4px;
  }
}
.btnBlogList a {
  padding: 10px 33px;
  display: inline-block;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #EDEDED;
  font-size: 13px;
  font-size: 0.8125rem;
  text-decoration: none;
  color: #333;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .btnBlogList a {
    padding: 2px 6px;
    font-size: 11px;
    font-size: 0.6875rem;
  }
}
.btnBlogList a:hover {
  background: #EB604B;
  color: #FFF;
}
.btnBlogList a i.icon-news3 {
  margin-right: 7px;
  font-size: 18px;
  font-size: 1.125rem;
}
.btnBlogList a i.icon-arrow487 {
  margin-left: 8px;
  display: inline-block;
  font-size: 10px;
  font-size: 0.625rem;
}
.btnBlogList.btnLarge {
  padding-top: 10px;
  position: static;
  clear: both;
}
.btnBlogList.btnLarge a {
  padding: 15px 0;
  width: 100%;
  display: block;
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .btnBlogList.btnLarge a {
    padding: 10px 0;
    font-size: 14px;
    font-size: 0.875rem;
  }
}

.blogLeft {
  width: 290px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .blogLeft {
    width: auto;
    float: none;
  }
}

.blogRight {
  width: 638px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .blogRight {
    margin-bottom: 40px;
    width: auto;
    float: none;
  }
}

.secInfoSide h3 {
  margin: 0;
  padding-left: 15px;
  height: 50px;
  line-height: 50px;
  background: url(../images/common/bg_umi_blue.gif);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 15px;
  font-size: 0.9375rem;
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .secInfoSide h3 {
    height: 40px;
    line-height: 40px;
  }
}
.secInfoSide h3 i {
  margin: 15px 13px 0 0;
  float: right;
}

.secBlogNav .infoList {
  padding: 20px 14px;
  border-right: 1px solid #DDD;
  border-bottom: 1px solid #DDD;
  border-left: 1px solid #DDD;
}
.secBlogNav .infoList:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}
.secBlogNav .infoList figure {
  margin: 0;
  width: 62px;
  float: left;
  display: block;
}
.secBlogNav .infoList p {
  margin: 0;
  width: 175px;
  float: right;
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: bold;
  line-height: 1.5;
}
.secBlogNav .infoList p a {
  text-decoration: none;
  color: #333;
}
.secBlogNav .infoList p a:hover {
  text-decoration: underline;
}
.secBlogNav .categoryList {
  margin: 0 0 50px;
  padding: 0;
}
@media only screen and (max-width: 787px) {
  .secBlogNav .categoryList {
    margin: 0 0 30px;
  }
}
.secBlogNav .categoryList li {
  list-style: none;
  border-bottom: 1px solid #EDEDED;
}
.secBlogNav .categoryList li a {
  padding: 13px 0 13px 45px;
  display: block;
  text-decoration: none;
  color: #000;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .secBlogNav .categoryList li a {
    padding: 10px 0 10px 45px;
  }
}
.secBlogNav .categoryList li a:hover {
  background: #DDD;
}
.secBlogNav .categoryList li a i {
  margin: -8px 20px 0 0;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 15px;
}

.bnrArea {
  margin: 0;
  padding: 0;
}
.bnrArea li {
  margin-bottom: 30px;
  list-style: none;
}
.bnrArea li:last-child {
  margin-bottom: 0;
}
.bnrArea li a img {
  max-width: 100%;
  height: auto;
}
.bnrArea li a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.bnrArea li img {
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .bnrArea li img {
    width: 100%;
    max-width: 580px !important;
    height: auto;
  }
}
@media only screen and (max-width: 787px) {
  .bnrArea {
    margin: 0 10px;
  }
  .bnrArea li {
    margin-bottom: 15px;
    text-align: center;
  }
}

.infoArea {
  padding: 60px 0;
  background: #E4E4E4;
}
@media only screen and (max-width: 787px) {
  .infoArea {
    padding: 10px;
  }
}

.secInfo {
  width: 470px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .secInfo {
    margin-bottom: 10px;
    width: auto;
    float: none;
  }
}
.secInfo h2 {
  margin: 0;
  padding: 0 30px;
  width: 100%;
  line-height: 60px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: url(../images/common/bg_umi_pink.gif);
  color: #FFF;
  font-size: 18px;
  font-size: 1.125rem;
}
@media only screen and (max-width: 787px) {
  .secInfo h2 {
    padding: 0 10px;
    line-height: 40px;
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
.secInfo h2 i {
  margin-right: 10px;
  display: inline-block;
  color: #FFF;
}
.secInfo .infoBg {
  padding: 26px 30px;
  background: #FFF;
}
@media only screen and (max-width: 787px) {
  .secInfo .infoBg {
    padding: 15px 20px;
  }
}
.secInfo .infoList {
  margin-bottom: 15px;
}
.secInfo .infoList:last-child {
  margin-bottom: 0;
}
.secInfo .infoList time {
  width: 27%;
  line-height: 140%;
  display: block;
  float: left;
}
@media only screen and (max-width: 787px) {
  .secInfo .infoList time {
    width: auto;
    float: none;
  }
}
.secInfo .infoList h3 {
  margin: 0;
  width: 73%;
  float: right;
  line-height: 100%;
}
@media only screen and (max-width: 787px) {
  .secInfo .infoList h3 {
    width: auto;
    float: none;
  }
}
.secInfo .infoList h3 a {
  line-height: 140%;
  font-size: 15px;
  font-size: 0.9375rem;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .secInfo .infoList h3 a {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}

.snsArea {
  width: 470px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .snsArea {
    width: auto;
    float: none;
  }
}

.frontPage #wp_rp_zem_related_posts_wrap ul.selected li:last-child {
  display: none;
}

/*----------------------------------------
	howto
----------------------------------------*/
.howto .headline {
  padding-bottom: 80px;
  position: relative;
}
.howto .headline h2 {
  background: url(../images/howto/hl_howto.gif) no-repeat 82px bottom;
}
@media only screen and (max-width: 787px) {
  .howto .headline {
    padding: 0;
  }
}

.secHowto h3, .secAbout h3, .secFlow h3, .secRecruit h3 {
  margin: 0 0 40px;
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 30px;
}
.secHowto h3 span, .secAbout h3 span, .secFlow h3 span, .secRecruit h3 span {
  margin-right: 20px;
}
.secHowto h3 img, .secAbout h3 img, .secFlow h3 img, .secRecruit h3 img {
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .secHowto h3, .secAbout h3, .secFlow h3, .secRecruit h3 {
    margin: 0 0 20px;
    font-size: 16px;
    font-size: 1rem;
  }
  .secHowto h3 span, .secAbout h3 span, .secFlow h3 span, .secRecruit h3 span {
    display: block;
  }
  .secHowto h3 span img, .secAbout h3 span img, .secFlow h3 span img, .secRecruit h3 span img {
    width: 50px;
    height: auto;
  }
}
.secHowto .container, .secAbout .container, .secFlow .container, .secRecruit .container {
  padding: 0 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .secHowto .container, .secAbout .container, .secFlow .container, .secRecruit .container {
    padding: 0 10px;
  }
}

.illustHowto {
  width: 100%;
  height: 364px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
.illustHowto span {
  margin-left: -900px;
  width: 1800px;
  position: absolute;
  bottom: 0;
  left: 50%;
}
.illustHowto span img {
  position: absolute;
  bottom: 0;
  right: 0;
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .illustHowto {
    padding-top: 10px;
    width: auto;
    height: auto;
    position: static;
    overflow: auto;
    text-align: right;
  }
  .illustHowto span {
    margin-left: auto;
    width: auto;
    position: static;
  }
  .illustHowto span img {
    max-width: 100%;
    height: auto;
  }
  .illustHowto span img {
    max-width: 70%;
    position: static;
  }
}

.howto01 {
  margin-bottom: 80px;
  padding: 40px 0 0;
  background: url(../images/common/bg_umi.gif);
  position: relative;
}
@media only screen and (max-width: 787px) {
  .howto01 {
    margin-bottom: 20px;
    padding: 20px 0 0;
  }
}
.howto01 p {
  font-size: 14px;
  font-size: 0.875rem;
}
.howto01 p.attention {
  font-size: 12px;
  font-size: 0.75rem;
  color: #444;
}

@media only screen and (max-width: 787px) {
  .animationArea .container {
    padding: 0;
  }
  .animationArea .container p {
    font-size: 12px;
    font-size: 0.75rem;
  }
}

.secStep1 h4 {
  width: 160px;
  height: 31px;
  background: url(../images/howto/hl_step1.png) no-repeat;
  -moz-background-size: 160px auto;
  -o-background-size: 160px auto;
  -webkit-background-size: 160px auto;
  background-size: 160px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
@media only screen and (max-width: 787px) {
  .secStep1 {
    padding: 0 10px 10px;
  }
}

.secStep2 {
  position: absolute;
  top: 224px;
  z-index: 2;
}
.secStep2 h4 {
  width: 189px;
  height: 31px;
  background: url(../images/howto/hl_step2.png) no-repeat;
  -moz-background-size: 189px auto;
  -o-background-size: 189px auto;
  -webkit-background-size: 189px auto;
  background-size: 189px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.secStep2 p {
  color: #FFF;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .secStep2 {
    padding: 10px;
    position: static;
    background: #FFF;
  }
  .secStep2 h4 {
    background: url(../images/howto/hl_step2_sp.png) no-repeat;
    -moz-background-size: 189px auto;
    -o-background-size: 189px auto;
    -webkit-background-size: 189px auto;
    background-size: 189px auto;
  }
  .secStep2 p {
    color: #000;
    font-weight: normal;
  }
  .secStep2 p br:nth-child(3) {
    display: none;
  }
}

.secStep3 h4 {
  position: absolute;
  top: 370px;
  right: 150px;
  z-index: 10;
  visibility: hidden;
}
.secStep3 h4.bounceIn {
  visibility: visible !important;
  -webkit-animation-delay: 0.3s;
  -moz-animation-delay: 0.3s;
  -o-animation-delay: 0.3s;
  -ms-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.secStep3 img {
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .secStep3 {
    padding: 0 10px;
    background: #FFF;
  }
  .secStep3 h4 {
    display: none;
  }
}

.fishBite {
  position: relative;
}
.fishBite h4 {
  width: 632px;
  height: 612px;
  background: url(../images/howto/bg_fish_bite.png) no-repeat left bottom;
  text-align: right;
}

.hlFishBite {
  position: absolute;
  top: 214px;
  left: 86px;
}

.hlStep3 {
  width: 33%;
  height: auto;
  position: absolute;
  top: 15px;
  left: 10px;
  display: none;
}
@media only screen and (max-width: 787px) {
  .hlStep3 {
    display: block;
  }
}

.bgStep3 {
  display: none;
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .bgStep3 {
    display: block;
  }
}

.imgSea {
  display: none;
}
.imgSea img {
  max-width: 100%;
  height: auto;
}
.imgSea img {
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .imgSea {
    display: block;
  }
}

.ship {
  position: relative;
}
.ship:before {
  content: "";
  width: 100%;
  height: 32px;
  background: url(../images/howto/bg_wave.png) repeat-x;
  position: absolute;
  top: 36px;
  left: 0;
  right: 0;
  z-index: 1;
}
@media only screen and (max-width: 787px) {
  .ship:before {
    display: none;
  }
}
.ship:after {
  margin-left: -578px;
  content: "";
  width: 1157px;
  height: 673px;
  display: block;
  background: url(../images/howto/bg_sea.png) no-repeat;
  position: absolute;
  top: 330px;
  left: 50%;
  z-index: 2;
}
@media only screen and (max-width: 787px) {
  .ship:after {
    display: none;
  }
}
.ship .imgShip {
  position: absolute;
  top: -110px;
  right: 150px;
  z-index: 0;
}
@media only screen and (max-width: 787px) {
  .ship .imgShip {
    display: none;
  }
}

.seaArea {
  margin-top: 80px;
  height: 963px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  background-color: #9ACFEB;
  background: -webkit-linear-gradient(top, #72A8DC 0%, #9ACFEB 100%);
  background: -moz-linear-gradient(top, #72A8DC 0%, #9ACFEB 100%);
  background: -ms-linear-gradient(top, #72A8DC 0%, #9ACFEB 100%);
  background: -o-linear-gradient(top, #72A8DC 0%, #9ACFEB 100%);
  background: linear-gradient(to bottom, #72A8DC 0%, #9ACFEB 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, StartColorStr='#72A8DC', EndColorStr='#9ACFEB');
}
@media only screen and (max-width: 787px) {
  .seaArea {
    display: none;
  }
}
.seaArea:before {
  content: "";
  width: 161px;
  height: 706px;
  background: url(../images/howto/seaweed_left.png) no-repeat;
  position: absolute;
  top: 50px;
  left: 0;
}
.seaArea:after {
  content: "";
  width: 200px;
  height: 774px;
  background: url(../images/howto/seaweed_right.png) no-repeat;
  position: absolute;
  top: 140px;
  right: 0;
}

.fishingLine img {
  position: absolute;
  top: -92px;
  right: 510px;
  z-index: 3;
}
@media only screen and (max-width: 787px) {
  .fishingLine {
    display: none;
  }
}

.fish01 img {
  position: absolute;
  top: 48px;
  left: 257px;
}

.fish02 img {
  position: absolute;
  top: 54px;
  left: 714px;
}

.fish03 img {
  position: absolute;
  top: 398px;
  left: 124px;
}

.fish04 img {
  position: absolute;
  top: 408px;
  left: 882px;
}

.fish05 img {
  position: absolute;
  top: 664px;
  left: 36px;
}

.fish06 img {
  position: absolute;
  top: 606px;
  right: 0;
}
.fish06.fishStop img {
  right: 358px !important;
}

.octopas img {
  position: absolute;
  top: 807px;
  left: 868px;
}

.secStep4 {
  padding-top: 80px;
  height: 400px;
  background: url(../images/howto/hand.png) no-repeat 400px bottom;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.secStep4 h4 {
  width: 211px;
  height: 31px;
  background: url(../images/howto/hl_step4.png) no-repeat;
  -moz-background-size: 189px auto;
  -o-background-size: 189px auto;
  -webkit-background-size: 189px auto;
  background-size: 189px auto;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}
@media only screen and (max-width: 787px) {
  .secStep4 {
    padding: 10px;
    height: 300px;
    background-position: center bottom;
    -moz-background-size: 200px auto;
    -o-background-size: 200px auto;
    -webkit-background-size: 200px auto;
    background-size: 200px auto;
  }
}

.step4Area {
  background: #F1F8FF;
  border-bottom: 1px solid #DBDBDB;
}

.fishEnd {
  position: absolute;
  top: 50px;
  right: 38px;
  visibility: hidden;
}
.fishEnd.bounceIn {
  visibility: visible !important;
}
@media only screen and (max-width: 787px) {
  .fishEnd {
    top: 150px;
    left: 50%;
    visibility: visible;
  }
  .fishEnd img {
    margin-left: -110px;
    width: 220px;
    height: auto;
  }
}

.pHanmi {
  margin: 0;
  position: absolute;
  top: 0;
  right: 20px;
}
@media only screen and (max-width: 787px) {
  .pHanmi {
    position: static;
    text-align: center;
  }
  .pHanmi img {
    max-width: 100%;
    height: auto;
  }
}
.pHanmi img {
  vertical-align: bottom;
}

.howto02 {
  padding-bottom: 70px;
}
@media only screen and (max-width: 787px) {
  .howto02 {
    padding-bottom: 40px;
  }
}
.howto02 ol {
  margin: 0;
  padding: 60px 0 0;
}
@media only screen and (max-width: 787px) {
  .howto02 ol {
    padding-top: 20px;
  }
}
.howto02 ol li {
  margin-left: 40px;
  width: 205px;
  list-style: none;
  float: left;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 143%;
}
@media only screen and (max-width: 787px) {
  .howto02 ol li {
    margin: 0 0 20px 0;
    width: 50%;
    font-size: 12px;
    font-size: 0.75rem;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .howto02 ol li:nth-child(odd) {
    padding-right: 5px;
  }
  .howto02 ol li:nth-child(even) {
    padding-left: 5px;
  }
}
.howto02 ol li:first-child {
  margin-left: 0;
}
.howto02 ol li figure {
  margin: 0;
}
.howto02 ol li figure img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .howto02 ol li figure {
    text-align: center;
  }
}
.howto02 ol li figure img {
  margin-bottom: 30px;
  vertical-align: bottom;
}
.howto02 ol li figure figcaption {
  margin-bottom: 25px;
  display: block;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .howto02 ol li figure figcaption {
    margin-bottom: 10px;
    font-size: 16px;
    font-size: 1rem;
  }
}

.btnShopSearch {
  padding: 0 20px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  table-layout: fixed;
}
.btnShopSearch a {
  width: 940px;
  height: 80px;
  display: table-cell;
  border: 1px solid #E50012;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  text-align: center;
  font-size: 18px;
  font-size: 1.125rem;
  color: #E50012;
  text-decoration: none;
  vertical-align: middle;
  font-weight: bold;
}
.btnShopSearch a i {
  margin: -6px 20px 0 0;
  width: 54px;
  height: 50px;
  overflow: hidden;
  display: inline-block;
  vertical-align: middle;
  font-size: 60px;
  font-size: 3.75rem;
  font-weight: normal;
}
.btnShopSearch a:hover {
  background: #E50012;
  color: #FFF;
}
.btnShopSearch a:hover i {
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .btnShopSearch a {
    width: 100%;
    height: 50px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    font-size: 1rem;
  }
  .btnShopSearch a i {
    margin: -6px 10px 0 0;
    width: 30px;
    height: 27px;
    font-size: 30px;
    font-size: 1.875rem;
  }
}

/*----------------------------------------
	about
----------------------------------------*/
.about {
  padding-bottom: 0 !important;
}
.about .headline {
  padding-bottom: 180px;
  position: relative;
}
.about .headline h2 {
  height: 62px;
  background: url(../images/about/hl_about.gif) no-repeat 82px bottom;
}
.about .headline h2 i {
  top: -3px;
  font-size: 64px;
  font-size: 4rem;
}
@media only screen and (max-width: 787px) {
  .about .headline {
    padding: 0;
    height: auto;
  }
  .about .headline h2 {
    height: auto;
  }
  .about .headline h2 span {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}

.illustAbout {
  width: 100%;
  height: 398px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
.illustAbout span {
  margin-left: -1210px;
  width: 1800px;
  position: absolute;
  bottom: 0;
  left: 50%;
}
.illustAbout span img {
  position: absolute;
  bottom: 0;
  right: 0;
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .illustAbout {
    padding-top: 10px;
    width: auto;
    height: auto;
    position: static;
    overflow: auto;
    text-align: right;
  }
  .illustAbout span {
    margin-left: auto;
    width: auto;
    position: static;
  }
  .illustAbout span img {
    max-width: 100%;
    height: auto;
  }
  .illustAbout span img {
    max-width: 70%;
    position: static;
  }
}

.secAbout {
  padding: 30px 0 160px;
  background: url(../images/common/bg_umi.gif);
}
@media only screen and (max-width: 787px) {
  .secAbout {
    margin-bottom: 0;
    padding: 20px 0;
  }
  .secAbout .container {
    padding: 0 !important;
  }
}

.btnAbout, .btnRecruitChange {
  margin: 0;
  padding: 0;
}
.btnAbout li, .btnRecruitChange li {
  width: 33.3333%;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border-left: 1px solid #FFF;
  list-style: none;
}
.btnAbout li:first-child, .btnRecruitChange li:first-child {
  border-left: none;
}
.btnAbout li a, .btnRecruitChange li a {
  width: 100%;
  line-height: 60px;
  display: block;
  text-align: center;
  background: #E50012;
  color: #FFF;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .btnAbout li a, .btnRecruitChange li a {
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 44px;
  }
}
.btnAbout li a:hover, .btnRecruitChange li a:hover {
  background: #FFF;
  color: #E50012;
}
.btnAbout li.active a, .btnRecruitChange li.active a {
  background: #FFF;
  color: #E50012;
}

.aboutHeadline {
  height: 230px;
  border-bottom: 1px solid #CCC;
  background: #FFF;
}
.aboutHeadline h3 {
  margin: 0;
  padding-top: 85px;
  width: 50%;
  float: left;
  text-align: center;
}
.aboutHeadline > div {
  width: 50%;
  float: left;
}
.aboutHeadline > div img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .aboutHeadline {
    height: auto;
    border-bottom: none;
  }
  .aboutHeadline h3 {
    padding: 30px 0;
    width: auto;
    float: none;
  }
  .aboutHeadline h3 img {
    width: auto;
    max-height: 40px;
  }
  .aboutHeadline > div {
    width: auto;
    float: none;
    text-align: center;
  }
}

.aboutArea {
  background: #FFF;
}

.detail {
  margin: 0 40px;
  padding: 40px 0;
  width: auto;
}
@media only screen and (max-width: 787px) {
  .detail {
    margin: 0 10px;
    padding: 30px 0;
  }
}
.detail h4 {
  margin: 0 0 40px;
  padding-bottom: 10px;
  font-size: 20px;
  font-size: 1.25rem;
  border-bottom: 2px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .detail h4 {
    margin-bottom: 10px;
    padding-bottom: 5px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.detail h4 i {
  margin-right: 10px;
  font-size: 28px;
  font-size: 1.75rem;
  vertical-align: top;
}
@media only screen and (max-width: 787px) {
  .detail h4 i {
    font-size: 26px;
    font-size: 1.625rem;
  }
}
.detail h4 i:before {
  vertical-align: top;
}

.aboutLeft, .aboutRight {
  padding: 0 20px;
  width: 50%;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.aboutLeft b, .aboutRight b {
  margin-bottom: 15px;
  display: inline-block;
  font-size: 18px;
  font-size: 1.125rem;
}
@media only screen and (max-width: 787px) {
  .aboutLeft, .aboutRight {
    padding: 0 10px;
    width: auto;
    float: none;
  }
  .aboutLeft b, .aboutRight b {
    margin-bottom: 10px;
    font-size: 16px;
    font-size: 1rem;
  }
}

.aboutRight {
  float: right;
}
@media only screen and (max-width: 787px) {
  .aboutRight {
    float: none;
  }
}

.pAbout {
  font-size: 14px;
  font-size: 0.875rem;
}

/* food */
.btnHarbor {
  margin-top: 45px;
  padding: 0 10px;
  width: 100%;
  display: table;
  table-layout: fixed;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .btnHarbor {
    margin-top: 50px;
    padding: 0;
  }
}
.btnHarbor a {
  width: 100%;
  line-height: 80px;
  display: table-cell;
  text-align: center;
  color: #194375;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  border: 1px solid #194375;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .btnHarbor a {
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 60px;
  }
}
.btnHarbor a i {
  margin-right: 10px;
  font-size: 44px;
  font-size: 2.75rem;
  font-weight: normal;
  color: #194375;
  vertical-align: middle;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
@media only screen and (max-width: 787px) {
  .btnHarbor a i {
    font-size: 32px;
    font-size: 2rem;
  }
}
.btnHarbor a span {
  display: inline-block;
}
.btnHarbor a:hover {
  background: #194375;
  color: #FFF;
}
.btnHarbor a:hover i {
  color: #FFF;
}

.groupList {
  margin: 0;
  padding: 0;
}
.groupList > li {
  margin: 0 0 30px 20px;
  width: 200px;
  list-style: none;
  float: left;
  font-size: 12px;
  font-size: 0.75rem;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .groupList > li {
    margin: 0 0 20px;
    padding: 0 5px;
    width: 50%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
.groupList > li:nth-child(4n+1) {
  margin-left: 0;
}
.groupList > li figure {
  margin: 0;
}
.groupList > li figure img {
  max-width: 100%;
  height: auto;
}
.groupList > li figure figcaption {
  width: 100%;
  display: table;
  table-layout: fixed;
  text-align: center;
}
.groupList > li figure figcaption span {
  width: 200px;
  height: 50px;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 120%;
  color: #000;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .groupList > li figure figcaption span {
    width: auto;
    height: 40px;
    font-size: 13px;
    font-size: 0.8125rem;
  }
}
.groupList > li p {
  line-height: 146%;
}

/* sp */
.bnrWearMAgic {
  margin: 0;
  padding: 40px 0 20px;
  clear: both;
}
.bnrWearMAgic img {
  max-width: 100%;
  height: auto;
}
.bnrWearMAgic img {
  vertical-align: bottom;
}

.btnSp {
  margin: 0;
  padding: 0;
}
.btnSp li {
  margin-left: 20px;
  width: 420px;
  display: table;
  table-layout: fixed;
  list-style: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
}
@media only screen and (max-width: 787px) {
  .btnSp li {
    margin: 0 0 10px;
    float: none;
    width: 100%;
  }
}
.btnSp li:first-child {
  margin-left: 0;
}
.btnSp li a {
  width: 100%;
  line-height: 80px;
  display: table-cell;
  text-align: center;
  color: #E50012;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  border: 1px solid #E50012;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .btnSp li a {
    line-height: 60px;
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.btnSp li a i {
  margin-right: 10px;
  font-size: 44px;
  font-size: 2.75rem;
  font-weight: normal;
  color: #E50012;
  vertical-align: middle;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
@media only screen and (max-width: 787px) {
  .btnSp li a i {
    font-size: 32px;
    font-size: 2rem;
  }
}
.btnSp li a i.icon-wearmagic {
  font-size: 78px;
  font-size: 4.875rem;
}
@media only screen and (max-width: 787px) {
  .btnSp li a i.icon-wearmagic {
    font-size: 54px;
    font-size: 3.375rem;
  }
}
.btnSp li a span {
  display: inline-block;
}
.btnSp li a:hover {
  background: #E50012;
  color: #FFF;
}
.btnSp li a:hover i {
  color: #FFF;
}

/* bxSlider */
.bx-wrapper img {
  max-width: 100%;
  height: auto;
}

.bx-viewport {
  margin: 0 auto;
  width: 404px !important;
  height: 302px !important;
}
@media only screen and (max-width: 787px) {
  .bx-viewport {
    width: 270px !important;
    height: 202px !important;
  }
}

.bx-pager {
  bottom: -40px !important;
}
.bx-pager .bx-pager-link {
  background: #CCC !important;
}
.bx-pager .active {
  background: #194375 !important;
}

/*----------------------------------------
	experience
----------------------------------------*/
.experience .headline {
  padding-bottom: 180px;
  position: relative;
}
.experience .headline h2 {
  height: 55px;
  background: url(../images/experience/hl_experience.gif) no-repeat 82px bottom;
}
.experience .headline h2 i {
  top: -3px;
  font-size: 64px;
  font-size: 4rem;
}
@media only screen and (max-width: 787px) {
  .experience .headline {
    padding: 0;
    height: auto;
  }
  .experience .headline h2 {
    height: auto;
  }
}

.secFlow {
  margin-bottom: 50px;
  padding: 40px 0;
  background: url(../images/common/bg_umi.gif);
}
@media only screen and (max-width: 787px) {
  .secFlow {
    margin-bottom: 20px;
    padding: 20px 0;
  }
}
.secFlow ol {
  margin: 0;
  padding: 5px 0 0;
}
.secFlow ol li {
  margin-left: 40px;
  width: 205px;
  list-style: none;
  float: left;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 143%;
  position: relative;
}
.secFlow ol li i {
  font-size: 20px;
  font-size: 1.25rem;
  color: #E50012;
  position: absolute;
  top: 88px;
  right: -29px;
}
@media only screen and (max-width: 787px) {
  .secFlow ol li {
    margin: 0 0 20px 0;
    width: 50%;
    font-size: 12px;
    font-size: 0.75rem;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .secFlow ol li:nth-child(odd) {
    padding-right: 5px;
  }
  .secFlow ol li:nth-child(even) {
    padding-left: 5px;
  }
  .secFlow ol li i {
    display: none;
  }
}
.secFlow ol li:first-child {
  margin-left: 0;
}
.secFlow ol li figure {
  margin: 0;
}
.secFlow ol li figure img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .secFlow ol li figure {
    text-align: center;
  }
}
.secFlow ol li figure img {
  margin-bottom: 25px;
  vertical-align: bottom;
}
.secFlow ol li figure figcaption {
  margin-bottom: 25px;
  display: block;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
}
.secFlow ol li figure figcaption span {
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .secFlow ol li figure figcaption {
    margin-bottom: 10px;
    font-size: 16px;
    font-size: 1rem;
  }
}

.illustExperience {
  width: 100%;
  height: 398px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
.illustExperience span {
  margin-left: -1330px;
  width: 1800px;
  position: absolute;
  bottom: 0;
  left: 50%;
}
.illustExperience span img {
  position: absolute;
  bottom: 0;
  right: 0;
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .illustExperience {
    padding-top: 10px;
    width: auto;
    height: auto;
    position: static;
    overflow: auto;
    text-align: right;
  }
  .illustExperience span {
    margin-left: auto;
    width: auto;
    position: static;
  }
  .illustExperience span img {
    max-width: 100%;
    height: auto;
  }
  .illustExperience span img {
    max-width: 70%;
    position: static;
  }
}

.btnBase .icon-bull1 {
  margin-top: 5px;
  font-size: 44px;
  font-size: 2.75rem;
}
@media only screen and (max-width: 787px) {
  .btnBase .icon-bull1 {
    margin-top: 0;
    width: auto;
    font-size: 26px;
    font-size: 1.625rem;
  }
}

.bnrAreaBot {
  padding-top: 80px;
}
.bnrAreaBot p {
  margin: 0;
  text-align: center;
}
.bnrAreaBot a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
@media only screen and (max-width: 787px) {
  .bnrAreaBot {
    padding: 30px 10px 0;
  }
  .bnrAreaBot a img {
    max-width: 100%;
    height: auto;
  }
}

.secShopArea h3, .secShopShimaiArea h3 {
  background: url(http://www.zauo.com/wp-content/themes/zauo/images/common/bg_umi_blue.gif);
}

.shopList .shopName {
  float: none;
  padding-bottom: 10px;
}

.shopList > li {
  border-bottom: 1px solid #ccc;
  list-style: outside none none;
  margin-bottom: 40px;
  padding-bottom: 40px;
}

.shopList > li:first-child {
  border-top: 1px solid #ccc;
  margin-top: 40px;
  padding-top: 40px;
}

.shopList .shimaiDetail dl {
  overflow: hidden;
  font-size: 0.875rem;
}

.shopList .shimaiDetail dl dt {
  float: left;
}

.shopList .shimaiDetail dl dd {
  margin: 0 0 5px 0;
  padding: 0 0 0 200px;
}

@media only screen and (max-width: 787px) {
  .experience .secShopArea, .experience .secShopShimaiArea {
    padding: 0 10px;
  }

  .shopList .shimaiDetail dl {
    width: auto;
    margin: 0 15px 20px;
  }

  .shopList .shimaiDetail dl:last-child {
    margin: 0 15px 0;
  }

  .shopList .shimaiDetail dl dt {
    float: none;
    font-weight: bold;
  }

  .shopList .shimaiDetail dl dd {
    margin: 0 0 15px 0;
    padding: 0;
  }

  .shopList .shimaiDetail dl dd:last-child {
    margin: 0;
  }
}
/*----------------------------------------
	bbq
----------------------------------------*/
.bbq {
  /* 背景
  -----------------------------------------*/
  /* 平日限定
  -----------------------------------------*/
  /* 手ぶらでBBQ
  -----------------------------------------*/
  /*-float-*/
  /*100512*/
  /*100512ここまで*/
  /* 手ぶらでBBQ　BBS
  -----------------------------------------*/
  /* safari only \*/
  /* end */
  /*--------------------
  	clearfix
  --------------------*/
  /* For modern browsers */
  /* For IE 6/7 (trigger hasLayout) */
}
.bbq img {
  max-width: 100%;
  height: auto;
}
.bbq #bbq {
  padding: 10px 0 0 0;
  text-align: center;
}
.bbq #bbq .li128 {
  line-height: 1.24;
}
.bbq #bbq .bgImg {
  background: url(../images/bbq/bg01.gif) left top repeat-x;
}
.bbq #bbq .daySP {
  font-size: 11pt;
  color: #FFFFFF;
  font-weight: bold;
  padding: 5px 0 3px 3px;
  background-color: #664700;
}
.bbq #bbq .tit {
  color: #990000;
  font-weight: bold;
}
.bbq #bbq .dot {
  font-size: 8pt;
  padding-top: 4px;
  color: #CC9966;
}
.bbq .floatR {
  float: right;
}
@media only screen and (max-width: 787px) {
  .bbq .floatR {
    float: none;
    text-align: center;
  }
}
.bbq .floatL {
  float: left;
}
.bbq #main {
  padding: 0;
  margin: 0 auto 25px;
  width: 720px;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .bbq #main {
    margin: 0 10px 25px;
    width: auto;
  }
}
.bbq #tagline {
  position: relative;
  height: 605px;
  margin: 0 auto;
}
@media only screen and (max-width: 787px) {
  .bbq #tagline {
    height: auto;
  }
}
.bbq h2 {
  text-align: center;
  padding: 0;
  margin: 0;
}
.bbq .maintenance {
  padding-top: 60px;
  font-size: 28px;
  font-size: 1.75rem;
  text-align: center;
  font-weight: bold;
  line-height: 140%;
}
@media only screen and (max-width: 787px) {
  .bbq .maintenance {
    padding-top: 30px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.bbq #point {
  position: absolute;
  list-style: none;
  margin: 0;
  padding: 0;
  top: 405px;
  left: 95px;
  z-index: 5;
}
@media only screen and (max-width: 787px) {
  .bbq #point {
    position: static;
  }
}
.bbq #point li {
  float: left;
  width: 178px;
  display: inline;
}
@media only screen and (max-width: 787px) {
  .bbq #point li {
    width: 33.3333%;
    text-align: center;
  }
}
.bbq #price {
  padding: 0 0 20px;
  margin-top: 70px;
}
@media only screen and (max-width: 787px) {
  .bbq #price {
    margin-top: 20px;
  }
}
.bbq #price #course {
  list-style: none;
  margin: 10px 0 10px 23px;
  padding: 0;
}
@media only screen and (max-width: 787px) {
  .bbq #price #course {
    margin: 0;
  }
}
.bbq #price #course li {
  float: left;
  display: inline;
  height: 277px;
}
@media only screen and (max-width: 787px) {
  .bbq #price #course li {
    height: auto;
    float: none;
  }
}
.bbq #single2 {
  text-align: right;
  margin-left: 21px;
  margin-right: 70px;
}
@media only screen and (max-width: 787px) {
  .bbq #single2 {
    text-align: center;
    margin: 0;
  }
}
.bbq #single3 {
  text-align: right;
  margin-left: 35px;
  margin-right: 70px;
}
@media only screen and (max-width: 787px) {
  .bbq #single3 {
    text-align: center;
    margin: 0;
  }
}
.bbq #single {
  text-align: left;
  margin-left: 21px;
}
@media only screen and (max-width: 787px) {
  .bbq #single {
    text-align: center;
    margin: 0;
  }
}
.bbq .note {
  background: #ffffff;
  width: 630px;
  margin: 10px auto 0;
  padding: 10px 15px;
  font-size: 100%;
  text-align: left;
}
@media only screen and (max-width: 787px) {
  .bbq .note {
    width: auto;
    margin: 0;
    padding: 10px 0;
  }
}
.bbq * html .note {
  width: 660px;
}
.bbq .note p {
  font-weight: bold;
  margin: 0 0 5px;
  padding: 0;
}
.bbq .note ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.bbq .note li {
  padding: 0;
  margin: 0 0 5px;
}
.bbq #reserve {
  position: absolute;
  list-style: none;
  margin: 0;
  padding: 0;
  top: 617px;
  left: 20px;
  z-index: 10;
  height: 50px;
}
.bbq #reserve li {
  float: left;
  display: inline;
  width: 317px;
  height: 42px;
  margin: 0 13px;
}
@media only screen and (max-width: 787px) {
  .bbq #reserve {
    position: static;
    height: auto;
  }
  .bbq #reserve li {
    margin-bottom: 10px;
    float: none;
    display: block;
    text-align: center;
    width: auto;
    height: auto;
  }
}
.bbq div.tebra {
  display: inline;
  margin: 0 0 0 30px;
  padding: 30px 42px 10px 60px;
  text-align: left;
  float: left;
  width: 243px;
  height: 390px;
  background: url(../images/bbq/bg_teb.jpg) 0 0 no-repeat;
}
.bbq div.kimama {
  float: left;
  padding: 30px 37px 10px 55px;
  text-align: left;
  width: 248px;
  height: 390px;
  background: url(../images/bbq/bg_kima.jpg) 0 0 no-repeat;
}
.bbq div.tebra li, .bbq div.kimama li {
  font-size: 12px;
  color: #725330;
  font-weight: bold;
  line-height: 1.5;
}
.bbq p.aPlan {
  margin: 0 0 10px 0;
}
.bbq div.tebra p.ttlsbbq, .bbq div.kimama p.ttlsbbq {
  width: 250px;
  height: 84px;
  padding: 0 0 0 0;
  margin: 0 0 10px 0;
}
.bbq ul li {
  list-style: none;
}
.bbq div.tebra p.pBox, .bbq div.kimama p.pBox, .bbq div.kimama p.pBox2, .bbq div.kimama p.pBox3 {
  width: 243px;
  font-size: 12px;
  line-height: 1.6;
  margin: 0 0 0 0;
  color: #725330;
  font-weight: bold;
}
.bbq div.kimama p.pBox2 {
  color: #f08200;
}
.bbq div.kimama p.pBox3 {
  font-size: 10px;
}
.bbq div.tebra li p.kome, .bbq div.kimama li p.kome {
  font-size: 10px;
  color: #cc6600;
  font-weight: normal;
  margin: 0 0 5px 0;
}
.bbq div.tebra p.kome, .bbq div.kimama p.kome {
  width: 243px;
  margin: 0 0 7px 0;
  font-size: 10px;
  color: #cc6600;
  line-height: 1.5;
}
.bbq div.tebra p.fish {
  width: 105px;
  height: 60px;
  padding: 0 0 10px 65px;
}
.bbq .kome2 {
  font-size: 10px;
  margin: 0 0 10px 0;
}
.bbq .qaBot h3 {
  margin: 0;
  padding: 0;
  height: 156px;
  overflow: hidden;
}
.bbq .qaBot h3 span {
  display: none;
}
@media only screen and (max-width: 787px) {
  .bbq .qaBot h3 {
    margin-bottom: 10px;
    height: auto;
    text-align: center;
  }
  .bbq .qaBot h3 img {
    display: none;
  }
  .bbq .qaBot h3 span {
    display: block;
    font-size: 22px;
    font-size: 1.375rem;
  }
}
.bbq .qa {
  width: 610px;
  margin: 0 auto;
  padding: 0 29px 0 29px;
  background: url(../images/bbq/qa_board.jpg) 0 0 repeat-y;
  text-align: left;
}
@media only screen and (max-width: 787px) {
  .bbq .qa {
    padding: 0;
    width: auto;
    background: none;
  }
  .bbq .qa > div {
    height: auto !important;
  }
}
.bbq .qaBot {
  width: 661px;
  margin: 0 auto;
  padding: 0 0 50px 0;
  background: url(../images/bbq/qa_board_b.jpg) 0 100% no-repeat;
}
@media only screen and (max-width: 787px) {
  .bbq .qaBot {
    padding-top: 20px;
    margin: 0 10px;
    width: auto;
    background: none;
  }
}
.bbq .qa dl {
  float: left;
  width: 290px;
  display: inline;
  margin: 0px;
  padding: 0px;
  margin-top: 15px;
}
@media only screen and (max-width: 787px) {
  .bbq .qa dl {
    float: none;
    width: auto;
  }
}
.bbq .qa dl.marL {
  margin: 15px 0 0 15px;
}
.bbq div .course01, .bbq div .course02, .bbq div .course03 {
  margin-bottom: 30px;
}
.bbq div.course01 span, .bbq div .course02 span, .bbq div .course03 span, .bbq div .course04 span {
  color: #FF0000;
}
.bbq .qa .course01 dl dt {
  background: url(../images/bbq/icon_q_01.gif) 0 0 no-repeat;
  padding: 5px 0 5px 35px;
  margin: 0 0 5px 0;
  color: #1A60A6;
  font-size: 100%;
  line-height: 1.5;
  font-weight: bold;
}
.bbq .qa .course02 dl dt {
  background: url(../images/bbq/icon_q_02.gif) 0 0 no-repeat;
  padding: 5px 0 5px 35px;
  margin: 0 0 5px 0;
  color: #692F10;
  font-size: 100%;
  line-height: 1.5;
  font-weight: bold;
}
.bbq .qa .course03 dl dt {
  background: url(../images/bbq/icon_q_03.gif) 0 0 no-repeat;
  padding: 5px 0 5px 35px;
  margin: 0 0 5px 0;
  color: #DB5E12;
  font-size: 100%;
  line-height: 1.5;
  font-weight: bold;
}
.bbq .qa .course04 dl dt {
  background: url(../images/bbq/icon_q_04.gif) 0 0 no-repeat;
  padding: 5px 0 5px 35px;
  margin: 0 0 5px 0;
  color: #608C35;
  font-size: 100%;
  line-height: 1.5;
  font-weight: bold;
}
.bbq .qa .course04 .busprice {
  clear: both;
  color: #608C35;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  margin: 5px 0 20px 35px;
  padding: 5px 10px;
  line-height: 100%;
  border: 1px dotted #608C35;
}
.bbq .qa .course04 .highway {
  clear: both;
  color: #FF0000;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  margin: 5px 0 20px 35px;
  padding: 5px 10px;
  line-height: 140%;
  border: 2px solid #FF0000;
}
.bbq .qa .course04 .highway span {
  font-size: 75%;
}
.bbq .qa .course04 .bad {
  clear: both;
  color: #FF0000;
  font-weight: bold;
  font-size: 100%;
  text-align: left;
  margin: 5px 0 20px 0px;
  padding: 5px 10px;
  line-height: 140%;
  border: 2px solid #FF0000;
}
.bbq .qa dl dd {
  background: url(../images/bbq/icon_a.gif) 0 0 no-repeat;
  padding: 5px 0 3px 35px;
  margin: 0 0 10px 0;
  font-size: 90%;
  line-height: 1.5;
}
.bbq .qa dl dd span {
  color: #FF0000;
}
.bbq .qaSbttl01 {
  width: 602px;
  clear: both;
  color: #FFF;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  padding: 10px 0;
  margin: 0 0 15px;
  line-height: 100%;
  background-color: #1A60A6;
}
@media only screen and (max-width: 787px) {
  .bbq .qaSbttl01 {
    width: auto;
  }
}
.bbq .qaSbttl02 {
  width: 602px;
  clear: both;
  color: #FFF;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  padding: 10px 0;
  margin-bottom: 15px;
  line-height: 100%;
  background-color: #692F10;
}
@media only screen and (max-width: 787px) {
  .bbq .qaSbttl02 {
    width: auto;
  }
}
.bbq .qaSbttl03 {
  width: 602px;
  clear: both;
  color: #FFF;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  padding: 10px 0;
  margin-bottom: 15px;
  line-height: 100%;
  background-color: #DB5E12;
}
@media only screen and (max-width: 787px) {
  .bbq .qaSbttl03 {
    width: auto;
  }
}
.bbq .qaSbttl04 {
  width: 602px;
  clear: both;
  color: #FFF;
  font-weight: bold;
  font-size: 120%;
  text-align: center;
  margin-bottom: 15px;
  padding: 3px 0 3px 0;
  line-height: 100%;
  background-color: #608C35;
}
@media only screen and (max-width: 787px) {
  .bbq .qaSbttl04 {
    padding: 10px 0;
    width: auto;
  }
}
.bbq .qaSbttl04 img {
  margin: 0 30px;
}
.bbq #bbq .qaBot .qa ol {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}
.bbq #bbq .qaBot .qa ol li {
  text-indent: -1.6em;
  padding-left: 1.6em;
  color: #FF0000;
}
.bbq .btn_bus {
  padding-top: 10px;
  vertical-align: -12px;
}
.bbq .phb {
  width: 660px;
  text-align: left;
  margin: 0 auto 10px auto;
  padding: 0;
}
@media only screen and (max-width: 787px) {
  .bbq .phb {
    margin: 0 10px;
    width: auto;
  }
}
.bbq .phb li {
  background: url(../images/bbq/icon_pink.gif) 0 3px no-repeat;
  line-height: 1.5;
  padding: 0 0 0 15px;
}
.bbq .phb ul {
  margin: 0;
  padding: 0;
}
.bbq .phb01 {
  width: 661px;
  padding: 7px;
  margin: 0 0 10px 0;
  background: #664700;
  color: #FFF;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .bbq .phb01 {
    width: auto;
  }
}
.bbq .phb02 {
  font-weight: bold;
  color: #990000;
  margin: 0 0 5px 0;
}
.bbq .phb li {
  font-size: 80%;
}
.bbq .phb li span {
  font-weight: bold;
  font-size: 120%;
  color: FF0000;
}
.bbq .kaki {
  width: 660px;
  padding: 5px;
  border: 1px solid #664700;
  color: #664700;
  font-weight: bold;
}
.bbq .txtOre {
  color: #f08200;
}
.bbq .bus02 {
  padding-left: 25px;
}
.bbq #bbq .bbqImg {
  padding-top: 223px;
}
.bbq #bbq .bbq01 {
  width: 329px;
  height: 395px;
  padding-top: 10px;
  background: url(../images/bbq/box03.gif) left top no-repeat;
}
.bbq #bbq .bbq01 .tLay01 {
  margin-left: 32px;
}
.bbq #bbq .bbq01 td.cell01 {
  height: 162px;
}
.bbq html:\66irst-child div#bbq div.bbq01 td.cell01 {
  height: 136px;
}
.bbq #bbq .bbq02 {
  width: 350px;
  height: 260px;
  background: url(../images/bbq/box07.gif) left top no-repeat;
}
.bbq #bbq .bbq02 .tLay02 {
  margin-right: 70px;
}
.bbq .cf:before,
.bbq .cf:after {
  content: "";
  display: table;
}
.bbq .cf:after {
  clear: both;
}
.bbq .cf {
  zoom: 1;
}
.bbq .clearfix,
.bbq .oshinagaki {
  overflow: hidden;
  zoom: 1;
}
.bbq .clearfix:after,
.bbq .oshinagaki:after {
  content: ".";
  display: block;
  height: 0px;
  clear: both;
  visibility: hidden;
}
.bbq .oshinagaki {
  width: 668px;
  margin-top: 10px;
}
.bbq .oshinagakiList {
  float: left;
  width: 167px;
  font-size: 90%;
}
.bbq .oshinagakiList ul {
  margin: 0;
  padding-left: 20px;
}
.bbq .aka {
  color: #F00;
  font-weight: bold;
}
.bbq div .bus {
  width: 580px;
  margin-left: 34px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .bbq div .bus {
    width: auto;
    margin: 0;
    float: none;
  }
}
.bbq div .course01 {
  height: 700px;
}
.bbq div .course02 {
  height: 650px;
}
.bbq div .course03 {
  height: 650px;
}
.bbq div .course04 {
  height: 870px;
}
.bbq #akawaku {
  width: 610px;
  height: 60px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .bbq #akawaku {
    width: auto;
    height: auto;
    float: none;
  }
}
.bbq .timetable {
  clear: both;
}

/* 2015 bbq */
#bbq2015 h2 {
  margin: 0;
}
#bbq2015 p {
  margin: 0;
}
#bbq2015 p img {
  vertical-align: bottom;
}
#bbq2015 #btnGnavi {
  margin: 0 0 50px;
}
#bbq2015 #btnGnavi a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
#bbq2015 #bbqPoint {
  margin-bottom: 10px;
}
#bbq2015 .bus02 {
  padding: 10px 0 30px;
}
@media only screen and (max-width: 787px) {
  #bbq2015 .bus02 {
    padding: 10px 0 20px;
  }
}

#bbqCourse {
  padding-top: 10px;
}
#bbqCourse p {
  margin: 10px 0;
}
#bbqCourse ul {
  margin: 0;
  padding: 0;
}
#bbqCourse ul li {
  list-style: none;
  margin: 0;
}

/*----------------------------------------
	kakigoya
----------------------------------------*/
.kakigoya .headline {
  position: relative;
}
.kakigoya .headline h2 {
  background: url(../images/kakigoya/hl_kakigoya.gif) no-repeat 0 bottom;
}
@media only screen and (max-width: 787px) {
  .kakigoya .headline {
    padding: 0;
  }
}
.kakigoya .headline .container {
  padding: 0 10px;
}
.kakigoya .container {
  width: 940px;
}
@media only screen and (max-width: 787px) {
  .kakigoya .container {
    width: auto;
  }
}
.kakigoya .leftArea {
  width: 595px;
}
.kakigoya .leftArea img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .kakigoya .leftArea {
    margin: 0;
    width: auto;
  }
}

.phoKakigoya img {
  max-width: 100%;
  height: auto;
}
.phoKakigoya img {
  vertical-align: bottom;
}

.secKakigoyaOpen {
  margin-bottom: 45px;
  padding: 8px 0 20px;
  background: url(../images/common/bg_umi_beige.gif);
}
.secKakigoyaOpen h3 {
  margin: 0 0 15px;
  text-align: center;
}
.secKakigoyaOpen h3 img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .secKakigoyaOpen h3 {
    margin: 0 10px 10px;
  }
}
@media only screen and (max-width: 787px) {
  .secKakigoyaOpen {
    margin-bottom: 20px;
  }
}

.pOpen {
  margin: 0 auto;
  padding: 20px;
  width: 555px;
  background: #FFF;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -moz-box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.1);
}
.pOpen p {
  margin: 0;
  line-height: 148%;
}
@media only screen and (max-width: 787px) {
  .pOpen {
    margin: 0 10px;
    padding: 10px;
    width: auto;
  }
}

.secKakigoya {
  margin-bottom: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .secKakigoya {
    margin-bottom: 20px;
    padding-bottom: 20px;
  }
}
.secKakigoya h3 {
  margin: 0;
  padding: 0 20px;
  width: auto;
  line-height: 50px;
  background: url(../images/common/bg_umi_red.gif);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #FFF;
  font-size: 18px;
  font-size: 1.125rem;
}
@media only screen and (max-width: 787px) {
  .secKakigoya h3 {
    padding: 10px;
    line-height: 120%;
    font-size: 16px;
    font-size: 1rem;
  }
}
.secKakigoya h3 .where {
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .secKakigoya h3 .where {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.secKakigoya h3 .start {
  float: right;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .secKakigoya h3 .start {
    float: none;
    font-size: 12px;
    font-size: 0.75rem;
    display: block;
  }
}
.secKakigoya figure {
  margin: 0;
}
.secKakigoya figure img {
  vertical-align: bottom;
}
.secKakigoya:last-child {
  margin: 0;
  padding: 0;
  border-bottom: none;
}

.kakigoyaDetail {
  padding: 5px 20px 20px;
  background: url(../images/common/bg_umi.gif);
}
@media only screen and (max-width: 787px) {
  .kakigoyaDetail {
    padding: 5px 10px 10px;
  }
}

.addTel {
  margin: 10px 0;
  vertical-align: middle;
}
.addTel i {
  margin: 0 5px 0 0;
  font-size: 17px;
  font-size: 1.0625rem;
  color: #E50012;
  vertical-align: middle;
}
.addTel .icon-phone16 {
  margin: 0 7px 0 3px;
}

.map {
  margin-top: 20px;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  position: relative;
}

.map iframe,
.map object,
.map embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.access {
  padding: 5px 20px;
  background: #FFF;
}
.access p {
  margin: 10px 0;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 146%;
}
@media only screen and (max-width: 787px) {
  .access {
    padding: 5px 10px;
  }
  .access p {
    font-size: 12px;
    font-size: 0.75rem;
  }
}

/*----------------------------------------
	shop
----------------------------------------*/
.shop .headline {
  padding-bottom: 180px;
  position: relative;
}
.shop .headline h2 {
  height: 55px;
  background: url(../images/shop/hl_shop.gif) no-repeat 76px bottom;
}
.shop .headline h2 i {
  top: 6px;
  font-size: 60px;
  font-size: 3.75rem;
}
@media only screen and (max-width: 787px) {
  .shop .headline {
    padding: 0 !important;
    height: auto;
  }
  .shop .headline h2 {
    height: auto;
  }
  .shop .headline h2 i {
    top: 20px;
  }
}
.shop .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .shop .container {
    padding: 0 10px;
  }
}

.illustShop {
  width: 100%;
  height: 365px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}
.illustShop span {
  margin-left: -1200px;
  width: 1800px;
  position: absolute;
  bottom: 0;
  left: 50%;
}
.illustShop span img {
  position: absolute;
  bottom: 0;
  right: 0;
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .illustShop {
    width: auto;
    height: auto;
    position: static;
    overflow: auto;
    text-align: right;
  }
  .illustShop span {
    margin-left: auto;
    width: auto;
    position: static;
  }
  .illustShop span img {
    max-width: 100%;
    height: auto;
  }
  .illustShop span img {
    max-width: 80%;
    position: static;
  }
}

.btnAreaList {
  margin-bottom: 40px;
  padding: 30px 0;
  background: url(../images/common/bg_umi.gif);
}
.btnAreaList ul {
  margin: 0 auto;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.btnAreaList ul li {
  margin-left: 7px;
  width: 150px;
  list-style: none;
  float: left;
}
@media only screen and (max-width: 787px) {
  .btnAreaList ul li {
    margin: 0 0 10px;
    width: auto;
    float: none;
  }
  .btnAreaList ul li:last-child {
    margin-bottom: 0;
  }
}
.btnAreaList ul li:first-child {
  margin-left: 0;
}
.btnAreaList ul li:last-child a {
  background: #194375;
  border: 1px solid #194375;
}
.btnAreaList ul li:last-child a:hover {
  color: #194375;
}
.btnAreaList ul li a {
  width: 100%;
  line-height: 50px;
  background: #E50012;
  display: block;
  color: #FFF;
  font-size: 16px;
  font-size: 1rem;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
  border: 1px solid #E50012;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.btnAreaList ul li a:hover {
  background: #FFF;
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .btnAreaList ul li a {
    line-height: 40px;
  }
}

.secShopArea, .secShopShimaiArea {
  padding-bottom: 40px;
}
@media only screen and (max-width: 787px) {
  .secShopArea, .secShopShimaiArea {
    padding-bottom: 0;
  }
}
.secShopArea h3, .secShopShimaiArea h3 {
  margin-bottom: 30px;
  line-height: 50px;
  background: url(../images/common/bg_umi_red.gif);
  color: #FFF;
  font-size: 20px;
  font-size: 1.25rem;
  text-align: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
@media only screen and (max-width: 787px) {
  .secShopArea h3, .secShopShimaiArea h3 {
    padding: 10px;
    line-height: 120%;
    font-size: 16px;
    font-size: 1rem;
  }
}

.secShopShimaiArea {
  padding-bottom: 0;
}
.secShopShimaiArea h3 {
  background: url(../images/common/bg_umi_blue.gif);
}
.secShopShimaiArea .shopList li figure {
  margin: 0;
  width: 170px;
  float: left;
  border: 1px solid #CCC;
}
.secShopShimaiArea .shopList li figure img {
  width: 170px;
  height: auto;
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .secShopShimaiArea .shopList li figure {
    margin: 0 auto 20px;
    float: none;
  }
}
.secShopShimaiArea .shimaiDetail {
  width: 740px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .secShopShimaiArea .shimaiDetail {
    width: auto;
    float: none;
  }
}
.secShopShimaiArea .shopName {
  padding-bottom: 20px;
  width: 560px;
}
@media only screen and (max-width: 787px) {
  .secShopShimaiArea .shopName {
    width: auto;
  }
}
.secShopShimaiArea .shopLink {
  margin-bottom: 20px;
  width: 180px;
}
.secShopShimaiArea .shopLink li:first-child {
  margin: 0 10px;
}
@media only screen and (max-width: 787px) {
  .secShopShimaiArea .shopLink {
    width: auto;
  }
  .secShopShimaiArea .shopLink li {
    margin: 0 !important;
  }
}
.secShopShimaiArea .shopDetail li {
  margin-bottom: 10px;
  width: auto;
  float: none;
}
.secShopShimaiArea .shopDetail li {
  width: auto !important;
}

.shopList {
  margin: 0;
  padding: 0;
}
.shopList > li {
  margin-bottom: 40px;
  padding-bottom: 40px;
  list-style: none;
  border-bottom: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .shopList > li {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }
}
.shopList > li ul li {
  list-style: none;
}
.shopList > li .btnOpenTable {
  margin: 10px 0 0;
}

.shopName {
  padding-bottom: 30px;
  width: 360px;
  float: left;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .shopName {
    padding-bottom: 20px;
    width: auto;
    float: none;
  }
}
.shopName span {
  font-weight: normal;
}

.shopLink {
  margin: 0 0 30px;
  padding: 0;
  width: 590px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .shopLink {
    margin: 0 15px 20px;
    width: auto;
    float: none;
  }
}
.shopLink li {
  margin: 0 15px 0 10px;
  display: inline-block;
  list-style: none;
  font-size: 12px;
  font-size: 0.75rem;
  color: #CCC;
  vertical-align: top;
}
.shopLink li:first-child {
  margin-left: 133px;
}
@media only screen and (max-width: 787px) {
  .shopLink li:first-child {
    margin: 0 0 5px;
  }
}
@media only screen and (max-width: 787px) {
  .shopLink li {
    margin: 0 0 5px;
    display: block;
  }
}
.shopLink li i {
  margin-right: 5px;
  font-size: 18px;
  font-size: 1.125rem;
  color: #CCC;
  position: relative;
  top: 3px;
}
.shopLink li a {
  color: #EB604B;
  vertical-align: top;
  text-decoration: none;
}
.shopLink li a span {
  border-bottom: 1px solid #EB604B;
}
.shopLink li a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.shopLink li a i {
  color: #000;
}

.officialWeb li:first-child {
  margin: 0 10px;
}
@media only screen and (max-width: 787px) {
  .officialWeb li:first-child {
    margin: 0 0 5px;
  }
}

.twitter li:first-child {
  margin: 0 25px;
}
@media only screen and (max-width: 787px) {
  .twitter li:first-child {
    margin: 0 0 5px;
  }
}

.twitterEn li:first-child {
  margin: 0 35px;
}
@media only screen and (max-width: 787px) {
  .twitterEn li:first-child {
    margin: 0 0 5px;
  }
}

.shopDetail {
  margin: 0;
  padding: 0;
  clear: both;
}
@media only screen and (max-width: 787px) {
  .shopDetail {
    margin: 0 15px;
  }
}
.shopDetail li {
  margin-bottom: 5px;
  width: 380px;
  list-style: none;
  float: left;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .shopDetail li {
    width: 100% !important;
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.shopDetail li:nth-child(2) {
  width: 550px;
}
.shopDetail li:last-child {
  width: auto;
  clear: both;
}
.shopDetail li i {
  margin-right: 5px;
  font-size: 18px;
  font-size: 1.125rem;
  position: relative;
  top: 3px;
}

.shopDetailClosed {
  margin: 0;
  padding: 0;
  clear: both;
}
@media only screen and (max-width: 787px) {
  .shopDetailClosed {
    margin: 0 15px;
  }
}
.shopDetailClosed li {
  margin-bottom: 20px;
  padding: 15px;
  width: 96%;
  list-style: none;
  float: left;
  color: #e50113;
  border: thin solid #e50113;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .shopDetailClosed li {
    padding: 10px;
    font-size: 12px;
    font-size: 0.75rem;
    display: block;
  }
}

.shopPhotoGallery {
  display: none;
}

/*----------------------------------------
	blog
----------------------------------------*/
.blog .headline {
  position: relative;
}
.blog .headline h2 {
  background: url(../images/blog/hl_blog.gif) no-repeat 72px bottom;
}
@media only screen and (max-width: 787px) {
  .blog .headline {
    padding: 0;
  }
}

@media only screen and (max-width: 787px) {
  .contents.blog {
    padding: 0;
  }
}

.entryList {
  margin-bottom: 20px;
  padding-bottom: 40px;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .entryList {
    width: 100%;
    padding-bottom: 30px;
  }
  .entryList .mark_30thAnniversary {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 60px;
    display: block;
    z-index: 9;
  }
  .entryList .mark_30thAnniversary img {
    width: 60px;
    height: 60px;
  }
}
.entryList .eyeCatch {
  margin: 0;
  border: 1px solid #EDEDED;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
}
.entryList .eyeCatch img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch {
    width: 100%;
    height: 180px;
    border: none;
  }
}
.entryList .eyeCatch img {
  width: 100%;
  vertical-align: bottom;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.entryList .eyeCatch a {
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch a {
    -webkit-tap-highlight-color: transparent;
    tap-highlight-color: transparent;
  }
}
.entryList .eyeCatch a:hover img {
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch a:hover img {
    -moz-transform: none;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
  }
}
.entryList .eyeCatch span.new {
  width: 50px;
  height: 50px;
  display: block;
  background: #febd2d;
  position: absolute;
  top: 0;
  left: 0;
  line-height: 50px;
  text-align: center;
  color: #FFF;
  font-weight: bold;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch span.new {
    width: 40px;
    height: 40px;
    font-weight: normal;
    font-size: 10px;
    font-size: 0.625rem;
    line-height: 40px;
  }
}
.entryList .eyeCatch figcaption {
  padding: 0 10px;
  line-height: 30px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  white-space: nowrap;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  background: rgba(51, 51, 51, 0.8);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  color: #FFF;
  font-size: 13px;
  font-size: 0.8125rem;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch figcaption {
    padding: 5px;
    white-space: normal;
    line-height: 14px;
    font-size: 10px;
    font-size: 0.625rem;
    letter-spacing: -0.06em;
    color: #FFF;
  }
}
.entryList .eyeCatch figcaption span {
  margin-right: 10px;
  display: inline-block;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch figcaption span {
    line-height: 140%;
  }
}
.entryList .eyeCatch figcaption i {
  margin-right: 5px;
  display: inline-block;
  color: #FFF;
  font-size: 11px;
  font-size: 0.6875rem;
}
@media only screen and (max-width: 787px) {
  .entryList .eyeCatch figcaption i {
    font-size: 9px;
    font-size: 0.5625rem;
    color: #FFF;
  }
}
.entryList .entryListDetail {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail {
    margin-right: 0;
  }
}
.entryList .entryListDetail h3 {
  margin: 10px 0 0;
  line-height: 1.5;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail h3 {
    margin: 10px 0 0;
    font-size: 13px;
    font-size: 0.8125rem;
  }
}
.entryList .entryListDetail h3 a {
  text-decoration: none;
  font-size: 18px;
  font-size: 1.125rem;
  color: #333;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail h3 a {
    font-size: 13px;
    font-size: 0.8125rem;
    line-height: 120%;
  }
}
.entryList .entryListDetail .entryMeta {
  width: 100%;
  position: absolute;
  bottom: 0;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryMeta {
    padding-top: 0;
  }
}
.entryList .entryListDetail .entryMeta time {
  width: 35%;
  display: inline-block;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #999;
  float: left;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryMeta time {
    width: 40%;
    font-size: 10px;
    font-size: 0.625rem;
  }
}
.entryList .entryListDetail .entryMeta .sns_counter_wrap {
  color: #999;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryMeta .sns_counter_wrap {
    display: none;
  }
}
.entryList .entryListDetail .entryMeta .entyrAuthorName {
  margin: 0;
  display: inline-block;
  float: right;
  position: relative;
  top: -2px;
  text-align: right;
  width: 62%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryMeta .entyrAuthorName {
    width: 60%;
    overflow: hidden;
  }
}
.entryList .entryListDetail .entryMeta .entyrAuthorName a {
  color: #999;
  text-decoration: none;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryMeta .entyrAuthorName a {
    font-size: 10px;
    font-size: 0.625rem;
  }
}
.entryList .entryListDetail .entryMeta .entyrAuthorName a:hover {
  color: #E50012;
}
.entryList .entryListDetail .entryMeta .entyrAuthorName a:hover i {
  color: #E50012;
}
.entryList .entryListDetail .entryMeta .entyrAuthorName i {
  margin-right: 8px;
  display: inline-block;
  color: #999;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
@media only screen and (max-width: 787px) {
  .entryList .entryListDetail .entryExcerpt {
    display: none;
  }
}
.entryList .entryListDetail .entryExcerpt p {
  line-height: 140%;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #999;
}
.entryList.col1Box {
  width: 660px;
}
.entryList.col1Box .eyeCatch {
  height: 400px;
}
.entryList.col1Box .mark_30thAnniversary {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  z-index: 9;
}
.entryList.col2Box {
  width: 320px;
  float: left;
}
.entryList.col2Box .mark_30thAnniversary {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  z-index: 9;
}
.entryList.col2Box .mark_30thAnniversary img {
  width: 60px;
  height: 60px;
}
@media only screen and (max-width: 787px) {
  .entryList.col2Box .mark_30thAnniversary {
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 50px;
    height: 50px;
    z-index: 9;
  }
  .entryList.col2Box .mark_30thAnniversary img {
    width: 50px;
    height: 50px;
  }
}
.entryList.col2Box .eyeCatch {
  height: 194px;
}
@media only screen and (max-width: 787px) {
  .entryList.col2Box .eyeCatch {
    height: 110px;
    overflow: hidden;
  }
}
.entryList.col2Box .eyeCatch span.new {
  width: 30px;
  height: 30px;
  font-weight: normal;
  font-size: 10px;
  font-size: 0.625rem;
  line-height: 30px;
}
.entryList.col2Box .entryListDetail h3 a {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .entryList.col2Box {
    width: 48%;
  }
}
@media only screen and (max-width: 787px) {
  .entryList.col2Box.right {
    float: right;
  }
}
.entryList.col3Box {
  padding-bottom: 30px;
  width: 206px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .entryList.col3Box {
    width: 48%;
  }
}
.entryList.col3Box .mark_30thAnniversary {
  position: absolute;
  top: 0;
  right: 0;
  display: block;
  z-index: 9;
}
.entryList.col3Box .mark_30thAnniversary img {
  width: 50px;
  height: 50px;
}
.entryList.col3Box .eyeCatch {
  height: 125px;
}
.entryList.col3Box .eyeCatch span.new {
  width: 30px;
  height: 30px;
  font-weight: normal;
  font-size: 10px;
  font-size: 0.625rem;
  line-height: 30px;
}
.entryList.col3Box .entryListDetail h3 {
  margin-top: 5px;
  line-height: 1.2;
}
.entryList.col3Box .entryListDetail h3 a {
  font-size: 13px;
  font-size: 0.8125rem;
}
.entryList.col3Box .entryListDetail time {
  font-size: 12px;
  font-size: 0.75rem;
}
.entryList.col3Box .entryListDetail .entyrAuthorName {
  width: 30%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
}
@media only screen and (max-width: 787px) {
  .entryList.col3Box .entryListDetail .entyrAuthorName {
    display: none;
  }
}
.entryList.col3Box .entryListDetail .entyrAuthorName .name_text {
  display: none;
}
.entryList.right {
  float: right;
}
.entryList.center {
  margin-left: 20px;
}
@media only screen and (min-width: 788px) {
  .entryList.col2Box .eyeCatch figcaption {
    white-space: normal;
    font-size: 12px;
    font-size: 0.75rem;
    line-height: 24px;
  }
}
@media only screen and (min-width: 788px) {
  .entryList.col3Box .eyeCatch figcaption {
    white-space: normal;
    font-size: 10px;
    font-size: 0.625rem;
    line-height: 20px;
  }
}

.entryListRight {
  width: 406px;
  float: right;
  line-height: 100%;
}
@media only screen and (max-width: 787px) {
  .entryListRight {
    width: auto;
    line-height: 130%;
    float: none;
  }
}
.entryListRight time {
  margin-right: 20px;
  font-size: 12px;
  font-size: 0.75rem;
  color: #EB604B;
  display: inline-block;
}
.entryListRight h3 {
  margin: 15px 0;
  font-size: 16px;
  font-size: 1rem;
  line-height: 120%;
}
.entryListRight h3 a {
  text-decoration: none;
  color: #000;
}
.entryListRight h3 a:hover {
  color: #EB604B;
}
@media only screen and (max-width: 787px) {
  .entryListRight h3 {
    margin: 10px 0;
    width: 70%;
    float: right;
  }
}

.entryBody {
  font-size: 16px;
  font-size: 1rem;
  line-height: 143%;
  clear: both;
}
.entryBody img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .entryBody {
    font-size: 15px;
    font-size: 0.9375rem;
  }
  .entryBody div {
    width: auto !important;
  }
}
.entryBody p {
  font-size: 16px;
  font-size: 1rem;
  line-height: 25px;
}
@media only screen and (max-width: 787px) {
  .entryBody p {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
.entryBody figure {
  margin: 0 0 15px;
}

.btnMore {
  margin: 5px 0 0;
  text-align: right;
}
.btnMore a {
  color: #EB604B;
}
.btnMore a:hover {
  color: #000;
}

.hlCategory {
  margin: 0 0 30px;
  padding: 0 30px;
  line-height: 70px;
  background: #EDEDED;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .hlCategory {
    padding: 0 15px;
    line-height: 40px;
    font-size: 16px;
    font-size: 1rem;
  }
}
.hlCategory i {
  margin-right: 20px;
  display: inline-block;
}
@media only screen and (max-width: 787px) {
  .hlCategory i {
    margin-right: 5px;
  }
}

/* detail */
.entry {
  margin-bottom: 20px;
  padding-bottom: 30px;
  border-bottom: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .entry {
    margin-bottom: 10px;
    padding-bottom: 10px;
  }
}

.entryTitle {
  position: relative;
}
.entryTitle h3 {
  padding-top: 50px;
  margin: 0 0 20px;
  font-size: 22px;
  font-size: 1.375rem;
  line-height: 120%;
}
@media only screen and (max-width: 787px) {
  .entryTitle h3 {
    padding-top: 5px;
    font-size: 16px;
    font-size: 1rem;
  }
}
.entryTitle .sp_name_text {
  display: none;
  text-align: right;
}
@media only screen and (max-width: 787px) {
  .entryTitle .sp_name_text {
    display: block;
    text-align: right;
  }
}
.entryTitle .sp_name_text a {
  color: #999;
  text-decoration: none;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 787px) {
  .entryTitle .sp_name_text a {
    font-size: 11px;
    font-size: 0.6875rem;
  }
}
.entryTitle .sp_name_text a:hover {
  color: #E50012;
}
.entryTitle .sp_name_text a:hover i {
  color: #E50012;
}
.entryTitle .entryMeta {
  width: 100%;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta {
    padding-top: 0;
  }
}
.entryTitle .entryMeta time {
  margin-right: 30px;
  display: inline-block;
  float: left;
  font-size: 16px;
  font-size: 1rem;
  color: #999;
  letter-spacing: 1px;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta time {
    margin: 0;
    width: auto;
    float: none;
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.entryTitle .entryMeta .sns_counter_wrap {
  color: #999;
  font-size: 12px;
  font-size: 0.75rem;
}
.entryTitle .entryMeta .entyrAuthorName {
  margin: 0;
  display: inline-block;
  float: right;
  position: relative;
  top: -2px;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entyrAuthorName .name_text {
    width: calc(100% - 100px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    position: absolute;
    top: 0;
    right: 0;
    text-align: right;
  }
}
.entryTitle .entryMeta .entyrAuthorName a {
  color: #999;
  text-decoration: none;
  font-size: 12px;
  font-size: 0.75rem;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entyrAuthorName a {
    font-size: 11px;
    font-size: 0.6875rem;
  }
}
.entryTitle .entryMeta .entyrAuthorName a:hover {
  color: #E50012;
}
.entryTitle .entryMeta .entyrAuthorName a:hover i {
  color: #E50012;
}
.entryTitle .entryMeta .entyrAuthorName i {
  margin-right: 8px;
  display: inline-block;
  color: #999;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.entryTitle .entryMeta .entryCategory {
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entryCategory {
    /*margin-top:8px;*/
    position: static;
  }
}
.entryTitle .entryMeta .entryCategory .tags_red a {
  margin-left: 6px;
  padding: 2px 10px;
  display: inline-block;
  font-size: 13px;
  font-size: 0.8125rem;
  text-decoration: none;
  background: #E50012;
  border: none;
  color: #fff;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entryCategory .tags_red a {
    margin-top: 8px;
  }
}
.entryTitle .entryMeta .entryCategory .tags_red a i {
  color: #FFF;
}
.entryTitle .entryMeta .entryCategory .tags_red a:hover {
  background: #EDEDED;
  color: #000;
}
.entryTitle .entryMeta .entryCategory .tags_red a:hover i {
  color: #000;
}
.entryTitle .entryMeta .entryCategory a {
  margin-left: 6px;
  padding: 2px 10px;
  display: inline-block;
  background: #EDEDED;
  color: #000;
  font-size: 13px;
  font-size: 0.8125rem;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entryCategory a {
    margin: 8px 10px 0 0;
    font-size: 11px;
    font-size: 0.6875rem;
  }
}
.entryTitle .entryMeta .entryCategory a:first-child {
  margin-left: 0;
}
.entryTitle .entryMeta .entryCategory a.new {
  margin-right: 6px;
  display: inline-block;
  background-color: #FEBD2D;
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .entryTitle .entryMeta .entryCategory a.new {
    margin-top: 8px;
  }
}
.entryTitle .entryMeta .entryCategory a:hover {
  background: #E50012;
  color: #FFF;
}
.entryTitle .entryMeta .entryCategory a:hover i {
  color: #FFF;
}
.entryTitle .entryMeta .entryCategory a i {
  margin-right: 8px;
  display: inline-block;
  color: #111;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

#snsBtm {
  margin: 35px 0 40px;
  padding: 25px 0 30px 140px;
  background-color: #FAFAFA;
  border-radius: 10px;
}
@media only screen and (max-width: 787px) {
  #snsBtm {
    padding: 25px 0 30px 0;
  }
}
#snsBtm .shareTxt {
  width: 350px;
  margin: 0;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  #snsBtm .shareTxt {
    width: 100%;
  }
}
#snsBtm .sns {
  padding: 0 10px 0 0;
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns {
    padding: 0;
    margin: 10px auto;
    text-align: center;
  }
}
#snsBtm .sns li {
  width: auto;
  float: left;
  list-style: none;
  margin: 0 0 0;
  width: 75px;
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns li {
    width: 50px;
    display: inline-block;
    float: none;
  }
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns {
    margin: 10px 0 0;
  }
}
#snsBtm .sns .balloon {
  width: 60px;
  height: 36px;
  color: #333;
  font-size: 12px;
  line-height: 34px;
  text-align: center;
  margin-bottom: 10px;
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns .balloon {
    width: 48px;
  }
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns .balloon .counter {
    font-size: 11px;
  }
}
#snsBtm .sns .btn {
  display: inline-block;
  width: 60px;
  height: 28px;
  color: #FFF;
  font-size: 18px;
  line-height: 28px;
  text-align: center;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  #snsBtm .sns .btn {
    width: 44px;
  }
}
#snsBtm .sns .fb .btn {
  background: #3B5998;
}
#snsBtm .sns .fb .btn:hover {
  background: #263961;
}
#snsBtm .sns .tw .btn {
  background: #1B95E0;
}
#snsBtm .sns .tw .btn:hover {
  background: #13689c;
}
#snsBtm .sns .gp .btn {
  background: #DB4437;
}
#snsBtm .sns .gp .btn:hover {
  background: #a7291e;
}
#snsBtm .sns .ht .btn {
  background: #00A3DD;
}
#snsBtm .sns .ht .btn:hover {
  background: #006b91;
}
#snsBtm .sns .pocket .btn {
  background: #FA3244;
}
#snsBtm .sns .pocket .btn:hover {
  background: #da0518;
}

@media only screen and (max-width: 787px) {
  #snsSingleTop {
    margin-bottom: 10px;
    padding-bottom: 20px;
    border-bottom: 1px solid #EDEDED;
  }
}
#snsSingleTop .sns {
  padding: 0;
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns {
    padding: 0;
    margin: 10px auto;
    text-align: center;
  }
}
#snsSingleTop .sns li {
  width: auto;
  float: left;
  list-style: none;
  margin: 0;
  display: table;
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns li {
    width: 18%;
  }
}
#snsSingleTop .sns li + li {
  margin-left: 15px;
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns li + li {
    margin-left: 2.5%;
  }
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns {
    margin: 10px 0 0;
  }
}
#snsSingleTop .sns .balloon {
  width: 60px;
  height: 36px;
  color: #333;
  font-size: 12px;
  line-height: 34px;
  text-align: center;
  margin-bottom: 10px;
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns .balloon {
    width: 48px;
  }
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns .balloon .counter {
    font-size: 11px;
  }
}
#snsSingleTop .sns .btn {
  display: table-cell;
  width: 120px;
  height: 48px;
  color: #FFF;
  font-size: 18px;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
}
@media only screen and (max-width: 787px) {
  #snsSingleTop .sns .btn {
    width: 100%;
    height: 30px;
  }
}
#snsSingleTop .sns .fb .btn {
  background: #3B5998;
}
#snsSingleTop .sns .fb .btn:hover {
  background: #263961;
}
#snsSingleTop .sns .tw .btn {
  background: #1B95E0;
}
#snsSingleTop .sns .tw .btn:hover {
  background: #13689c;
}
#snsSingleTop .sns .gp .btn {
  background: #DB4437;
}
#snsSingleTop .sns .gp .btn:hover {
  background: #a7291e;
}
#snsSingleTop .sns .ht .btn {
  background: #00A3DD;
}
#snsSingleTop .sns .ht .btn:hover {
  background: #006b91;
}
#snsSingleTop .sns .pocket .btn {
  background: #FA3244;
}
#snsSingleTop .sns .pocket .btn:hover {
  background: #da0518;
}

.balloon--inner {
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  position: relative;
  width: 100%;
  border: 1px solid #F2F2F2;
  background-color: #fff;
  text-align: center;
}

.balloon--bottom:before {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 50%;
  margin-left: -5px;
  width: 0;
  height: 0;
  border-top: 5px solid #F2F2F2;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}

.balloon--bottom:after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 50%;
  margin-left: -5px;
  width: 0;
  height: 0;
  border-top: 5px solid #fff;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
}

.twitter-share-button {
  width: 100px !important;
}

.entryBody {
  padding: 40px 0 60px;
}
@media only screen and (max-width: 787px) {
  .entryBody {
    padding: 20px 0;
  }
}
.entryBody hr {
  border: none;
  border-top: 1px solid #CCC;
}

.secAuthor {
  margin: 0 0 40px;
  padding: 15px 30px;
  border: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .secAuthor {
    margin: 20px 0;
    padding: 10px 15px;
  }
}
.secAuthor h4 {
  margin: 0 0 10px;
  padding-bottom: 10px;
  font-size: 15px;
  font-size: 0.9375rem;
  border-bottom: 1px solid #EEE;
  font-weight: normal;
}
.secAuthor h4 i {
  margin-right: 10px;
  display: inline-block;
  color: #E50012;
}
.secAuthor .authorPhoto {
  width: 22.8%;
  float: left;
}
@media only screen and (max-width: 787px) {
  .secAuthor .authorPhoto {
    width: 65px;
  }
}
.secAuthor .authorPhoto a {
  width: 100px;
  height: 100px;
  display: block;
  background: url(../images/blog/avatar_dummy.gif) no-repeat;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
}
.secAuthor .authorPhoto a img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .secAuthor .authorPhoto a {
    width: 50px;
    height: 50px;
  }
}
.secAuthor .authorPhoto a:hover {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}
.secAuthor .authorDetail {
  width: 77.2%;
  float: right;
}
@media only screen and (max-width: 787px) {
  .secAuthor .authorDetail {
    width: calc(100% - 65px);
  }
}
.secAuthor .authorFavo {
  margin: 0;
  font-size: 13px;
  font-size: 0.8125rem;
  color: #666;
}
.secAuthor .authorFavo span {
  color: #E50012;
}
.secAuthor .authorName {
  margin: 5px 0 15px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .secAuthor .authorName {
    font-size: 16px;
    font-size: 1rem;
  }
}
.secAuthor .authorProfile {
  font-size: 13px;
  font-size: 0.8125rem;
  color: #666;
  line-height: 140%;
}
.secAuthor .authorProfile p {
  margin: 5px 0;
  line-height: 140%;
}
.secAuthor .writerLink a {
  padding: 5px 25px;
  border: 1px solid #EB604B;
  text-decoration: none;
  font-size: 13px;
  font-size: 0.8125rem;
}
@media only screen and (max-width: 787px) {
  .secAuthor .writerLink a {
    padding: 5px 10px;
    font-size: 10px;
    font-size: 0.625rem;
  }
}
.secAuthor .writerLink a i {
  margin-left: 5px;
}
.secAuthor .writerLink a:hover {
  background-color: #EB604B;
  color: #FFF;
}
.secAuthor .writerLink a:hover i {
  color: #FFF;
}

/* pagenavi */
.wp-pagenavi {
  width: 100%;
  padding-top: 125px;
  clear: both;
  position: relative;
  text-align: center;
  clear: both;
}
@media only screen and (max-width: 787px) {
  .wp-pagenavi {
    padding-top: 80px;
  }
}
.wp-pagenavi a, .wp-pagenavi span {
  margin: 0 5px;
  width: 32px;
  line-height: 32px;
  display: inline-block;
  background: #ececec;
  text-decoration: none;
  text-align: center;
  color: #333;
  font-size: 12px;
  font-size: 0.75rem;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.wp-pagenavi .nextpostslink {
  width: 280px;
  height: 55px;
  display: block;
  position: absolute;
  left: 190px;
  top: 0px;
  background: #e93340;
  border: 1px solid #e93340;
  line-height: 55px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .wp-pagenavi .nextpostslink {
    width: 100%;
    left: 0;
  }
}
.wp-pagenavi .nextpostslink:hover {
  background-color: #FFF;
  color: #e93340;
}
.wp-pagenavi .nextpostslink:hover i {
  color: #e93340;
}
.wp-pagenavi .nextpostslink i {
  margin-left: 5px;
  color: #FFF;
}
.wp-pagenavi a:hover, .wp-pagenavi .current {
  background: #333;
  color: #FFF;
}
.wp-pagenavi .pages {
  padding: 0 6px;
  width: auto;
}
.wp-pagenavi .extend {
  width: auto;
  border: none;
}
@media only screen and (max-width: 787px) {
  .wp-pagenavi {
    text-align: center;
  }
  .wp-pagenavi .pages {
    margin-bottom: 5px;
    display: block;
  }
  .wp-pagenavi a, .wp-pagenavi span {
    margin: 3px;
  }
  .wp-pagenavi .last {
    margin: 5px auto 0;
    display: block;
  }
  .wp-pagenavi .first {
    margin-bottom: 0 auto 5px;
    display: block;
  }
}

/* pagenate */
.paginate {
  margin: 0;
  padding: 20px 10px 60px;
  position: relative;
}
.paginate li {
  list-style: none;
}
.paginate a {
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.paginate a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
@media only screen and (max-width: 787px) {
  .paginate {
    padding-bottom: 30px;
  }
  .paginate a img {
    width: 80px;
    height: auto;
  }
}

.btnPrev a, .btnNext a {
  padding: 6px 10px;
  display: inline-block;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  text-decoration: none;
  background: #EB604B;
  line-height: 100%;
  color: #FFF;
  text-align: center;
  font-size: 13px;
  font-size: 0.8125rem;
}

.btnPrev {
  float: left;
}
.btnPrev i {
  margin-right: 2px;
}

.btnNext {
  float: right;
}
.btnNext i {
  margin-left: 2px;
}

.btnList {
  margin-left: -50px;
  text-align: center;
  font-size: 13px;
  font-size: 0.8125rem;
  font-weight: bold;
  line-height: 100%;
  position: absolute;
  top: 20px;
  left: 50%;
}
.btnList a {
  padding: 5px;
  width: 100px;
  display: inline-block;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-decoration: none;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #EB604B;
}
.btnList a:hover {
  background: #EB604B;
  color: #FFF;
  opacity: 1;
  filter: alpha(opacity=100);
}

.eventEnd p {
  width: auto;
  line-height: 80px;
  background: #E50012;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  color: #FFF;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .eventEnd p {
    font-size: 16px;
    font-size: 1rem;
    line-height: 60px;
  }
}

/*----------------------------------------
	blog 
----------------------------------------*/
.title01 {
  margin: 50px 0 30px;
  padding: 30px 15px;
  font-size: 20px;
  font-size: 1.25rem;
  border-top: 1px solid #666;
  border-bottom: 1px solid #666;
}
@media only screen and (max-width: 787px) {
  .title01 {
    padding: 20px 15px;
  }
}
.title01 i {
  padding-right: 20px;
  vertical-align: middle;
  font-size: 28px;
  font-size: 1.75rem;
}

.title02 {
  margin: 90px 0 30px;
  padding: 20px;
  font-size: 20px;
  font-size: 1.25rem;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background-color: #EB5F4B;
  color: #FFF;
  line-height: 1.2;
}
@media only screen and (max-width: 787px) {
  .title02 {
    margin: 40px 0 24px;
    padding: 15px;
  }
}
.title02 i {
  padding-right: 15px;
  vertical-align: middle;
  font-size: 28px;
  font-size: 1.75rem;
}

.characterBox {
  border: 1px solid #CCC;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border-collapse: separate;
  box-sizing: border-box;
}
.characterBox th {
  width: 140px;
  vertical-align: top;
  padding: 26px;
}
@media only screen and (max-width: 787px) {
  .characterBox th {
    padding: 16px;
    width: 70px;
  }
}
.characterBox th img {
  width: 100%;
}
.characterBox td {
  margin: 0;
  padding: 26px 26px 26px 0;
  transition: all 0.5s ease;
  font-size: 15px;
  font-size: 0.9375rem;
}
@media only screen and (max-width: 787px) {
  .characterBox td {
    padding: 16px 16px 16px 0;
  }
}
.characterBox td strong {
  display: block;
  margin-bottom: 15px;
}
.characterBox td strong + br {
  display: none;
}
.characterBox td span {
  font-size: 13px;
  font-size: 0.8125rem;
  word-break: break-all;
}
.characterBox + .characterBox {
  margin-top: 20px;
}

.talkList {
  margin: 40px 0;
}
@media only screen and (max-width: 787px) {
  .talkList {
    margin: 30px 0;
  }
}
.talkList th {
  width: 90px;
  vertical-align: top;
  transition: all 0.5s ease;
}
@media only screen and (max-width: 787px) {
  .talkList th {
    width: 45px;
  }
}
.talkList th img {
  width: 100%;
}
.talkList td {
  padding-left: 20px;
  font-size: 15px;
  font-size: 0.9375rem;
  vertical-align: middle;
}
@media only screen and (max-width: 787px) {
  .talkList td {
    padding-left: 10px;
  }
}

.entryCategory.bottom {
  font-size: 12px;
  font-size: 0.75rem;
}

.entryCategory.bottom .tags_red a {
  background: #E50012;
  border: none;
  color: #fff;
}
@media only screen and (max-width: 787px) {
  .entryCategory.bottom .tags_red a {
    margin-bottom: 8px;
  }
}
.entryCategory.bottom .tags_red a i {
  color: #FFF;
}
.entryCategory.bottom .tags_red a:hover {
  background: #EDEDED;
  border: none;
  color: #000;
}
.entryCategory.bottom .tags_red a:hover i {
  color: #000;
}
.entryCategory.bottom a {
  margin-left: 5px;
  padding: 3px 10px;
  display: inline-block;
  border: 1px solid #DDD;
  color: #333;
  text-decoration: none;
  font-size: 12px;
  font-size: 0.75rem;
}
.entryCategory.bottom a:hover {
  border: 1px solid #888;
}

.newBoxArea:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

.wp_rp_content:after {
  content: "";
  clear: both;
  height: 0;
  display: block;
  visibility: hidden;
}

.categoryLinkBtn {
  margin: 0 auto;
  width: 400px;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .categoryLinkBtn {
    width: 100%;
  }
}
.categoryLinkBtn a {
  height: 58px;
  display: block;
  background-color: #E93340;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  border: 1px solid #E93340;
  line-height: 58px;
  color: #FFF;
  text-decoration: none;
}
.categoryLinkBtn a:hover {
  background-color: #FFF;
  color: #E93340;
}
.categoryLinkBtn a:hover i {
  color: #E93340;
}
.categoryLinkBtn a i {
  margin: 0 5px;
  color: #FFF;
}

.entryBody iframe {
  width: 100%;
}

/*----------------------------------------
	recruit
----------------------------------------*/
.recruit {
  padding-bottom: 0 !important;
}
.recruit .headline {
  padding-bottom: 120px;
  position: relative;
}
.recruit .headline h2 {
  height: 63px;
  background: url(../images/recruit/hl_recruit.gif) no-repeat 82px bottom;
}
.recruit .headline h2 i {
  top: -3px;
  font-size: 64px;
  font-size: 4rem;
}
@media only screen and (max-width: 787px) {
  .recruit .headline {
    padding-bottom: 20px;
    height: auto;
  }
  .recruit .headline h2 {
    height: auto;
  }
  .recruit .headline h2 span {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}

.btnRecruit {
  position: absolute;
  top: 0;
  right: 42px;
}
.btnRecruit a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
@media only screen and (max-width: 787px) {
  .btnRecruit {
    position: static;
    text-align: center;
  }
  .btnRecruit img {
    max-width: 100%;
    height: auto;
  }
}

.secMovieList {
  margin-bottom: 20px;
}
.secMovieList h3 {
  margin: 0 0 40px;
  padding: 35px 0 0 28px;
  width: auto;
  height: 100px;
  background: url(../images/recruit/bg_movie.jpg) no-repeat;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.secMovieList h3 img {
  vertical-align: bottom;
}
@media only screen and (max-width: 787px) {
  .secMovieList h3 {
    margin-bottom: 20px;
    padding: 20px 10px;
    width: auto;
    height: auto;
  }
  .secMovieList h3 img {
    max-width: 100%;
    height: auto;
  }
}
.secMovieList .container {
  width: 940px;
}
@media only screen and (max-width: 787px) {
  .secMovieList .container {
    width: auto;
  }
}

.staffList {
  margin: 0;
  padding: 0;
}
.staffList li {
  margin: 0 0 30px 12px;
  width: 225px;
  float: left;
  list-style: none;
}
.staffList li:nth-child(4n+1) {
  margin-left: 0;
}
.staffList li a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
@media only screen and (max-width: 787px) {
  .staffList li {
    width: 50%;
    padding: 0 12px;
    margin: 0 0 12px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .staffList li img {
    max-width: 100%;
    height: auto;
  }
}

.secRecruit {
  padding: 50px 0 160px;
  background: url(../images/common/bg_umi.gif);
}
@media only screen and (max-width: 787px) {
  .secRecruit {
    margin-bottom: 0;
    padding: 20px 0;
  }
  .secRecruit .container {
    padding: 0 !important;
  }
}

.btnRecruitChange li {
  width: 50%;
}

.recruitArea {
  padding: 40px;
  background: #FFF;
}
@media only screen and (max-width: 787px) {
  .recruitArea {
    padding: 20px 10px;
  }
}
.recruitArea h4 {
  margin: 0 0 15px;
  padding-bottom: 10px;
  font-size: 20px;
  font-size: 1.25rem;
  border-bottom: 2px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .recruitArea h4 {
    margin-bottom: 10px;
    padding-bottom: 5px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.recruitArea h4 i {
  margin-right: 10px;
  font-size: 28px;
  font-size: 1.75rem;
  vertical-align: top;
}
@media only screen and (max-width: 787px) {
  .recruitArea h4 i {
    font-size: 26px;
    font-size: 1.625rem;
    vertical-align: middle;
  }
}
.recruitArea h4 i:before {
  vertical-align: top;
}
.recruitArea .btnHarbor {
  margin-top: 25px;
}
.recruitArea .btnContact {
  margin-top: 20px;
  width: 100%;
  display: table;
  table-layout: fixed;
  list-style: none;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .recruitArea .btnContact {
    margin: 10px 0;
    float: none;
    width: 100%;
  }
}
.recruitArea .btnContact a {
  width: 100%;
  line-height: 80px;
  display: table-cell;
  text-align: center;
  color: #E50012;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  border: 1px solid #E50012;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .recruitArea .btnContact a {
    line-height: 60px;
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.recruitArea .btnContact a i {
  margin-right: 10px;
  font-size: 44px;
  font-size: 2.75rem;
  font-weight: normal;
  color: #E50012;
  vertical-align: middle;
}
@media only screen and (max-width: 787px) {
  .recruitArea .btnContact a i {
    font-size: 32px;
    font-size: 2rem;
  }
}
.recruitArea .btnContact a i.icon-wearmagic {
  font-size: 26px;
  font-size: 1.625rem;
}
@media only screen and (max-width: 787px) {
  .recruitArea .btnContact a i.icon-wearmagic {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.recruitArea .btnContact a span {
  display: inline-block;
}
.recruitArea .btnContact a:hover {
  background: #E50012;
  color: #FFF;
}
.recruitArea .btnContact a:hover i {
  color: #FFF;
}

.phoRecruit {
  margin-bottom: 15px;
}
.phoRecruit img {
  max-width: 100%;
  height: auto;
}
.phoRecruit img {
  vertical-align: bottom;
}

.career p b {
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .career p b {
    font-size: 14px;
    font-size: 0.875rem;
  }
}

/* staff detail */
.staff {
  padding-bottom: 120px;
  position: relative;
}
.staff h2 {
  height: 63px;
  background: url(../images/recruit/hl_recruit_staff.gif) no-repeat 82px bottom;
}
.staff h2 i {
  top: -3px;
  font-size: 64px;
  font-size: 4rem;
}
@media only screen and (max-width: 787px) {
  .staff {
    padding-bottom: 20px;
    height: auto;
  }
  .staff h2 {
    height: auto;
  }
  .staff h2 span {
    font-size: 13px;
    font-size: 0.8125rem;
  }
}

.staffDetailArea {
  margin-bottom: 60px;
  padding: 40px 0;
  background: url(../images/common/bg_umi.gif);
}
@media only screen and (max-width: 787px) {
  .staffDetailArea {
    margin-bottom: 20px;
    padding: 20px 0;
  }
}
.staffDetailArea .container {
  width: 940px;
}
@media only screen and (max-width: 787px) {
  .staffDetailArea .container {
    width: auto;
  }
}

.movieBox {
  width: 560px;
  float: right;
}
@media only screen and (max-width: 787px) {
  .movieBox {
    padding-top: 56.25%;
    position: relative;
    width: 100%;
  }
  .movieBox iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
  }
}

.staffDetail {
  padding: 20px;
  width: 353px;
  height: 315px;
  float: left;
  background: #FFF;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .staffDetail {
    float: none;
    width: auto;
    height: auto;
  }
}

.staffNameArea {
  width: 45%;
  float: left;
}
.staffNameArea h3 {
  margin: 0;
}

.affiliated {
  margin-bottom: 20px;
  font-weight: normal;
  font-size: 14px;
  font-size: 0.875rem;
  line-height: 146%;
  display: block;
  letter-spacing: -1px;
}

.staffName {
  margin-bottom: 10px;
  font-size: 22px;
  font-size: 1.375rem;
  font-weight: bold;
  display: block;
}

.staffKana {
  n\margin-bottom: 15px;
  font-size: 12px;
  font-size: 0.75rem;
  display: block;
}

.staffAge {
  padding: 0;
  font-size: 13px;
  font-size: 0.8125rem;
}

.staffPhoto {
  margin: 0;
  padding-right: 10px;
  width: 55%;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.staffPhoto img {
  max-width: 100%;
  height: auto;
}

.staffProfile {
  margin: 0;
  clear: both;
}
.staffProfile p {
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 138%;
}

.btnRecruitOutline {
  padding-top: 30px;
  width: auto;
  text-align: center;
  clear: both;
}
@media only screen and (max-width: 787px) {
  .btnRecruitOutline {
    padding-top: 20px;
    margin: 0 10px;
  }
}
.btnRecruitOutline a {
  width: 100%;
  line-height: 60px;
  display: block;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  background: url(../images/common/bg_umi_red.gif);
  font-weight: bold;
  font-size: 16px;
  font-size: 1rem;
  color: #FFF;
  text-decoration: none;
}
.btnRecruitOutline a:hover {
  background: url(../images/common/bg_umi_blue.gif);
}

/*----------------------------------------
	company
----------------------------------------*/
.company .headline {
  position: relative;
}
.company .headline h2 {
  height: 31px;
  background: url(../images/company/hl_company.gif) no-repeat left bottom;
}
@media only screen and (max-width: 787px) {
  .company .headline {
    padding: 0;
    height: auto;
  }
  .company .headline h2 {
    height: auto;
  }
}
.company .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .company .container {
    padding: 0 10px;
  }
}

.secCompany {
  padding-bottom: 50px;
}
@media only screen and (max-width: 787px) {
  .secCompany {
    padding-bottom: 30px;
  }
}
.secCompany h3 {
  margin: 0 0 30px;
  padding: 0 20px;
  line-height: 50px;
  background: url(../images/common/bg_umi_red.gif);
  color: #FFF;
  font-size: 18px;
  font-size: 1.125rem;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
@media only screen and (max-width: 787px) {
  .secCompany h3 {
    margin-bottom: 15px;
    padding: 10px;
    line-height: 120%;
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.secCompany p {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .secCompany p {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.secCompany .redTable th {
  vertical-align: top;
}
.secCompany .redTable .officeList {
  border-bottom: 1px solid #CCC;
}
.secCompany .redTable .officeList.officeLast {
  border-bottom: 1px solid #E50012;
}

.representative {
  padding: 30px 20px 0 420px;
  width: auto;
  height: 550px;
  background: url(../images/company/pho_takahashi.png) no-repeat left bottom, url(../images/common/bg_umi.gif);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .representative {
    padding: 10px 15px 140px;
    height: auto;
    -moz-background-size: 110px, auto;
    -o-background-size: 110px, auto;
    -webkit-background-size: 110px, auto;
    background-size: 110px, auto;
  }
  .representative br {
    display: none;
  }
}

.saying {
  margin-bottom: 30px;
  font-size: 16px;
  font-size: 1rem;
  font-weight: bold;
  line-height: 240%;
  letter-spacing: 3px;
}
@media only screen and (max-width: 787px) {
  .saying {
    margin-bottom: 20px;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 180%;
    letter-spacing: 0;
  }
}
.saying b {
  margin-right: 5px;
  font-size: 22px;
  font-size: 1.375rem;
  color: #E50012;
  letter-spacing: -2px;
  display: inline-block;
}
@media only screen and (max-width: 787px) {
  .saying b {
    margin-left: 2px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.saying span {
  color: #E50012;
}

.representativeName {
  position: absolute;
  right: 60px;
  bottom: 20px;
}
.representativeName span {
  margin-left: 15px;
  font-size: 20px;
  font-size: 1.25rem;
  font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
}
@media only screen and (max-width: 787px) {
  .representativeName {
    right: 30px;
  }
  .representativeName span {
    margin-left: 10px;
    font-size: 18px;
    font-size: 1.125rem;
  }
}

.precepts {
  margin: 0;
  padding: 20px 0;
}
@media only screen and (max-width: 787px) {
  .precepts {
    padding: 10px 0;
  }
}
.precepts li {
  margin-left: 26px;
  width: 215px;
  height: 100px;
  list-style: none;
  text-align: center;
  line-height: 100px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  border: 1px solid #E9E9E9;
  background: url(../images/common/bg_umi.gif);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
}
.precepts li:first-child {
  margin-left: 0;
}
@media only screen and (max-width: 787px) {
  .precepts li {
    margin: 0 0 10px;
    width: auto;
    height: 60px;
    line-height: 60px;
    font-size: 16px;
    font-size: 1rem;
    float: none;
  }
}

.shopNumber {
  width: 100%;
}
.shopNumber td {
  border: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .shopNumber td {
    text-align: center;
  }
}
.shopNumber td img {
  width: 60px;
  height: auto;
}
.shopNumber td:first-child {
  padding: 10px 0;
  text-align: center;
}
.shopNumber td:last-child {
  width: 74px;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  .shopNumber td:last-child {
    margin-bottom: 10px;
    width: 100%;
    background: #EEE;
  }
}

.office {
  position: relative;
}
.office p {
  margin: 0;
}
.office p:first-child {
  margin: 0 0 15px;
}
.office p > span {
  font-size: 13px;
  font-size: 0.8125rem;
}

.btnMap {
  position: absolute;
  top: 0;
  right: 0;
}
.btnMap i {
  margin-right: 5px;
  font-size: 18px;
  font-size: 1.125rem;
  color: #CCC;
  position: relative;
  top: 3px;
}
.btnMap a {
  color: #EB604B;
  vertical-align: top;
  text-decoration: none;
  font-size: 12px;
  font-size: 0.75rem;
}
.btnMap a span {
  border-bottom: 1px solid #EB604B;
}
.btnMap a:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}
.btnMap a i {
  color: #000;
}

/*----------------------------------------
	contact
----------------------------------------*/
.contact .headline {
  position: relative;
}
.contact .headline h2 {
  background: url(../images/contact/hl_contact.gif) no-repeat 62px bottom;
}
.contact .headline h2 i {
  margin-top: 12px;
  font-size: 44px;
  font-size: 2.75rem;
}
@media only screen and (max-width: 787px) {
  .contact .headline {
    padding: 0;
  }
}
.contact form {
  margin: 0 20px;
}
@media only screen and (max-width: 787px) {
  .contact form {
    margin: 0 10px;
  }
}
.contact form input:not([type="radio"]), .contact form textarea {
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.contact form input, .contact form textarea {
  padding: 3px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: none;
  background: #F3F3F3;
  border: none;
  line-height: 120%;
}
.contact form textarea {
  height: 200px;
}
@media only screen and (max-width: 787px) {
  .contact form textarea {
    height: 100px;
  }
}

.pContact {
  padding: 10px 20px 20px;
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
}
@media only screen and (max-width: 787px) {
  .pContact {
    padding: 10px 10px 20px;
  }
}
.pContact .attention {
  color: #E50012;
}

.contatForm {
  margin: 40px 0 10px;
  width: 100%;
}
.contatForm th, .contatForm td {
  padding: 10px 0;
}
.contatForm th {
  width: 30%;
  font-weight: normal;
  vertical-align: top;
}
.contatForm td {
  padding-left: 30px;
  width: calc(70% - 30px);
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .contatForm {
    margin: 10px 0 0;
  }
  .contatForm tr {
    display: inline;
  }
  .contatForm th {
    padding: 10px 0;
    width: auto;
    display: block;
  }
  .contatForm th:before {
    margin: 2px 8px 0 0;
    content: "";
    width: 5px;
    height: 14px;
    display: inline-block;
    background: #000;
  }
  .contatForm td {
    padding: 0 0 20px;
    width: auto;
    display: block;
  }
}

.required {
  padding: 3px 5px;
  border: 1px solid #EB604B;
  display: inline-block;
  float: right;
  font-size: 13px;
  font-size: 0.8125rem;
  line-height: 120%;
  color: #EB604B;
}

.item label {
  display: block;
}

.btnSubmitArea {
  width: calc(70% - 30px);
  float: right;
  text-align: center;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .btnSubmitArea {
    width: auto;
    float: none;
  }
}

#btnSubmit, #btnConfirm, #btnBack {
  margin-bottom: 5px;
  width: 100%;
  background: #E50012;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  border: none;
  line-height: 54px;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  color: #FFF;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
#btnSubmit:hover, #btnConfirm:hover, #btnBack:hover {
  opacity: 0.5;
  filter: alpha(opacity=50);
}

#btnConfirm {
  background: #194375;
}

#btnBack {
  margin-top: 10px;
  width: 70%;
  line-height: 40px;
  font-size: 16px;
  font-size: 1rem;
  background: #333;
}

.comfirmTitle {
  margin-bottom: -30px;
  padding-top: 30px;
  font-size: 18px;
  font-size: 1.125rem;
  color: #E50012;
  font-weight: bold;
}
@media only screen and (max-width: 787px) {
  .comfirmTitle {
    margin-bottom: 0;
    padding-top: 10px;
  }
}

.pConfirm {
  padding: 0 10px;
  margin-bottom: 20px;
  border: 1px solid #E50012;
  text-align: left;
  color: #E50012;
  font-size: 14px;
  font-size: 0.875rem;
}

/* contact form7 */
span.wpcf7-not-valid-tip {
  color: #E50012;
  font-size: 12px;
  font-size: 0.75rem;
}

div.wpcf7-validation-errors {
  margin: 0 10px !important;
  padding: 30px 15px;
  border: 2px solid #E50012;
  color: #E50012;
  text-align: center;
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  div.wpcf7-validation-errors {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}

div.wpcf7-mail-sent-ok {
  padding: 30px 15px;
  border: none;
  background: #E50012;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-weight: bold;
  color: #FFF;
  font-size: 16px;
  font-size: 1rem;
  text-align: center;
}
@media only screen and (max-width: 787px) {
  div.wpcf7-mail-sent-ok {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}

div.wpcf7-response-output {
  margin: 0;
}

.ajax-loader {
  margin: 0 auto !important;
  padding: 15px;
  display: block;
  position: absolute;
  bottom: 4px;
}

span.wpcf7-list-item {
  margin-left: 0;
}

/*----------------------------------------
	reserve
----------------------------------------*/
.reserve .headline {
  position: relative;
}
.reserve .headline h2 {
  height: 55px;
  background: url(../images/reserve/hl_reserve.gif) no-repeat 62px bottom;
}
.reserve .headline h2 i {
  margin-top: 12px;
  font-size: 44px;
  font-size: 2.75rem;
}
@media only screen and (max-width: 787px) {
  .reserve .headline {
    padding: 0;
  }
}
.reserve form {
  margin: 0 20px;
}
@media only screen and (max-width: 787px) {
  .reserve form {
    margin: 0 10px;
  }
}
.reserve form input:not([type="radio"]), .reserve form textarea {
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.reserve form input, .reserve form textarea {
  padding: 3px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: none;
  background: #F3F3F3;
  border: none;
  line-height: 120%;
}
.reserve form .datepicker {
  width: 90% !important;
}
.reserve form textarea {
  height: 200px;
}
@media only screen and (max-width: 787px) {
  .reserve form textarea {
    height: 100px;
  }
}

.ui-datepicker-trigger {
  margin-left: 6px;
  width: 20px;
  height: auto;
  position: relative;
  top: 3px;
  cursor: pointer;
}

.ui-datepicker th {
  padding: 0 !important;
}

.ui-datepicker td span, .ui-datepicker td a {
  padding: 0 6px !important;
}

.ui-datepicker {
  font-size: 90% !important;
}

.wpcf7c-conf {
  background: #FFF !important;
  pointer-events: none;
}
.wpcf7c-conf + input + .ui-datepicker-trigger {
  display: none;
}
.wpcf7c-conf.wpcf7-textarea {
  height: auto;
}

.btnBbqReserve, .btnOpenTable {
  margin: 0 0 20px;
}
.btnBbqReserve a, .btnOpenTable a {
  padding: 0 20px;
  line-height: 30px;
  display: inline-block;
  background: #E50012;
  border: 1px solid #E50012;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #FFF;
  text-align: center;
  text-decoration: none;
}
.btnBbqReserve a:hover, .btnOpenTable a:hover {
  background: #FFF;
  color: #E50012;
}
@media only screen and (max-width: 787px) {
  .btnBbqReserve a, .btnOpenTable a {
    padding: 6px 20px;
    width: 100%;
    line-height: 140%;
  }
}

.btnOpenTable {
  margin-right: 10px;
  display: inline-block;
}
@media only screen and (max-width: 787px) {
  .btnOpenTable {
    margin: 0 0 10px;
    display: block;
  }
}
.btnOpenTable a {
  background: #194375;
  border: 1px solid #194375;
}
.btnOpenTable a:hover {
  color: #194375;
}
.btnOpenTable a br {
  display: none;
}
@media only screen and (max-width: 787px) {
  .btnOpenTable a br {
    display: block;
  }
}

.NewYearAttention {
  padding: 10px 20px;
  background: #E50012;
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .NewYearAttention {
    padding: 10px;
  }
}

/*----------------------------------------
	privacy
----------------------------------------*/
.privacy .headline {
  padding-bottom: 20px;
  position: relative;
}
.privacy .headline h2 {
  height: 55px;
  background: url(../images/privacy/hl_privacy.gif) no-repeat left bottom;
}
.privacy .headline p {
  width: auto;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .privacy .headline p {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
@media only screen and (max-width: 787px) {
  .privacy .headline {
    padding: 0;
    height: auto;
  }
  .privacy .headline h2 {
    height: auto;
  }
}
.privacy .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .privacy .container {
    padding: 0 10px;
  }
}

.secPrivacy {
  padding-bottom: 30px;
}
.secPrivacy h3 {
  padding: 0 20px;
  line-height: 50px;
  background: url(../images/common/bg_umi_red.gif);
  color: #FFF;
  font-size: 18px;
  font-size: 1.125rem;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}
@media only screen and (max-width: 787px) {
  .secPrivacy h3 {
    padding: 10px;
    line-height: 120%;
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.secPrivacy p {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .secPrivacy p {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.secPrivacy ul {
  margin: 0;
  padding: 0;
}
.secPrivacy ul li {
  margin-left: 22px;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .secPrivacy ul li {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.secPrivacy ol {
  margin: 0;
  padding: 0;
}
.secPrivacy ol li {
  margin: 0 0 20px 26px;
  list-style: lower-alpha;
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .secPrivacy ol li {
    font-size: 12px;
    font-size: 0.75rem;
  }
}

/*----------------------------------------
	pictures
----------------------------------------*/
.pictures .headline {
  position: relative;
}
.pictures .headline h2 {
  background: url(../images/pictures/hl_pictures.gif) no-repeat 62px bottom;
}
.pictures .headline h2 i {
  margin-top: 12px;
  font-size: 44px;
  font-size: 2.75rem;
}
@media only screen and (max-width: 787px) {
  .pictures .headline h2 span {
    display: none;
  }
}
@media only screen and (max-width: 787px) {
  .pictures .headline {
    padding: 0;
  }
}
.pictures .pContact {
  padding-bottom: 0;
  border-bottom: none;
}
.pictures form {
  margin: 0 20px;
}
@media only screen and (max-width: 787px) {
  .pictures form {
    margin: 0 10px;
  }
}
.pictures form input:not([type="radio"]), .pictures form textarea {
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.pictures form input, .pictures form textarea {
  padding: 3px;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: none;
  background: #F3F3F3;
  border: none;
  line-height: 120%;
}
.pictures form textarea {
  height: 200px;
}
@media only screen and (max-width: 787px) {
  .pictures form textarea {
    height: 100px;
  }
}
.pictures .attention {
  font-size: 11px;
  font-size: 0.6875rem;
}

.pPictures {
  width: 380px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .pPictures {
    width: auto;
    float: none;
  }
}

.poster {
  margin: 20px 0 0;
  width: 190px;
  float: right;
}
.poster img {
  max-width: 100%;
  height: auto;
}
@media only screen and (max-width: 787px) {
  .poster {
    margin: 20px 30px;
    width: auto;
    float: none;
  }
}

.secPictures {
  margin-bottom: 30px;
  clear: both;
}
.secPictures h3 {
  margin: 0 0 15px 0;
  line-height: 40px;
  background: url(../images/common/bg_umi_red.gif);
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  font-size: 18px;
  font-size: 1.125rem;
  color: #FFF;
  text-align: center;
}

/*----------------------------------------
	404
----------------------------------------*/
.notFound {
  position: relative;
}
.notFound h2 {
  height: 31px;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
}
@media only screen and (max-width: 787px) {
  .notFound {
    padding: 0;
    height: auto;
  }
  .notFound h2 {
    height: auto;
  }
}
.notFound + .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .notFound + .container {
    padding: 0 10px;
  }
}

/* english */
/*----------------------------------------
	body english
----------------------------------------*/
.english {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 16px;
  font-size: 1rem;
}
.english .headline h2 {
  padding-left: 62px;
  background: none !important;
  font-size: 40px;
  font-size: 2.5rem;
  font-weight: normal;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
}
@media only screen and (max-width: 787px) {
  .english .headline h2 {
    padding-left: 0;
    height: auto;
    background: none !important;
    text-indent: 0;
    white-space: normal;
    overflow: visible;
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.english .headline p {
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .english .headline p {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .redTable th, .english .redTable td {
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .english .redTable tr th, .english .redTable tr td {
    font-size: 15px;
    font-size: 0.9375rem;
  }
}
@media only screen and (max-width: 787px) {
  .english .topBlogArea h2 a, .english .zauoBlogTitle h2 a {
    font-size: 22px;
    font-size: 1.375rem;
  }
}

/*----------------------------------------
	header english
----------------------------------------*/
.english .headerIndex .hBotNav ul li:nth-child(5) i {
  position: relative;
  top: -3px;
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .english .headerIndex .hBotNav ul li:nth-child(5) i {
    position: static;
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
.english .headerIndex .hBotNav ul li:nth-child(6) i {
  font-size: 36px;
  font-size: 2.25rem;
}
@media only screen and (max-width: 787px) {
  .english .headerIndex .hBotNav ul li:nth-child(6) i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
.english .headerIndex .hBotNav ul li:last-child i {
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .english .headerIndex .hBotNav ul li:last-child i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
.english header .headerNav h1 a {
  background: #FFF url(../images/common/logo_header_en.png) no-repeat center;
}
@media only screen and (max-width: 787px) {
  .english header .headerNav h1 a {
    background-size: 70%;
  }
}
.english header .hBotNav ul {
  margin-right: -8px;
}
.english header .hBotNav ul li a {
  font-weight: normal;
}
.english header .hBotNav ul li:nth-child(5) i {
  position: relative;
  top: -3px;
  font-size: 28px;
  font-size: 1.75rem;
}
@media only screen and (max-width: 787px) {
  .english header .hBotNav ul li:nth-child(5) i {
    margin: 0;
    position: static;
    font-size: 16px;
    font-size: 1rem;
  }
}
.english header .hBotNav ul li:nth-child(6) i {
  font-size: 24px;
  font-size: 1.5rem;
}
@media only screen and (max-width: 787px) {
  .english header .hBotNav ul li:nth-child(6) i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
.english header .hBotNav ul li:last-child i {
  margin-top: 0;
  font-size: 26px;
  font-size: 1.625rem;
}
@media only screen and (max-width: 787px) {
  .english header .hBotNav ul li:last-child i {
    margin: 0;
    font-size: 16px;
    font-size: 1rem;
  }
}
@media only screen and (max-width: 787px) {
  .english header .hBotNav ul {
    margin: 0 15px;
  }
  .english header .hBotNav ul li {
    width: 100%;
  }
}

/*----------------------------------------
	footer english
----------------------------------------*/
.english .fLeftNav ul {
  width: 50%;
}
.english .fLeftNav ul:first-child {
  width: 40%;
}
@media only screen and (max-width: 787px) {
  .english .fLeftNav ul {
    width: auto;
  }
}
.english .copy {
  background: url(../images/common/logo_footer_en.png) no-repeat;
}
.english .copy small {
  display: inline-block;
  font-size: 12px;
  font-size: 0.75rem;
  line-height: 132%;
}
@media only screen and (max-width: 787px) {
  .english .copy {
    width: auto;
    float: none;
    background-position: center;
    -moz-background-size: 110px auto;
    -o-background-size: 110px auto;
    -webkit-background-size: 110px auto;
    background-size: 110px auto;
  }
  .english .copy small {
    display: block;
    text-align: center;
  }
}

/*----------------------------------------
	index english
----------------------------------------*/
.english .mainVisual {
  background: url(../images/index/p_mainvisual_en.png) no-repeat center 130px;
}
@media only screen and (max-width: 787px) {
  .english .mainVisual {
    background-position: center 30px;
    -moz-background-size: 70px;
    -o-background-size: 70px;
    -webkit-background-size: 70px;
    background-size: 70px;
  }
}
.english .illustArea img {
  margin-right: 80px;
}
@media only screen and (max-width: 787px) {
  .english .illustArea img {
    margin: 0;
  }
}
.english .btnIllust a {
  background: url(../images/index/btn_illust_soon_en.png) no-repeat;
  cursor: default;
}
@media only screen and (max-width: 787px) {
  .english .btnIllust a {
    background: none;
  }
}
@media only screen and (max-width: 787px) {
  .english .index {
    padding-top: 0;
  }
}
.english .index .btnBase {
  padding: 0;
}
@media only screen and (max-width: 787px) {
  .english .index .btnBase {
    margin: 0 10px;
    width: auto;
  }
}
.english .index .btnBase a i {
  margin-top: 4px;
  font-size: 44px;
  font-size: 2.75rem;
}
@media only screen and (max-width: 787px) {
  .english .index .btnBase a i {
    margin: 0 auto;
    height: 30px;
    display: block;
    font-size: 30px;
    font-size: 1.875rem;
  }
}
@media only screen and (max-width: 787px) {
  .english .index .btnBase a {
    padding: 8px 10px 10px;
  }
}
@media only screen and (max-width: 787px) {
  .english .pickupArea a section h2 {
    line-height: 120%;
  }
  .english .pickupArea a section h2 span {
    line-height: 100%;
  }
  .english .pickupArea a p {
    line-height: 120%;
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.english .topBlogArea h2 {
  background: none;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
  font-size: 24px;
  font-size: 1.5rem;
}
.english .topBlogArea h2 i {
  margin-right: 15px;
  position: static;
}

/*----------------------------------------
	howto english
----------------------------------------*/
.english .howto .headline {
  padding-bottom: 25px;
}
@media only screen and (max-width: 787px) {
  .english .howto .headline {
    padding-bottom: 0;
  }
}
.english .howto .headline .attention {
  font-size: 13px;
  font-size: 0.8125rem;
}
@media only screen and (max-width: 787px) {
  .english .howto .headline .attention {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.english .secHowto h3, .english .secAbout h3, .english .secFlow h3, .english .secRecruit h3 {
  font-size: 28px;
  font-size: 1.75rem;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .english .secHowto h3, .english .secAbout h3, .english .secFlow h3, .english .secRecruit h3 {
    font-size: 20px;
    font-size: 1.25rem;
  }
}
.english .howto01 p {
  width: 390px;
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .english .howto01 p {
    width: auto;
  }
  .english .howto01 p.attention {
    font-size: 12px;
    font-size: 0.75rem;
  }
}
.english .secStep1 h4 {
  margin-bottom: 20px;
  width: auto;
  height: auto;
  background: none;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
  font-size: 30px;
  font-size: 1.875rem;
  font-style: italic;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .english .secStep1 h4 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.english .secStep2 h4 {
  margin-bottom: 20px;
  width: auto;
  height: auto;
  background: none;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
  font-size: 30px;
  font-size: 1.875rem;
  font-style: italic;
  font-weight: normal;
  color: #FFF;
}
@media only screen and (max-width: 787px) {
  .english .secStep2 h4 {
    background: none;
    font-size: 18px;
    font-size: 1.125rem;
    color: #000;
  }
}
.english .hlStep3 {
  width: 50%;
  height: auto;
  position: absolute;
  top: 20px;
  left: 15px;
  display: none;
}
@media only screen and (max-width: 787px) {
  .english .hlStep3 {
    display: block;
  }
}
.english .hlFishBite {
  position: absolute;
  top: 340px;
  left: 80px;
}
.english .secStep4 h4 {
  margin-bottom: 20px;
  width: auto;
  height: auto;
  background: none;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
  font-size: 30px;
  font-size: 1.875rem;
  font-style: italic;
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .english .secStep4 h4 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.english .pHanmi {
  top: 78px;
}
@media only screen and (max-width: 787px) {
  .english .pHanmi {
    position: static;
    text-align: center;
  }
  .english .pHanmi img {
    max-width: 100%;
    height: auto;
  }
}
.english .pHanmi img {
  vertical-align: bottom;
}
.english .howto02 h3 + p {
  width: 440px;
}
@media only screen and (max-width: 787px) {
  .english .howto02 h3 + p {
    width: auto;
  }
}
.english .howto02 ol li figure figcaption {
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .english .howto02 ol li {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .btnBase a {
  font-weight: normal;
}

/*----------------------------------------
	about english
----------------------------------------*/
.english .about .headline h2 {
  height: inherit;
}
@media only screen and (max-width: 787px) {
  .english .about .btnAbout li, .english .about .btnRecruitChange li {
    display: table;
  }
}
.english .about .btnAbout li a, .english .about .btnRecruitChange li a {
  font-size: 18px;
  font-size: 1.125rem;
}
@media only screen and (max-width: 787px) {
  .english .about .btnAbout li a, .english .about .btnRecruitChange li a {
    height: 46px;
    display: table-cell;
    line-height: 120%;
    font-size: 13px;
    font-size: 0.8125rem;
    font-weight: normal;
    vertical-align: middle;
  }
}
.english .about .detail h4 {
  font-weight: normal;
}
@media only screen and (max-width: 787px) {
  .english .about .detail h4 {
    font-size: 16px;
    font-size: 1rem;
  }
}
.english .about .groupList > li figure figcaption span {
  text-align: left;
  font-weight: normal;
  font-size: 15px;
  font-size: 0.9375rem;
}
.english .food .fcBlue {
  font-weight: normal;
  font-style: italic;
  font-size: 22px;
  font-size: 1.375rem;
}
.english .btnSp li {
  margin-left: 0;
  width: 100%;
  display: table;
  float: none;
}
@media only screen and (max-width: 787px) {
  .english .btnSp li a {
    padding: 8px 10px 10px;
    line-height: 120%;
    font-size: 14px;
    font-size: 0.875rem;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
}
@media only screen and (max-width: 787px) {
  .english .btnSp li a i {
    font-size: 32px;
    font-size: 2rem;
    display: block;
  }
}
.english .sp .fcRed {
  font-weight: normal;
  font-style: italic;
  font-size: 22px;
  font-size: 1.375rem;
}

/*----------------------------------------
	experience english
----------------------------------------*/
.english .experience .headline {
  padding-bottom: 156px;
}
@media only screen and (max-width: 787px) {
  .english .experience .headline {
    padding: 0;
    height: auto;
  }
}
.english .experience .btnBase i {
  margin-top: 10px;
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .english .experience .btnBase {
    padding: 0 10px;
  }
  .english .experience .btnBase a {
    padding: 5px 10px 8px;
  }
  .english .experience .btnBase i {
    margin: 0 auto;
    display: block;
    font-size: 30px;
    font-size: 1.875rem;
  }
}
.english .secFlow ol li figure figcaption span {
  font-size: 20px;
  font-size: 1.25rem;
  font-style: italic;
}

/*----------------------------------------
	kakigoya english
----------------------------------------*/
.english .kakigoya .headline h2 {
  margin-bottom: 20px;
  padding: 20px 0 0 0;
}
@media only screen and (max-width: 787px) {
  .english .kakigoya .headline h2 {
    padding-left: 10px;
  }
}
.english .kakigoya .headline .container {
  padding: 0;
}
.english .secKakigoya h3 {
  padding: 10px 20px;
  font-size: 20px;
  font-size: 1.25rem;
  line-height: 120%;
  position: relative;
}
@media only screen and (max-width: 787px) {
  .english .secKakigoya h3 {
    font-size: 18px;
    font-size: 1.125rem;
  }
}
.english .secKakigoya h3 .where {
  font-size: 16px;
  font-size: 1rem;
  display: block;
}
@media only screen and (max-width: 787px) {
  .english .secKakigoya h3 .where {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .secKakigoya h3 .start {
  padding: 5px;
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 15px;
  font-size: 0.9375rem;
  line-height: 120%;
  display: inline-block;
  border: 1px solid #FFF;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
@media only screen and (max-width: 787px) {
  .english .secKakigoya h3 .start {
    font-size: 13px;
    font-size: 0.8125rem;
    position: static;
  }
  .english .secKakigoya h3 .start br {
    display: none;
  }
}
.english .secKakigoya figure {
  margin: 0;
}
.english .secKakigoya figure img {
  vertical-align: bottom;
}
.english .secKakigoya:nth-last-child(2) {
  margin: 0;
  padding: 0;
  border-bottom: none;
}
.english .secKakigoya .btnBase {
  margin: 20px auto 0;
  padding: 0;
  width: 100%;
}
.english .secKakigoya .btnBase i {
  margin: 10px 10px 0 0;
  font-size: 40px;
  font-size: 2.5rem;
}
@media only screen and (max-width: 787px) {
  .english .secKakigoya .btnBase {
    padding: 0 10px;
    line-height: 120%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .english .secKakigoya .btnBase a {
    padding: 5px 10px 8px;
  }
  .english .secKakigoya .btnBase i {
    margin: 0 auto;
    display: block;
    font-size: 30px;
    font-size: 1.875rem;
  }
}
.english .access p {
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .english .access p {
    font-size: 14px;
    font-size: 0.875rem;
  }
}

/*----------------------------------------
	shop english
----------------------------------------*/
.english .shop .headline {
  padding-bottom: 180px;
}
.english .shopName span {
  font-size: 14px;
  font-size: 0.875rem;
  color: #666;
}
.english .secShopArea .shopName span, .english .secShopShimaiArea .shopName span {
  display: block;
}
.english .secShopShimaiArea .shopName span {
  display: inline-block;
}
.english .shopDetail {
  margin: 0;
  padding: 0;
  clear: both;
}
@media only screen and (max-width: 787px) {
  .english .shopDetail {
    margin: 0 15px;
  }
}
@media only screen and (max-width: 787px) {
  .english .shopDetail li {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .shopDetail li:last-child {
  width: inherit;
  clear: none;
}
.english .shopDetail li i {
  position: static;
  float: left;
}
@media only screen and (max-width: 787px) {
  .english .shopDetail li i {
    margin-bottom: 5px;
    position: relative;
    float: none;
    display: block;
  }
}
.english .shopDetail li span {
  margin-top: -3px;
  float: left;
}
@media only screen and (max-width: 787px) {
  .english .shopDetail li span {
    margin-top: 0;
    float: none;
    display: block;
    line-height: 120%;
  }
}
.english .shopLink li {
  font-size: 14px;
  font-size: 0.875rem;
}

/*----------------------------------------
	blog english
----------------------------------------*/
@media only screen and (max-width: 787px) {
  .english .entryList .entryListDetail h3 a {
    display: inline-block;
    line-height: 140%;
  }
}
@media only screen and (max-width: 787px) {
  .english .entryList .entryListDetail .entryMeta time {
    display: block;
    line-height: 140%;
  }
}
@media only screen and (max-width: 787px) {
  .english .entryList .entryListDetail .entryMeta .entyrAuthorName {
    line-height: 140%;
  }
}

/*----------------------------------------
	company english
----------------------------------------*/
.english .company .headline h2 {
  padding: 20px 0 0 0;
}
@media only screen and (max-width: 787px) {
  .english .representativeName {
    right: 20px;
  }
  .english .representativeName span {
    margin-left: 0;
    font-size: 16px;
    font-size: 1rem;
    display: block;
  }
}
.english .secCompany h3 {
  font-size: 20px;
  font-size: 1.25rem;
}
@media only screen and (max-width: 787px) {
  .english .secCompany h3 {
    font-size: 16px;
    font-size: 1rem;
  }
}
.english .secCompany p {
  font-size: 16px;
  font-size: 1rem;
}
@media only screen and (max-width: 787px) {
  .english .secCompany p {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .saying {
  margin-bottom: 30px;
  font-size: 20px !important;
  font-size: 1.25rem !important;
  font-weight: normal;
  font-style: italic;
  line-height: 166%;
  letter-spacing: 0;
}
@media only screen and (max-width: 787px) {
  .english .saying {
    margin-bottom: 20px;
    font-size: 18px !important;
    font-size: 1.125rem !important;
  }
  .english .saying + p {
    font-size: 14px;
    font-size: 0.875rem;
  }
}
.english .precepts li {
  font-weight: normal;
}
.english .office p {
  font-size: 16px;
  font-size: 1rem;
}
.english .office p:first-child {
  font-size: 17px;
  font-size: 1.0625rem;
  color: #E50012;
}
.english .office p:first-child span {
  color: #000;
}
.english .office p > span {
  font-size: 14px;
  font-size: 0.875rem;
}
@media only screen and (max-width: 787px) {
  .english .btnMap {
    position: static;
  }
}

/*----------------------------------------
	privacy
----------------------------------------*/
.english .privacy .headline h2 {
  padding: 20px 0 0 0;
}

.secPrivacy ul li {
  list-style: lower-alpha;
}
.secPrivacy ol li b {
  font-weight: normal;
}

/*----------------------------------------
	reserve english
----------------------------------------*/
.english .reserve .headline h2 i {
  margin-top: 12px;
  font-size: 38px;
  font-size: 2.375rem;
}

/* 404 */
/*----------------------------------------
	404
----------------------------------------*/
.notFound {
  position: relative;
}
.notFound h2 {
  height: 31px;
  text-indent: 0;
  white-space: normal;
  overflow: visible;
}
@media only screen and (max-width: 787px) {
  .notFound {
    padding: 0;
    height: auto;
  }
  .notFound h2 {
    height: auto;
  }
}
.notFound + .container {
  padding: 0 20px;
}
@media only screen and (max-width: 787px) {
  .notFound + .container {
    padding: 0 10px;
  }
}

/*----------------------------------------
	News Top Page
----------------------------------------*/
.mn-nws{
  width: 100%;
  padding-bottom: 60px;
}
h3.mn-nws-ttl{
  text-align: center;
  font-size: 30px;
}
.mn-ttl{
    border: 1px dotted #DFDCEA;
    border-left: 0;
    border-right: 0;
}
.mn-ttl a{
  text-decoration: none;
  color: currentColor;
}
.mn-ttl a:hover{
  color: #E93340;
}

.mn-btn{
  padding-top: 30px;
}
.mn-btn-more{
  width: 280px;
  height: 55px;
  display: block;
  position: relative;
  left: 190px;
  top: 0px;
  background: #e93340;
  border: 1px solid #e93340;
  line-height: 55px;
  font-size: 14px;
  font-size: 0.875rem;
  color: #FFF;
  text-align: center;
  text-decoration: none;
}
@media only screen and (max-width: 787px) {
  .mn-btn-more {
    width: 100%;
    left: 0;
  }
  .mn-btn{
    float: right;
    padding-right: 15px;
    padding-top: 0px;
  }
  .mn-btn-more{
    width: auto;
    height: auto;
    display: block;
    position: relative;
    left: auto;
    top: 0px;
    background: none;
    border: 0;
    line-height: 55px;
    font-size: 14px;
    font-size: 0.875rem;
    color: #000000;
    text-align: right;
    text-decoration: none;
  }
  .mn-btn-more i{
    color: #000 !important;
  }
}
.mn-btn-more:hover {
  background-color: #FFF;
  color: #e93340;
}
.mn-btn-more:hover i {
  color: #e93340;
}
.mn-btn-more i {
  margin-left: 5px;
  color: #FFF;
}

.mn-ttl dl{
  display: flex;
  flex-wrap: wrap;
}
.mn-ttl dt{
  flex: 0 0 13%;
  max-width: 13%;
}
.mn-ttl dd{
  flex: 0 0 79%;
  max-width: 79%;
}

@media only screen and (max-width: 787px) {
  .mn-ttl dl{
    display: block;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .mn-ttl dd{
    margin-inline-start: 0px;
    flex: 0 0 100%;
    max-width: 100%;
  }
  h3.mn-nws-ttl{
    background-color: #e93340;
    color: #ffff;
    padding: 10px 10px;
    font-size: 18px;
  }
  .entryList.col2Box .eyeCatch{
    height: auto;
  }
  .mn-nws{
    padding-bottom: 20px;
  }
}