/**
 * Font Family
 */
body,.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6  {
  font-family: "ヒラギノ明朝 ProN W3", HiraMinProN-W3, メイリオ, meiryo, HG明朝E, "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", "EB Garamond";
}

.text-overflow, .text-overflow > a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/**
 * Block
 */
.block { display: block; }
.inline { display: block; }
.inline-block { display: inline-block; }
.none { display: none; }
.flex { display: flex; flex-wrap: wrap; }

.float-none { float: none; }

.row-flex {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}


/**
 * Positioning Status
 */
.static { position: static; }
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed;}


/**
 * Cover Selector Block
 */
.cover {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.cover-width { width: 100%; }
.cover-height { height: 100%; }

.position-top { top: 0; }
.position-left { left: 0; }
.position-right { right: 0; }
.position-bottom { bottom: 0; }

.cover.click:hover {
  text-align: center;
}
.cover.click:hover:after {
  content: "CLICK";
  position: absolute;
  left: 0;
  top: calc(50% - 25px);
  width: 100%;
  color: #555555;
  font-size: 30px;
}

.opacity-light {
  opacity: 0.3;
  -o-opacity: 0.3;
  -moz-opacity: 0.3;
  -webkit-opacity: 0.3;
}
.opacity-dark {
  opacity: 0.7;
  -o-opacity: 0.7;
  -moz-opacity: 0.7;
  -webkit-opacity: 0.7;
}

/**
 * Material Background White
 */
.whiteout {
  background-color: #ffffff;
  padding: 10px 15px;
  margin-bottom: 15px;
}

/**
 * Grid
 */
.row-eq-height,
.row-eq-height > .view-content {
  display: flex;
  flex-wrap: wrap;
}

.row-views > .view-content {
  margin-right: -15px;
  margin-left: -15px;
}


/**
 * Col Items Padding Cat
 */
.padding-cat {
  padding-right: 15px;
  padding-left: 15px;
}
.padding-cat.cat-half.even {
  padding-right: 7.5px;
  padding-left: 15px;
}
.padding-cat.cat-half.odd {
  padding-right: 15px;
  padding-left: 7.5px;
}

.padding-cat.cat-lg { padding-right: 0; padding-left: 0; }
.padding-cat.cat-half.cat-lg.even { padding-left: 0; }
.padding-cat.cat-half.cat-lg.odd  { padding-right: 0; }

@media screen and (max-width: 1119px) {
  .padding-cat.cat-md { padding-right: 0; padding-left: 0; }
  .padding-cat.cat-half.cat-md.even { padding-left: 0; }
  .padding-cat.cat-half.cat-md.odd  { padding-right: 0; }
}
@media screen and (max-width: 991px) {
  .padding-cat.cat-sm { padding-right: 0; padding-left: 0; }
  .padding-cat.cat-half.cat-sm.even { padding-left: 0; }
  .padding-cat.cat-half.cat-sm.odd  { padding-right: 0; }
}
@media screen and (max-width: 767px) {
  .padding-cat.cat-xs { padding-right: 0; padding-left: 0; }
  .padding-cat.cat-half.cat-xs.even { padding-left: 0; }
  .padding-cat.cat-half.cat-xs.odd  { padding-right: 0; }
}


/**
 * Font Size
 */
.font-xs, .font-xsmall { font-size: 10px; }
.font-sm, .font-small { font-size: 13px; }
.font-md, .font-normal { font-size: 16px; }
.font-lg, .font-large { font-size: 18px; }
.font-xl, .font-big { font-size: 20px; }

.font-bold { font-weight: bold; }


/**
 * Header Font Size
 */
h2.head-xs, .head-xs h2, h2.head-xsmall, .head-xsmall h2 { font-size: 13px; }
h2.head-sm, .head-sm h2, h2.head-small , .head-small  h2 { font-size: 15px; }
h2.head-md, .head-md h2, h2.head-normal, .head-normal h2 { font-size: 18px; }
h2.head-lg, .head-lg h2, h2.head-large , .head-large  h2 { font-size: 20px; }
h2.head-xl, .head-xl h2, h2.head-big   , .head-big    h2 { font-size: 22px; }

h3.head-xs, .head-xs h3, h3.head-xsmall, .head-xsmall h3 { font-size: 10px; }
h3.head-sm, .head-sm h3, h3.head-small , .head-small  h3 { font-size: 13px; }
h3.head-md, .head-md h3, h3.head-normal, .head-normal h3 { font-size: 16px; }
h3.head-lg, .head-lg h3, h3.head-large , .head-large  h3 { font-size: 18px; }
h3.head-xl, .head-xl h3, h3.head-big   , .head-big    h3 { font-size: 20px; }

.head-bold h2, .head-bold h3 { font-weight: bold; }


/**
 * Vertical Align
 */
.box { display: flex; }
.box-center { align-items: center; }
.box-top { align-items: top; }
.box-bottom { align-items: bottom; }


/**
 * Margin Align
 */
.margin-center {
  margin-left: auto;
  margin-right: auto;
}
.margin-right {
  margin-left: auto;
  margin-right: 0;
}
.margin-left {
  margin-left: 0;
  margin-right: auto;
}

img.image-center, .image-center img {
  margin-left: auto;
  margin-right: auto;
}
img.image-right, .image-right img {
  margin-left: auto;
  margin-right: 0;
}
img.image-left, .image-left img {
  margin-left: 0;
  margin-right: auto;
}

.margin-top-xs { margin-top: 6px; }
.margin-top-sm { margin-top: 12px; }
.margin-top-md { margin-top: 24px; }
.margin-top-lg { margin-top: 48px; }
.margin-top-xl { margin-top: 96px; }
.margin-bottom-xs { margin-bottom: 6px; }
.margin-bottom-sm { margin-bottom: 12px; }
.margin-bottom-md { margin-bottom: 24px; }
.margin-bottom-lg { margin-bottom: 48px; }
.margin-bottom-xl { margin-bottom: 96px; }

.head-margin-xs h1, h1.head-margin-xs,
.head-margin-xs h2, h2.head-margin-xs,
.head-margin-xs h3, h3.head-margin-xs,
.head-margin-xs h4, h4.head-margin-xs,
.head-margin-xs h5, h5.head-margin-xs,
.head-margin-xs h6, h6.head-margin-xs {
  margin-top: 0;
  margin-bottom: 0;
}
.head-margin-sm h1, h1.head-margin-sm,
.head-margin-sm h2, h2.head-margin-sm,
.head-margin-sm h3, h3.head-margin-sm,
.head-margin-sm h4, h4.head-margin-sm,
.head-margin-sm h5, h5.head-margin-sm,
.head-margin-sm h6, h6.head-margin-sm {
  margin-top: 12px;
  margin-bottom: 6px;
}
.head-margin-md h1, h1.head-margin-md,
.head-margin-md h2, h2.head-margin-md,
.head-margin-md h3, h3.head-margin-md,
.head-margin-md h4, h4.head-margin-md,
.head-margin-md h5, h5.head-margin-md,
.head-margin-md h6, h6.head-margin-md {
  margin-top: 24px;
  margin-bottom: 12px;
}
.head-margin-lg h1, h1.head-margin-lg,
.head-margin-lg h2, h2.head-margin-lg,
.head-margin-lg h3, h3.head-margin-lg,
.head-margin-lg h4, h4.head-margin-lg,
.head-margin-lg h5, h5.head-margin-lg,
.head-margin-lg h6, h6.head-margin-lg {
  margin-top: 36px;
  margin-bottom: 18px;
}


/**
 * Padding
 */
.padding-top-xs { padding-top: 6px; }
.padding-top-sm { padding-top: 12px; }
.padding-top-md { padding-top: 24px; }
.padding-top-lg { padding-top: 48px; }
.padding-top-xl { padding-top: 96px; }
.padding-bottom-xs { padding-bottom: 6px; }
.padding-bottom-sm { padding-bottom: 12px; }
.padding-bottom-md { padding-bottom: 24px; }
.padding-bottom-lg { padding-bottom: 48px; }
.padding-bottom-xl { padding-bottom: 96px; }


/**
 * Button
 */
.btn-block-sm { font-size: 12px; }
.btn-block-md { font-size: 20px; padding: 12px; }
.btn-block-lg { font-size: 24px; padding: 24px; }


/**
 * Border
 */
.border-none { border: 0; }
.border-top-none { border-top: 0; }
.border-bottom-none { border-bottom: 0; }

.border-top-xs { border-top: solid 1px; }
.border-top-sm { border-top: solid 2px; }
.border-top-md { border-top: solid 3px; }
.border-top-lg { border-top: solid 5px; }
.border-bottom-xs { border-bottom: solid 1px; }
.border-bottom-sm { border-bottom: solid 2px; }
.border-bottom-md { border-bottom: solid 3px; }
.border-bottom-lg { border-bottom: solid 5px; }

.border-padding.border-top-xs { padding-top: 6px; }
.border-padding.border-top-sm { padding-top: 6px; }
.border-padding.border-top-md { padding-top: 12px; }
.border-padding.border-top-lg { padding-top: 12px; }
.border-padding.border-bottom-xs { padding-bottom: 6px; }
.border-padding.border-bottom-sm { padding-bottom: 6px; }
.border-padding.border-bottom-md { padding-bottom: 12px; }
.border-padding.border-bottom-lg { padding-bottom: 12px; }


/**
 * Horizontal
 */
.dl-horizontal dt {
  text-align: left;
  width: 100px;
}
.dl-horizontal dd { margin-bottom: 6px; }
@media screen and (min-width: 768px) {
  .dl-horizontal dd { margin-left: 110px; }
}


/**
 * Effect
 */
/** Image Hover Zoom **/
.zoom-img { overflow: hidden; }
.zoom-img img {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}
.zoom-img:hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
}

/** Ander Bar Scale Link **/
.bar-scale a, a.bar-scale { position: relative; }
.bar-scale a::after, a.bar-scale::after {
  content: '';
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 1px;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  background-color: black;
}
.bar-scale a:hover::after, a.bar-scale:hover::after {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

/** Link Transition **/
.trans-link a, a.trans-link {
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
}