.showindex__parent {
  display: flex;
  flex-wrap: wrap;
}

.showindex__children {
  /* Mobile: 2 columns by default */
  width: calc(50% - 20px);
  margin: 10px;
}

@media (min-width: 769px) {
  .showindex__children {
    /* Desktop: 6 columns, with !important to override other styles */
    width: calc(16.6666% - 20px) !important;
  }
}

.album1__main {
  margin-bottom: 4px
}

.album1__detail {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, .6);
  transition: top .2s;
  text-align: center;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 1em;
  line-height: 1.3;
  overflow: auto
}

.album1__photonumber {
  margin-top: .5em
}

.album1__main:focus,
.album1__main:hover {
  box-shadow: 0 1px 2px #9f9f9f
}

.album1__main:focus .album1__detail,
.album1__main:hover .album1__detail {
  top: 0
}

.album3__main {
  display: block
}

.album3__photoswrap {
  font-size: 0;
  margin-top: 6px
}

.album3__img {
  padding: 1px;
  color: #49bc85
}

.album3__title {
  font-size: 16px;
  font-weight: bold;
  margin: .5em 0;
  line-height: 1.3;
  max-height: 2.5em;
  overflow: hidden
}

.album3__price {
  font-size: 14px;
  color: #c00;
  font-weight: bold;
  margin-top: 5px;
}

.album3__squareWrap {
  height: 0;
  position: relative;
  width: 22.8%;
  padding-top: 20.8%;
  display: inline-block;
  margin-right: 2%;
  border: 2px solid transparent
}

.album3__squareWrap img {
  padding: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  object-fit: cover;
  display: inline-block
}

.album3__squareWrap .album3__lock {
  width: 15px;
  height: 19px;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  object-fit: cover;
  display: inline-block
}

.album3__loading {
    width: auto;
    height: auto;
    text-align: center;
    font-size: 16px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: none;
    margin: 0 auto;
    transform: translate(-50%, -50%);
    color: #49bc85;
}

.album3__loading::after {
    content: 'loading...';
    animation: loading-dots 1.5s infinite;
}

@keyframes loading-dots {
    0%, 20% {
        content: 'loading.';
    }
    40% {
        content: 'loading..';
    }
    60% {
        content: 'loading...';
    }
    80%, 100% {
        content: 'loading...';
    }
}

.album3__showmore {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ececec;
  color: #9f9f9f;
  text-align: center;
  z-index: 2;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center
}

.album3__showmore .album3__more {
  display: inline-block;
  padding-bottom: .57em;
  border-bottom: 1px solid #cfcfcf;
  margin-bottom: .57em
}

.show-layout-category__catewrap {
  width: 100%;
  padding: 1.6em 1.4em .7em;
  margin: 0 auto
}

.show-layout-category__catewrap+.show-layout-category__emptypage {
  padding: 3% 0;
  min-height: 5em
}

.show-layout-category__catewrap .show-layout-category__catetitle {
  text-transform: none;
  font-size: 1.37em;
  margin-bottom: 1.5em;
  display: inline-block
}

.show-layout-category__catewrap .show-layout-category__catetitle:before {
  content: "";
  display: inline-block;
  height: 1em;
  vertical-align: -.13em;
  width: 4px;
  margin-right: .45em;
  background: #49bc85
}

@media (max-width:640px) {
  .show-layout-category__catewrap {
    padding: 0
  }

  .show-layout-category__catewrap .show-layout-category__catetitle {
    font-size: 1em;
    margin: .3em 0 1em
  }
}

.showindex__gallerycardwrap {
  box-sizing: border-box;
  width: 100%;
  padding: 1.3em 2em 0;
  table-layout: fixed;
  display: table;
  margin: 0 auto;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 1440px;
  position: relative
}

.showindex__topTip {
  display: none;
  text-align: center;
  color: #444;
  font-size: 14px;
  padding: .7em 1em;
  background: #fffaeb;
  border: 1px solid #fbedc4;
  line-height: 1.5
}

