/* --------------------------------------------------
autmun / winter 2018 collection
-------------------------------------------------- */
@-webkit-keyframes fade { 0% { opacity: 0; }
  100% { opacity: 1; } }
@keyframes fade { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes slideLeft { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; }
  100% { -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0); opacity: 1; } }
@keyframes slideLeft { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; }
  100% { -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0); opacity: 1; } }
@-webkit-keyframes left { 0% { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); opacity: 1; }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } }
@keyframes left { 0% { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); opacity: 1; }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } }
@-webkit-keyframes slideRight { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; }
  100% { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); opacity: 1; } }
@keyframes slideRight { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; }
  100% { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); opacity: 1; } }
@-webkit-keyframes right { 0% { -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0); opacity: 1; }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } }
@keyframes right { 0% { -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0); opacity: 1; }
  100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); opacity: 1; } }
body #wrapper #content { padding: 0 13px; margin: 0 0 25px; }
body #wrapper #content h2 { font-size: 2.8rem; margin: 0 0 20px; }
body #wrapper #content h2 span { display: block; font-size: 3.2rem; margin: 17px 0 0; }
body #wrapper #content #image_wrapper { margin: 0 0 45px; }
body #wrapper #content #image_wrapper div.image_post { opacity: 0; transition: -webkit-transform .4s ease 0s; transition: transform .4s ease 0s; transition: transform .4s ease 0s, -webkit-transform .4s ease 0s; }
body #wrapper #content #image_wrapper div.image_post.is-show { -webkit-animation: fade 1s ease 0s forwards; animation: fade 1s ease 0s forwards; }
body #wrapper #content #image_wrapper div.image_post.is-show.left { -webkit-animation: left .8s ease 0s forwards; animation: left .8s ease 0s forwards; }
body #wrapper #content #image_wrapper div.image_post.is-show.right { -webkit-animation: right .8s ease 0s forwards; animation: right .8s ease 0s forwards; }
body #wrapper #content #image_wrapper div.image_post.is-show.slide.left { -webkit-animation: slideLeft .8s ease 0s forwards; animation: slideLeft .8s ease 0s forwards; }
body #wrapper #content #image_wrapper div.image_post.is-show.slide.right { -webkit-animation: slideRight .8s ease 0s forwards; animation: slideRight .8s ease 0s forwards; }
body #wrapper #content #image_wrapper div.image_post.slide { -webkit-transform: translate(-100%, 0); transform: translate(-100%, 0); }
body #wrapper #content #image_wrapper li.image_post { opacity: 0; margin: 0 0 13px; overflow: hidden; }
body #wrapper #content #image_wrapper li.image_post .gallery-caption { font-size: 2.3rem; line-height: 1.3; margin: 6px 0 0; }
body #wrapper #content #image_wrapper li.image_post .slider_pager { position: absolute; top: 50%; -webkit-transform: translate(0, -50%); transform: translate(0, -50%); right: 5px; padding: 5px; }
body #wrapper #content #image_wrapper li.image_post .slider_pager a { display: block; }
body #wrapper #content #image_wrapper li.image_post .slider_pager a::after { display: block; content: ""; border-left: solid 11px; border-top: solid 15px transparent; border-bottom: solid 15px transparent; height: 0; }
body #wrapper #content #image_wrapper li.image_post.is-show { -webkit-animation: fade 1s ease 0s forwards; animation: fade 1s ease 0s forwards; }
body #wrapper #content #image_wrapper li.image_post:nth-child(1) { position: relative; }
body #wrapper #content #image_wrapper li.image_post:nth-child(1) .image_post { position: absolute; bottom: 0; left: 0; right: 0; }
body #wrapper #content #image_wrapper.show-1 .image_post:nth-child(n+20) { display: none; }
body #wrapper #content #image_wrapper.show-2 .image_post:nth-child(-n+19), body #wrapper #content #image_wrapper.show-2 .image_post:nth-child(n+36) { display: none; }
body #wrapper #content .pager { display: flex; justify-content: center; }
body #wrapper #content .pager li { font-size: 5rem; font-weight: bold; padding: 0 12px 3px 0; position: relative; color: #898989; }
body #wrapper #content .pager li::after { display: block; content: ""; position: absolute; bottom: 0; right: 0; height: 2px; width: 12px; background: #898989; }
body #wrapper #content .pager li.current { color: #231815; }
body #wrapper #content .pager li.current a { pointer-events: none; }
body #wrapper #content .pager li:last-child { padding: 0; }
body #wrapper #content .pager li:last-child::after { display: none; }
body #wrapper #content .child_page_pager { display: none; }
body #wrapper #content .to_collection_top { margin: 20px 0 0; font-size: 3.4rem; text-align: center; color: #898989; }

