@charset "utf-8";

/*
 * File       : sub-product.css
 * Author     : STUDIO-JT (HEE)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 1) 
 */

/* **************************************** *
 * PRODUCT
 * **************************************** */
body.single-product .main_container {padding-bottom: 0;}
body.single.single-product .main_container {padding-bottom: 0;}
body.single-product .wrap {position: relative;}

body.single-product.jt_product_categories_3 .article_visual_bg {background-image: url(../images/sub/visual/product-roll-visual-bg.jpg);}
body.single-product.jt_product_categories_4 .article_visual_bg {background-image: url(../images/sub/visual/product-equipment-visual-bg.jpg);}
body.single-product.jt_product_categories_5 .article_visual_bg {background-image: url(../images/sub/visual/product-ceramic-insulation-visual-bg.jpg);}
body.single-product.jt_product_categories_5 .product_common_section.product_file {padding-bottom: 0; display: none;}
body.single-product.jt_product_categories_5 .product_common_section.product_file:has(.content) {display: block;}
body.single-product .article_visual_title {padding-bottom: 0; text-transform: none;}
body.single-product .article_visual_title span {display: inline-block; vertical-align: middle; font-size: 42px; letter-spacing: -0.02em;}
body.single-product .article_visual_title span.title {font-weight: 300; padding-left: 53px; position: relative;}
body.single-product .article_visual_title span.title:before { content: ''; display: block; width: 1px; height: 29px; background: rgba(255, 255, 255, 0.5); position: absolute; top: 8px; left: 27px; }
body.single-product .article_visual_title span.title:empty:before {display: none;}

.article.product .wrap {position: relative;}
.article.product .article_visual {height: 300px;}
.article.product .article_visual_title {font-size: 42px;}
.article.product .article_visual_bg { background-image: url(../images/sub/visual/product-visual-bg.jpg) }

.product_container h2.product_title { font-size: 40px; font-family: 'Gotham', 'NotoSansKR', sans-serif; font-weight: 500; letter-spacing: -0.025em; line-height: 1.35; margin-bottom: 40px;  text-align: center; text-transform: uppercase;}
.product_container h2.product_title sup { font-size: 27px; vertical-align: top; display: inline-block; margin-top: 5px; margin-left: 5px;}
.product_container h3 sup { display: inline-block; vertical-align: top;}
.product_container p sup { display: inline-block; vertical-align: top;}
.product_container .tabs_component { display: block; }
.product_container .jt_share {padding: 0;}

