@charset "utf-8";

/*
 * File       : a-sub.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *
 * SUMMARY:
 * 1) product
 */



/* **************************************** *
 * product
 * **************************************** */
body.sub_product_page_a .main_container {padding-bottom: 0;}

.product_visual {width: 100%;height: 953px;position: relative;overflow: hidden;}
.product_visual_bg {position: absolute;top: 0;bottom: 0;left: 0;right: 0;background: no-repeat center center;background-size: cover;}
.product_visual_bg:after {content: '';position: absolute;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.22);transition: opacity 300ms;}
.product_visual_bg.load_complete:after {opacity: 0;}
.product_visual_txt {position: absolute;left: 190px;bottom: 149px;}
.product_visual_txt h2 {font-size: 80px;font-weight: 400;letter-spacing: 0.2em;line-height: 1.125;text-indent: -7px;color: #fff;opacity: 0;}
.product_visual_txt p {margin-top: 5px;font-size: 16px;font-weight: 300;letter-spacing: 0.05em;line-height: 1.63;color: #fff;opacity: 0;}

.product_visual_loading {width: 208px;height: 208px;position: absolute;left: 50%;top: 50%;margin-top: -104px;margin-left: -104px;z-index: 10;border: 2px solid rgba(255, 255, 255, 0.3);border-radius: 50%;}
.product_visual_loading > span {display: block;margin-left: 0.1em;font-size: 30px;font-weight: 600;letter-spacing: 0.2em;line-height: 208px;text-align: center;color: #fff;}
.product_visual_loading > svg {position: absolute;top: -2px;bottom: -2px;left: -2px;right: -2px;}
#product_visual_loading_line {visibility: hidden;}

.product_detail {padding: 129px 0 154px;}
.product_detail h3 {margin-bottom: 115px;margin-left: 0.2em;font-size: 45px;font-weight: 500;letter-spacing: 0.2em;line-height: 1.33;text-align: center;color: #222;}

.product_detail_table {display: table;width: 100%;}
.product_detail_cell {display: table-cell;vertical-align: middle;}
.product_detail_cell:first-child {width: calc(100% - 740px);padding-left: 82px;}
.product_detail_cell:last-child {width: 740px;}
.product_detail_cell img {display: block;margin: 0 auto;}
.product_detail_cell b {display: block;margin-bottom: 21px;font-size: 36px;font-weight: 500;letter-spacing: 0.1em;line-height: 1.25;color: #222;}
.product_detail_cell p {font-size: 16px;font-weight: 300;letter-spacing: 0.05em;line-height: 1.63;color: #666;}
.product_detail_cell .jt_btn {margin-top: 56px;}

.product_banner {padding: 135px 0 162px;position: relative;background: no-repeat center center;background-size: cover;background-attachment: fixed;}
.product_banner h3 {font-size: 36px;font-weight: 400;letter-spacing: 0.1em;text-align: center;color: #fff;}
.product_banner ul {margin-top: 86px;}
.product_banner ul:after {content: '';display: table;clear: both;}
.product_banner ul > li {float: left;width: 33.33%;height: 206px;padding: 0 15px;position: relative;text-align: center;border-right: 1px solid rgba(255,255,255,0.52);}
.product_banner ul > li > span {display: block;padding-bottom: 27px;font-size: 18px;font-weight: 500;color: #fff;}
.product_banner ul > li > b {display: block;font-size: 18px;font-weight: 500;letter-spacing: 0.05em;line-height: 1.5;color: #fff;}
.product_banner ul > li > p {font-size: 16px;font-weight: 300;letter-spacing: 0.05em;line-height: 1.63;color: #fff;}
.product_banner ul > li:last-child {border-right: none;}

.product_story {padding: 130px 0 200px;}
.product_detail_table.secondary .product_detail_cell:first-child {width: calc(100% - 610px);padding-left: 0;padding-right: 140px;}
.product_detail_table.secondary .product_detail_cell:last-child {width: 610px;}

.product_first_visual .product_visual_bg {transform: translateZ(0) scale(1.1) rotate(0.1deg);transition: 2500ms;transition-timing-function: cubic-bezier(0.165, 0.840, 0.440, 1.000);}
.product_first_visual .product_visual_bg:after {display: none;}
.product_first_visual.bg_loaded .product_visual_bg {transform: translateZ(0) scale(1) rotate(0deg);}

.product_group_01 .product_visual_bg {background-image: url(../images/type-a/prod-01-visual.jpg);}
.product_group_01 .product_banner {background-image: url(../images/type-a/prod-01-banner.jpg);}

.product_group_02 .product_visual_bg {background-image: url(../images/type-a/prod-02-visual.jpg);}
.product_group_02 .product_banner {background-image: url(../images/type-a/prod-02-banner.jpg);}
