@charset "utf-8";

/*
 * File       : sub-cases.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 1) MODULE
 * 2) SINGLE
 */



/* **************************************** *
 * MODULE
 * **************************************** */
.jt-case-list-wrap {position: relative;border-top: 1px solid #000;}
.jt-case-list-wrap:before, .jt-case-list-wrap:after {content: '';display: block;width: 1px;height: 100%;position: absolute;top: 0;background: #000;z-index: 1;}
.jt-case-list-wrap:before {left: 33.33%;}
.jt-case-list-wrap:after {right: 33.33%;}

.jt-case-list {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-align-content: stretch;-ms-flex-line-pack: stretch;align-content: stretch;position: relative;z-index: 2;}
.jt-case-list__item {width: 33.33%;padding: 107rem 107rem;position: relative;border-top: 1px solid #000;}
.jt-case-list__item:nth-child(1), .jt-case-list__item:nth-child(2), .jt-case-list__item:nth-child(3) {border-top: none;}
.jt-case-list__link {display: block;max-width: 384rem;margin: 0 auto;}
.jt-case-list__thumb {position: relative;}
.jt-case-list__thumb .jt-lazyload {padding-top: 100%;}
.jt-case-list__thumb--base {position: relative;z-index: 1;}
.jt-case-list__thumb--hover {width: 100%;height: 100%;position: absolute;top: 0;left: 0;overflow: hidden;opacity: 0;-webkit-transition: opacity .3s cubic-bezier(0,0,.58,.32);transition: opacity .3s cubic-bezier(0,0,.58,.32);z-index: 2;}
.jt-case-list__txt {margin-top: 20rem;}
.jt-case-list__txt .jt-heading--03 > span {border-bottom: 1px solid transparent;-webkit-transition: border .3s;transition: border .3s;}
html.desktop .jt-case-list__link:hover .jt-case-list__thumb--hover {opacity: 1;}
html.desktop .jt-case-list__link:hover .jt-case-list__txt .jt-heading--03 > span {border-bottom-color: #000;}

/* count detail */
.jt-case-list--type1 .jt-case-list__item:nth-last-child(2):after,
.jt-case-list--type1 .jt-case-list__item:nth-last-child(3):after,
.jt-case-list--type2 .jt-case-list__item:nth-last-child(3):after {content: '';display: block;width: 100%;height: 1px;position: absolute;left: 0;bottom: -1px;background: #000;}

/* back to list */
.jt-case-list__item--backlist .jt-case-list__link {padding: 0 30rem;position: absolute;top: 50%;left: 50%;text-align: center;-webkit-transform: translate3d(-50%, -50%, 0);transform: translate3d(-50%, -50%, 0);}
.jt-case-list__illust {width: 70rem;margin: 0 auto 29rem;}
.jt-case-list__illust svg {display: block;width: 100%;height: auto;}



/* **************************************** *
 * SINGLE
 * **************************************** */
.case-single__section-title {margin-bottom: 28rem;}

/* VISUAL */
.case-single__visual-picture {overflow: hidden;}
.case-single__visual-title {margin-bottom: 28rem;}

/* INFORMATION */
.case-single__info {margin-top: 59rem;}
.case-single__info:after {content: '';display: table;clear: both;}

.case-single__info-txt {float: left;width: -webkit-calc(100% - 808rem);width: calc(100% - 808rem);padding-top: 3rem;}
.case-single__info-txt .jt-text--05 {margin-top: 19rem;}

.case-single__info-meta {float: right;width: 708rem;}
.case-single__info-meta table {width: 100%;table-layout: fixed;border-top: 1rem solid #000;}
.case-single__info-meta th, .case-single__info-meta td {padding: 12rem 30rem 9rem;border-bottom: 1rem solid #000;}
.case-single__info-meta th {width: 241rem;vertical-align: top;border-right: 1rem solid #000;}
.case-single__info-meta td {width: auto;vertical-align: middle;}
.case-single__info-meta td .jt-text--07 {-webkit-font-feature-settings: 'tnum';-moz-font-feature-settings: 'tnum';font-feature-settings: 'tnum';}
.case-single__info-meta .jt-btn__basic {float: right;margin-top: 32rem;}

/* GALLERY */
.case-single__gallery {margin-top: 300rem;}
.case-single__gallery:after {content: '';display: table;clear: both;}
.case-single__gallery > *:first-child {margin-top: 0;}

.case-single__picture {margin-top: 120rem;}
.case-single__picture img {display: block;width: 100%;height: auto;}
.case-single__picture p {margin-top: 20rem;}
.case-single__picture--primary {float: left;width: 57%;max-width: 1020rem;}
.case-single__picture--secondary {float: right;width: 74%;max-width: 1332rem;}
.case-single__picture--third {float: left;width: 100%;max-width: 1800rem;}

/* VIDEO */
.case-single__video {margin-top: 300rem;}

.case-video-slider {margin: 0 -60rem;}
.case-video-slider .swiper-container {overflow: visible;}
.case-video-item {display: inline-block;vertical-align: top;width: 1240rem;padding: 0 36rem;}
.case-video-item:first-child {margin-left: 24rem;}
.case-video-item:last-child {margin-right: 24rem;}
.case-video-slider .swiper-control {margin-left: 0;bottom: inherit;left: inherit;top: -64rem;right: 48rem;}

.case-video-item__poster {display: block;width: 100%;position: relative;}
.case-video-item__poster .jt-lazyload {padding-top: 56.25%;}
.case-video-item__poster:after {content: '';display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: #000000;background: rgba(0, 0, 0, .3);opacity: 0;-webkit-transition: opacity .3s;transition: opacity .3s;z-index: 1;}
.case-video-item__poster-icon {width: 80rem;height: 80rem;position: absolute;top: 50%;left: 50%;margin-top: -40rem;margin-left: -40rem;z-index: 2;}
.case-video-item__poster-icon:after {display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;font-family: 'jt-font';content: '\e900';font-size: 80rem;line-height: 1;text-indent: 1rem;font-weight: normal;font-style: normal;text-align: center;color: #fff;}
html.desktop .case-video-item__poster:hover:after {opacity: 1;}

.case-video-item__txt {margin-top: 21rem;}

/* MORE */
.case-single__more {margin-top: 400rem;}

/* gotop */
.case-single__gotop {display: block;width: 42rem;position: fixed;top: 40rem;right: 54rem;text-align: center;cursor: pointer;-webkit-transition: opacity 0.3s;transition: opacity 0.3s;z-index: 999;}
.case-single__gotop .jt-guide--icon {width: 16rem;margin: 0 auto 6rem;}
.case-single__gotop > span {display: inline-block;position: relative;}
.case-single__gotop > span:after {content: '';display: block;width: 100%;height: 1rem;position: absolute;left: 0;bottom: 2rem;background: #000;-webkit-transform-origin: 100% 50%;-ms-transform-origin: 100% 50%;transform-origin: 100% 50%;-webkit-transform: scale3d(0, 1, 1);transform: scale3d(0, 1, 1);-webkit-transition: -webkit-transform .3s;transition: -webkit-transform .3s;transition: transform .3s;transition: transform .3s, -webkit-transform .3s;}
html.desktop .case-single__gotop:hover > span:after {-webkit-transform-origin: 0% 50%;-ms-transform-origin: 0% 50%;transform-origin: 0% 50%;-webkit-transform: scale3d(1, 1, 1);transform: scale3d(1, 1, 1);}

.case-single__gotop.case-single__gotop--hide {opacity: 0;z-index: -1;}
.case-single__gotop.case-single__gotop--clear {opacity: 0;z-index: -1;}

/* CONTACT */
.case-single__contact {margin-top: 120rem; text-align: center;}