@charset "utf-8";
/* CSS Document */
.ud.english{ padding-bottom: 0;}
.gallery-wrapper .screen{ max-width: 1440px; margin: 0 auto;}
/* thumb */
.gallery-wrapper .thumb{ padding: 70px 0; background-color: #313e5b;}
.gallery-wrapper .thumb .inner{ width: 852px; margin: 0 auto; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; text-align: center;}
.gallery-wrapper .thumb .inner.over-w a:after{ -webkit-transform: translateY(101%); transform: translateY(101%);}
.gallery-wrapper .thumb .inner.over-w a:hover:after, .gallery-wrapper .thumb .inner.over-w a:focus:after{ -webkit-transform: translateY(0); transform: translateY(0);}
.gallery-wrapper .thumb .inner li{ width: 14%; max-width: 120px; margin-right: 7.3%; position: relative;}
.gallery-wrapper .thumb .inner li a{ display: block; height: 0; padding-top: 66.6%; position: relative; overflow: hidden;}
.gallery-wrapper .thumb .inner li a img{ position: absolute; width: 146%; max-width: none; top: 0; left: -23%;}
.gallery-wrapper .thumb .inner li:last-child{ margin-right: 0;}
.gallery-wrapper .thumb .inner li a img{ opacity: .6;}
.gallery-wrapper .thumb .inner li.g-active a img{ opacity: 1;}
.gallery-wrapper .thumb .inner li.g-active:before{ content: ""; display: block; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: -20px; left: 0;}
.gallery-wrapper .thumb .inner li.g-active a:hover:after{ display: none;}
@media screen and (max-width:960px){
.gallery-wrapper .thumb{ padding: 35px 0;}
.gallery-wrapper .thumb .inner{ width: 100%; margin: 0; padding: 0 20px; -webkit-box-sizing: border-box; box-sizing: border-box;}
.gallery-wrapper .thumb .inner li{ margin-right: 5%;}
}
@media screen and (max-width:720px){
.gallery-wrapper .thumb{ background-color: #fff;}
.gallery-wrapper .thumb .inner li{ width: 17.9%; margin-right: 2.5%;}
.gallery-wrapper .thumb .inner li.g-active:before{ background-color: #313e5b; bottom: -10px;}
}