.showindex__topTip a {
  color: #49bc85
}

@media (min-width:0px) {
  .showindex__gallerycardwrap {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
  }
}

.album2__main {
  height: 200px;
  overflow: hidden;
  border: 1px solid #f0f0f0;
  width: auto
}

.album2__main p {
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -2em;
  line-height: 2;
  padding: 0 .5em;
  transition: bottom .2s;
  background: rgba(0, 0, 0, .5);
  color: #fff
}

.album2__main:hover p {
  bottom: 0
}

.show-layout-waterfall__col {
  display: inline-block;
  vertical-align: top
}

.show-layout-waterfall__col+.show-layout-waterfall__col {
  margin-left: 16px
}

.show-layout-waterfall__main {
  display: block;
  margin-bottom: 16px;
  border: 2px solid #ececec
}

.show-layout-waterfall__main:hover {
  border-color: #49bc85
}

.show-layout-waterfall__main img {
  width: 100%
}

.show-layout-waterfall__main p {
  line-height: 1.3
}

.show-layout-waterfall__description,
.show-layout-waterfall__name {
  margin: 12px 6px
}

.show-layout-waterfall__description {
  font-size: 12px;
  max-height: 3.9em;
  overflow: hidden
}

.show-layout-timeline__template {
  display: none
}

.show-layout-timeline__title {
  position: relative;
  font-size: 22px;
  margin: .8em 0;
  white-space: nowrap
}

.show-layout-timeline__title:before {
  content: "";
  border-radius: 50%;
  width: .5em;
  height: .5em;
  position: absolute;
  top: .35em;
  left: -1em;
  background: #49bc85
}

.show-layout-timeline__container {
  position: relative
}

.show-layout-timeline__timeline {
  font-size: 22px;
  position: absolute;
  top: 1.35em;
  left: -.75em;
  width: 2px;
  height: 100%;
  height: calc(100% - 2em);
  margin-left: -1px;
  background: #ececec
}

.show-layout-timeline__loading {
    margin: 1em auto 3em;
    width: auto;
    height: auto;
    text-align: center;
    font-size: 16px;
    color: #49bc85;
}

.show-layout-timeline__loading::after {
    content: 'loading...';
    animation: loading-dots 1.5s infinite;
}

.show-layout-timeline__error,
.show-layout-timeline__loaded {
  display: none;
  text-align: center;
  margin: 1em auto 3em;
  height: 2em
}

.show-layout-timeline__loaded {
  color: #cfcfcf
}

.show-layout-timeline__error button {
  padding: .45em 2em;
  margin-right: 0
}

@media (max-width:640px) {

  .show-layout-timeline__timeline,
  .show-layout-timeline__title:before {
    display: none
  }
}

.album4__main {
  position: relative;
  border: 1px solid #d6d6d6
}

.album4__main,
.album4__main:hover {
  box-shadow: 0 1px 2px #d6d6d6
}

.album4__main:before {
  bottom: -4px;
  border: inherit
}

.album4__title {
  background: none;
  height: 2.6em;
  line-height: 1.3em;
  word-break: break-all;
  overflow: hidden;
  margin: .8em 0;
  font-size: .85em
}

.pagination {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  margin: 40px 0;
  text-align: center;
  width: 100%;
}

.pagination .nav-links {
  display: inline-flex;
  gap: 8px;
}

.pagination .page-numbers {
  display: inline-block;
  padding: 10px 18px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  color: #555;
  background-color: #f0f0f0;
  text-decoration: none;
  transition: background-color 0.3s, color 0.3s;
}

.pagination .page-numbers:hover {
  background-color: #e0e0e0;
  color: #333;
}

.pagination .page-numbers.current {
  background-color: #49bc85;
  color: #fff;
  font-weight: 700;
  cursor: default;
}

.pagination .page-numbers.dots {
  background-color: transparent;
  color: #999;
  padding: 10px 8px;
}

.pagination .prev,
.pagination .next {
  padding: 10px 12px;
}