.product_tab { display: block; font-size: 0; border-bottom: 1px solid #ddd; margin-bottom: 40px; text-align: center; }
.product_tab li { display: inline-block; position: relative;}
.product_tab li a { display: block; font-size: 16px; color: #222; font-family: 'Gotham', 'NotoSansKR', sans-serif; font-weight: 500; line-height: 1.2; padding: 32px 30px; display: block; transition: color 300ms; -webkit-transition: color 300ms}
.product_tab li:before { content: ''; width: 100%; height: 2px; background: #B5121B; display: block; position: absolute; bottom: 0; left: 0; opacity: 0; transition: opacity 300ms; -webkit-transition: opacity 300ms;}
.product_tab li.active:before { opacity: 1; }
.product_tab li.active a { color: #B5121B; }

.product_info { text-align: center; padding-bottom: 120px;}
.product_info:after {content:''; display: block; clear: both;}
.product_info figure { margin-bottom: 58px; }
.product_info_desc {font-size: 17px; line-height: 1.88; margin-top: -20px;}

.product_contact { margin-top: 22px; font-size: 0; margin-bottom: 27px;}
.product_contact a { color: #222; font-family: 'Gotham', 'NotoSansKR', sans-serif; font-weight: 400; line-height: 1.87; position: relative; display: inline-block; font-size: 16px; }
.product_contact a span { margin-right: 10px; vertical-align: middle; display: inline-block;}
.product_contact a span:after { content: ''; font-family: 'jt-font'; color: #B5121B; font-size: 16px; }
html.android .product_contact a span:after { vertical-align:middle;}
.product_contact a.tel {margin-right: 30px;}
.product_contact a.tel span:after { content: '\e947'; }
.product_contact a.mail span:after { content: '\e948'; }

.product_btn_wrap { font-size: 0; margin: 0  -10px;}
.product_btn_wrap a { margin: 0 10px; }

.product_info_section {margin-top: 60px;}
.product_info_section:first-child {margin-top: 0;}

.product_common_section { display: table; width: 100%; padding-bottom: 120px;}
.product_common_section > div { display: table-cell; vertical-align: top; border-top: 1px solid #ddd; padding-top: 40px; }
.product_common_section > div.title { width: 309px; border-color: #B5121B; }
.product_common_section > div.title h3 { font-weight: 700; font-size: 24px; letter-spacing: -0.025em; line-height: 1.5; color: #B5121B; }

.product_common_section > div.content { width: -webkit-calc(100% - 309px); width: calc(100% - 309px); font-size: 0;}
.product_common_section > div.content div.col_list {margin-bottom: 30px;}
.product_common_section > div.content div.col_list:last-child {margin-bottom: 0;}
.product_common_section > div.content div.col_2 { width: -webkit-calc(50% - 17.5px); width: calc(50% - 17.5px); display: inline-block; vertical-align: top; margin-right: 35px; }
.product_common_section > div.content div.col_2:nth-child(2n) {margin-right: 0;}

.product_common_section > div.content > figure + div {margin-top: 28px;}

.product_common_section p { font-size: 16px; margin-bottom: 28px; line-height: 1.75; letter-spacing: -0.025em;}
.product_common_section p:last-child {margin-bottom: 0;}

.product_common_section p > b {display: inline-block; margin-top: 13px;}
.product_common_section p > b:first-child {margin-top: 0;}

.product_common_section small {display: block;}

.product_common_section ol { counter-reset: item; margin-bottom: 30px; }
.product_common_section ol:last-child, .product_common_section ul:last-child {margin-bottom: 0;}
.product_common_section ol > li, .product_common_section ul > li { position: relative; font-size: 16px; line-height: 1.75; margin-bottom: 9px; color: #666; letter-spacing: -0.025em;}
.product_common_section ol > li:last-child, .product_common_section ul > li:last-child { margin-bottom: 0; }
.product_common_section ol > li { padding-left: 30px; }
.product_common_section ol > li:before { counter-increment: item; content: counter(item); width: 20px; height: 20px; display: inline-block; background: #B5121B; color: #fff; border-radius: 50%; text-align: center; line-height: 20px; font-family: 'Gotham', 'NotoSansKR', sans-serif; font-size: 10px; position: absolute; top: 5px; left: 0; font-weight: 300;}

.product_common_section figcaption { font-size: 14px; line-height: 1.43; color: #222; margin-top: 15px; letter-spacing: -0.025em; text-align: left;}
.product_common_section figcaption + figure {margin-top: 30px;}

.product_common_section ul {margin-bottom: 30px;}
.product_common_section ul > li { padding-left: 14px; }
.product_common_section ul > li:before { content: ''; display: block; width: 3px; height: 3px; background: #B5121B; border-radius: 50%; position: absolute; top: 13px; left: 0; }
.product_common_section ul > li > small {line-height: 1.5; font-size: 12px; margin-top: 4px;}
.product_common_section ul > li > small:first-child {margin-top: 0;}

.product_common_section table {border-bottom: 1px solid #ddd; width: 100%;}
.product_common_section table tr th, table tr td { border-right: 1px solid #ddd; width: 20%; font-size: 14px; line-height: 1.43; text-align: center; padding: 21px 18px 19px; vertical-align: middle; color: #222; letter-spacing: -0.025em; }
.product_common_section table tr th:last-child, table tr td:last-child { border-right: 0; }
.product_common_section table thead th { background: #222; color: #fff; }
.product_common_section table tbody tr:nth-child(odd) td { background: #f4f4f4; }
.product_common_section table tbody tr:nth-child(even) td { background: #fff; }
.product_common_section table.topLeft tbody tr td:first-child { background: #444; color: #eee; border-bottom: 1px solid #666; }
.product_common_section table.topLeft tbody tr:last-child td:first-child {border-bottom: 0;}

.product_common_section .table_component_wrap {margin-bottom: 40px;}
.product_common_section .table_component_wrap:last-child {margin-bottom: 0;}

.product_common_section ul + .gallery_list { margin-top: -8px; }
.product_common_section ul + figure { margin-top: -8px; }

.product_common_section .gallery_list { font-size: 0; margin: 0 -18px; margin-bottom: 0;}
.product_common_section .gallery_list:last-child {margin-bottom: -40px;}
.product_common_section .gallery_item { display: inline-block; padding: 0 18px; margin-bottom: 42px; position: relative; vertical-align: top; max-width: 309px; width: 100%;}
.product_common_section .gallery_item figure {max-width: 309px; height: auto;}
.product_common_section .gallery_item span.num { width: 30px; height: 30px; background: #222; position: absolute; top: 0; left: auto; text-align: center; line-height: 30px;}
.product_common_section .gallery_item span.num:before { content: counter(item); color: #fff; font-size: 10px; counter-increment: item; font-family: 'Gotham', 'NotoSansKR', sans-serif; font-weight: 300; }

.product_common_section .gallery_list.type_02 { counter-reset: item; }
.product_common_section .gallery_list.type_02 figcaption { text-align: center; }

.product_common_section .gallery_list > ul.slick-dots { margin-top: 0; margin-bottom: 50px; }
.product_common_section .gallery_list > ul > li { width: 7px; height: 7px; margin-bottom: 0; border: 2px solid #B5121B; background: transparent; margin: 0 3px; padding-left: 0; border-radius: 7px; }
.product_common_section .gallery_list > ul > li:before { display: none; }
.product_common_section .gallery_list > ul > li.slick-active { width: 17px; background: #B5121B}

.product_common_section ul.list_type_02 { margin-top: -32px; }
.product_common_section ul.list_type_02 > li { border-bottom: 1px solid #ddd; margin-bottom: 0;}
.product_common_section ul.list_type_02 > li:last-child {border-bottom: 0;}
.product_common_section ul.list_type_02 > li:before { top: 46px; }
.product_common_section ul.list_type_02 > li a { display: block; color: #666; padding: 32px 0 31px; padding-right: 30px; }
.product_common_section ul.list_type_02 > li a:hover { color: #B5121B; }
.product_common_section ul.list_type_02 > li span {position: relative;}
.product_common_section ul.list_type_02 > li span:before { content: url(../images/sub/product/icon-file-pdf.svg); display: block; position: absolute; top: -8px; left: 16px;}

.product_common_section ul.list_type_03 {padding-top: 8px; }
.product_common_section ul.list_type_03 > li {font-weight: 400; padding-left: 9px;}
.product_common_section ul.list_type_03 > li:before { content: ''; background: #666; width: 5px; height: 1px; top: 16px; line-height: 1; border-radius: 0;}

.product_common_section ul.list_type_04 > li { color: #222; font-weight: 600; }
.product_common_section ul.list_type_04 > li > ul {padding-top: 8px; }
.product_common_section ul.list_type_04 > li > ul > li {font-weight: 400; padding-left: 9px;}
.product_common_section ul.list_type_04 > li > ul > li:before { content: ''; background: #666; width: 5px; height: 1px; top: 16px; line-height: 1; border-radius: 0;}

.product_common_section .multi_list + * {margin-top: 28px;}
.product_common_section .multi_list + .gallery_list {margin-top: 28px;}
.product_common_section .multi_list > .multi_list_item {padding-left: 0; counter-increment: item; margin-top: 28px;}
.product_common_section .multi_list .list_title {font-size: 16px; font-weight: 600; color:#222; padding-left: 14px; position: relative; line-height: 1.75; padding-bottom: 18px;}
.product_common_section .multi_list .list_title:before { content: ''; display: block; width: 3px; height: 3px; background: #B5121B; border-radius: 50%; position: absolute; top: 13px; left: 0;}
.product_common_section .multi_list .list_title:last-child {padding-bottom: 0;}

.product_common_section .multi_list .list_title.type_02 {font-size: 20px; padding-left: 38px; line-height: 1.4; padding-bottom: 30px}
.product_common_section .multi_list .list_title.type_02:before { content: counter(item); width: 28px; height: 28px; color: #fff; text-align: center; line-height: 28px; top: 0; left: 0;font-family: 'Gotham', 'NotoSansKR', sans-serif; font-weight: 400; font-size: 16px; border-radius: 0;}

.product_common_section .multi_list .list_title.type_03 {font-size: 20px; line-height: 1.4; padding-bottom: 30px; padding-left: 0;}
.product_common_section .multi_list .list_title.type_03:before {display: none;}

.product_common_section .multi_list .list_title.type_02 + .cell_list { margin-top: -4px; }
.product_common_section .multi_list .list_title.type_02 + h5 {margin-top: -10px;}
.product_common_section .multi_list .list_title.type_01 + ul { padding-left: 14px; }

.product_common_section .multi_list_item figure + h5 {margin-top: 28px;}
.product_common_section .multi_list_item > ul { padding-top: 0; margin-bottom: 28px; margin-top: -10px;}
.product_common_section .multi_list_item > p {margin-top: -10px; }
.product_common_section .multi_list_item:last-child ul:last-child {margin-bottom: 0;}

.product_common_section .multi_list .cell_list { margin-bottom: 30px;}
.product_common_section .multi_list .cell_list:last-child { margin-bottom: 0; }

.product_common_section .multi_list .gallery_list:last-child {padding-bottom: 36px;}

.product_common_section .multi_list.type_02 .multi_list_item:first-child {padding-top: 0;}
.product_common_section .multi_list.type_02 .multi_list_item {padding: 40px 0; border-bottom:1px solid #ddd;}
.product_common_section .multi_list.type_02 .multi_list_item:last-child {border: 0; padding-bottom: 0;}

.product_common_section .cell_item { display: table; margin-bottom: 30px; }
.product_common_section .cell_item:last-child {margin-bottom: 0;}
.product_common_section .cell_item > * { display: table-cell; vertical-align: top; }
.product_common_section .cell_item_img { width: 273px; }
.product_common_section .cell_item_content { padding-left: 36px; width: -webkit-calc(100% - 273px); width: calc(100% - 273px); padding-top: 10px;}
.product_common_section .cell_item_content ul > li { margin-bottom: 5px; }
.product_common_section .cell_item_content ul > li:last-child {margin-bottom: 0;}
.product_common_section .cell_item_content b { font-size:  16px; color: #222; font-weight: 600; display: block; padding-bottom: 4px;}
.product_common_section .cell_item_content b:last-child {padding-bottom: 0;}

.product_common_section br.small_screen_br {display: none;}
.product_common_section br.keep_br {display: block;}

/* PRODUCT - list */
.product_list .article_visual { height:300px;}
.product_list .article_visual_bg{ background-image: url(../images/sub/visual/product-list-visual-bg.jpg); }

.krst_product.krst_section { padding-top: 172px; }
.krst_product_tab {font-size: 0; text-align: center; border-bottom: 1px solid #ddd; padding: 0 30px;}
.krst_product_tab > .krst_product_tab {border: 0;}
.krst_product_tab > li {display: inline-block;position: relative;}
.krst_product_tab > li.active > a { color: #B5121B }
.krst_product_tab > li.active:after { content: ''; display: block; width: 100%; height: 4px; background: #B5121B; position: absolute; bottom: -1px; left: 0; }
.krst_product_tab > li > a {display: block;font-family: 'Gotham', 'NotoSansKR', sans-serif;font-size: 16px;font-weight: 500;color: #222;line-height: 1.12;padding: 31px 19px 30px;}

.krst_product_list {font-size: 0;margin: 0 -1.5%;margin-top:-10px;}
.krst_product_item {display: inline-block; vertical-align: top; margin: 0 1.5%;width: 30.3%;margin-top:60px;}
.krst_product_item_link { display: block; cursor: pointer; }
.krst_product_item figure { position: relative; display: block; width:376px;height:200px; }
.krst_product_item figure:before { content: ''; display: block; width: 100%; height: 100%; -webkit-box-shadow: 0px 0px 0px 1px #B5121B; box-shadow: 0px 0px 0px 1px #B5121B; position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; transition: opacity 300ms; -webkit-transition: opacity 300ms;}
.krst_product_item figure img { width:100%; height:100%;}
.krst_product_item p {font-family: 'Gotham', 'NotoSansKR', sans-serif;font-size: 16px;font-weight: 500;color: #666;margin-top: 25px;line-height: 1.1;transition: color 300ms;-webkit-transition: color 300ms;}
.krst_product_btn_wrap { text-align: center; }

html.desktop .krst_product_item_link:hover figure:before {opacity: 1;}
html.desktop .krst_product_item_link:hover p { color: #B5121B; }