@media screen and (min-width: 769px) { body #wrapper #content { padding: 0; margin: 0 0 140px; }
  body #wrapper #content h2 { font-size: 1.6rem; margin: 0 0 30px; }
  body #wrapper #content h2 span { display: inline-block; margin: 0 0 0 .5em; font-size: 1em; }
  body #wrapper #content #image_wrapper { margin: 0; position: relative; padding-top: 291.69%; }
  body #wrapper #content #image_wrapper li.image_post { margin: 0; display: block !important; position: absolute; width: 19.62%; }
  body #wrapper #content #image_wrapper li.image_post img { width: 100% !important; }
  body #wrapper #content #image_wrapper li.image_post .gallery-caption { font-size: 1rem; line-height: 1.25; margin: 4px 0 0; }
  body #wrapper #content #image_wrapper li.image_post.is-show { -webkit-animation: none; animation: none; opacity: 1; transition: opacity 1s ease 0s; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(1) { position: absolute; left: 17.15%; top: 0%; z-index: 35; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(2) { left: 35%; top: 1.05%; z-index: 34; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(3) { left: 54.46%; top: 2.61%; z-index: 33; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(4) { left: 70.46%; top: 4.38%; z-index: 32; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(5) { left: 57.77%; top: 12.18%; z-index: 29; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(6) { left: 36.15%; top: 10.81%; z-index: 30; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(7) { left: 19.85%; top: 12.29%; z-index: 28; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(8) { left: 12.62%; top: 18.91%; z-index: 31; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(9) { left: 33.54%; top: 20.2%; z-index: 25; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(10) { left: 54.62%; top: 20.83%; z-index: 26; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(11) { left: 70.31%; top: 23.39%; z-index: 27; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(12) { left: 14.92%; top: 28.48%; z-index: 16; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(13) { left: 30.23%; top: 30.49%; z-index: 13; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(14) { left: 51.92%; top: 30.67%; z-index: 20; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(15) { left: 69.23%; top: 32.3%; z-index: 15; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(16) { left: 14.77%; top: 38.71%; z-index: 17; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(17) { left: 32.08%; top: 40.64%; z-index: 14; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(18) { left: 70.69%; top: 43.33%; z-index: 18; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(19) { left: 53.46%; top: 40.59%; z-index: 19; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(20) { left: 14.77%; top: 48.6%; z-index: 24; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(21) { left: 31.08%; top: 50.45%; z-index: 23; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(22) { left: 53.62%; top: 50.69%; z-index: 22; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(23) { left: 70.85%; top: 54.01%; z-index: 21; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(24) { left: 41.77%; top: 62.05%; z-index: 11; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(25) { left: 57.85%; top: 60.44%; z-index: 12; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(26) { left: 23.62%; top: 60.21%; z-index: 10; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(27) { left: 8.46%; top: 64%; z-index: 9; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(28) { left: 42.77%; top: 71.55%; z-index: 7; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(29) { left: 25.38%; top: 69.96%; z-index: 8; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(30) { left: 61.85%; top: 73%; z-index: 6; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(31) { left: 63.08%; top: 83.81%; z-index: 4; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(32) { left: 47.62%; top: 81.2%; z-index: 5; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(33) { left: 9.62%; top: 76.64%; z-index: 3; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(34) { left: 23.08%; top: 83.99%; z-index: 2; }
  body #wrapper #content #image_wrapper li.image_post:nth-child(35) { left: 39.23%; top: 90.93%; z-index: 1; }
  body #wrapper #content .pager { display: none; }
  body #wrapper #content .slider_pager { display: none; }
  body #wrapper #content .child_page_pager { display: flex; justify-content: center; margin: 110px 0 0; }
  body #wrapper #content .child_page_pager li { font-size: 2.8rem; font-weight: bold; padding: 0 12px 3px 0; position: relative; color: #898989; }
  body #wrapper #content .child_page_pager li::after { display: block; content: ""; position: absolute; bottom: 0; right: 0; height: 2px; width: 12px; background: #898989; }
  body #wrapper #content .child_page_pager li.current { color: #231815; }
  body #wrapper #content .child_page_pager li.current a { pointer-events: none; }
  body #wrapper #content .child_page_pager li:last-child { padding: 0; }
  body #wrapper #content .child_page_pager li:last-child::after { display: none; }
  body #wrapper #content .to_collection_top { display: none; } }