@charset "utf-8";
/*
 * File       : component.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 1) TABS
 * 2) SITEMAP
 * 3) MEMBER
 * 4) SHARE
 * 5) SINGLE PAGINATION
 * 6) CONTACT FROM 7
 * 7) SLICK
 * 8) CYCLE
 * 9) MAGNIFIC POPUP
 */
/* **************************************** *
 * CSS Variables
 * **************************************** */
/* **************************************** *
 * TABS
 * **************************************** */
/* TABS */
.tabs_menu li { width: 50%; }
.tabs_num_2 .tabs_menu li { width: 50%; }
.tabs_num_3 .tabs_menu li { width: 33.3333333333%; }
.tabs_num_4 .tabs_menu li { width: 25%; }
.tabs_num_5 .tabs_menu li { width: 20%; }
.tabs_num_6 .tabs_menu li { width: 16.6666666667%; }
.tabs_num_7 .tabs_menu li { width: 14.2857142857%; }
.tabs_num_8 .tabs_menu li { width: 12.5%; }
.tabs_num_9 .tabs_menu li { width: 11.1111111111%; }
.tabs_num_10 .tabs_menu li { width: 10%; }
.tabs_num_11 .tabs_menu li { width: 9.09090909091%; }
.tabs_num_12 .tabs_menu li { width: 8.33333333333%; }
.tabs_menu {float: left;width: 100%;margin: 0 auto 60px;overflow: hidden;}
.tabs_menu li {float: left;position: relative;}
.tabs_menu li:before {content: '';display: block;width: 1px;height: 31px;position: absolute;left: 0;top: 50%;background: #ddd;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
.tabs_menu li:first-child:before {display: none;}
.tabs_menu li:after {content: '';display: block;width: 100%;height: 3px;position: absolute;left: 0;bottom: 0;}
.tabs_menu li a {display: block;width: 100%;height: 95px;line-height: 95px;font-size: 34px;font-weight: 400;text-align: center;color: #222;}
.tabs_menu li.active:after {background: #1c9ad6;}
.tabs_panels {float: left;width: 100%;}
.tabs_panels > div {display: none;}
.tabs_panels > div:first-child {display: block;}
.tabs_component:after {content: '';display: table;clear: both;}
/* **************************************** *
 * SITEMAP
 * **************************************** */
.sitemap_menu {margin: 0 -15px;}
.sitemap_menu > li {float: left;width: 25%;padding: 0 15px;margin-bottom: 80px;}
.sitemap_menu > li:nth-child(4n+1) {clear: both;}
.sitemap_menu li a {display: block;}
.sitemap_menu > li > a {margin-bottom: 10px;padding-bottom: 12px;font-size: 20px;line-height: 1.4;font-weight: 600;color: #222;border-bottom: 2px solid #ddd;}
.sitemap_menu > li > ul > li > a {position: relative;padding: 4px 0 4px 13px;font-size: 16px;line-height: 1.75;color: #666;}
.sitemap_menu > li > ul > li > a:before {content: '';display: block;width: 4px;height: 4px;position: absolute;top: 16px;left: 0;background: #1c9ad6;border-radius: 50%;}
/* **************************************** *
 
 * SINGLE PAGINATION
 * **************************************** */
.single_pagination {display: table;width: 100%;max-width: 1200px;height: 180px;margin: 0 auto;position: relative;border-top: 1px solid #ddd;}
.single_pagination_link, .single_pagination_title {display: table-cell;width: 50%;height: 100%;position: relative;font-size: 15px;font-weight: 400;text-align: center;vertical-align: middle;color: #555;}
.single_pagination_next, .single_pagination_title_next {padding-left: 60px;padding-right: 100px; text-align: right}
.single_pagination_prev, .single_pagination_title_prev {padding-right: 60px;padding-left: 100px; text-align: left;}
.single_pagination_prev:after, .single_pagination_next:after {content: '';display: block;width: 100%;height: 2px;position: absolute;top: -1px;left: 0;background: transparent;-webkit-transition: background 300ms;transition: background 300ms;}
.single_pagination_link span {display: block;padding-top: 10px;-webkit-transition: color 200ms;transition: color 200ms;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal; font-size:15px; color:#b1b1b1;  overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.single_pagination_link b {display: inline-block; font-size: 18px;line-height: 1;letter-spacing: 0.05em;font-weight: 600;text-transform: uppercase;-webkit-transition: color 200ms, padding 300ms;transition: color 200ms, padding 300ms;}
.single_pagination_link b:after {content: '';display: block;opacity: 0;visibility: hidden;width: 70px;height: 12px;position: absolute;top: 0;  -webkit-transition: opacity 300ms, left 200ms, right 200ms;transition: opacity 300ms, left 200ms, right 200ms; top:50%; margin-top:-6px;}
.single_pagination_prev b:after {left:-5px; background: url(/ko/front/image/common/btn_view_prev.png) no-repeat center center; }
.single_pagination_next b:after {right:-5px; background: url(/ko/front/image/common/btn_view_next.png) no-repeat center center; }
/*
.single_pagination_link:hover:after {background: #1c9ad6;}
.single_pagination_link:hover span {color: #1c9ad6;}
.single_pagination_link:hover b {color: #1c9ad6;}*/
.single_pagination_link:hover b:after {opacity: 1;visibility: visible;}
.single_pagination_prev:hover b { }
.single_pagination_prev:hover b:after {left: 3px;}
.single_pagination_next:hover b { }
.single_pagination_next:hover b:after {right: 3px;}
.single_pagination_list {display: block;width: 73px;height: 73px;position: absolute;top: 50%;left: 50%;margin-top: -36.5px;margin-left: -36.5px;font-size: 0;background: #484848 url(/ko/front/image/common/icon-list.png) no-repeat center center; z-index: 1;-webkit-transition: background 300ms;transition: background 300ms;}
.single_pagination_list.single_pagination_link {font-size: 0;}
.single_pagination_list:hover {background-color: #2e87cc;}
/* span text-overflow ellipsis debug */
.single_pagination_prev, .single_pagination_next {max-width: 0;}
/* **************************************** *
 * contact From 7
 * **************************************** */
div.wpcf7 {width: 100%;}
div.wpcf7 input[type="file"] {-moz-box-sizing: border-box;box-sizing: border-box;}
div.wpcf7 p:empty {display: none;}
span.wpcf7-list-item {margin-left: 35px;}
span.wpcf7-list-item.first {margin-left: 0;}
.wpcf7-form-control-wrap {display: inline-block;width: 100%;vertical-align: top;position: relative;}
/* clear default style */
div.wpcf7 {float: left;position: relative;}
div.wpcf7 .ajax-loader {margin: 0;position: absolute;left: -30px;top: 50%;margin-top: -8px;}
div.wpcf7-mail-sent-ok, div.wpcf7-validation-errors {width: 100%;margin: 20px 0 0;padding: 10px 15px;position: static;font-size: 14px;border: none;font-weight: bold;}
div.wpcf7-mail-sent-ok {color: #3c763d;background-color: #dff0d8;}
div.wpcf7-validation-errors {color: #f4263a;background-color: #fff1ef;}
span.wpcf7-not-valid-tip {width: 100%;margin-top: 4px;padding: 5px 8px;line-height: 1.3;word-break: break-all;display: block;padding-top: 6px;font-size: 14px;vertical-align: middle;font-weight: 600;color: #f4263a;}
/* **************************************** *
 * SLICK
 * **************************************** */
.slick-list, .slick-track {height: 100%;}
.slick-control {display: block;position: absolute;right: 0;top: 50%;font-size: 0;line-height: 1;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);}
.slick-control .slick-arrows {display: inline-block;width: 46px;height: 46px;padding: 0;margin: 0 5px;position: relative;font-size: 0;background: none;border: none;outline: none;cursor: pointer;z-index: 1;}
.slick-control .slick-arrows:after {display: block;width: 100%;height: 100%;position: absolute;top: 0;left: 0;font-family: 'jt-font';font-size: 46px;font-weight: normal;text-align: center;color: #bcbcbc;-webkit-transition: color 300ms;transition: color 300ms;}
.slick-control .slick-prev {margin-left: 0;}
.slick-control .slick-prev:after {content: '\e906';}
.slick-control .slick-next {margin-right: 0;}
.slick-control .slick-next:after {content: '\e907';}
.slick-control .slick-arrows:hover:after {color: #212121;}
.slick-dots {margin-top: 26px;font-size: 0;line-height: 1;text-align: center;}
.slick-dots > li {display: inline-block;vertical-align: top;width: 15px;height: 15px;margin: 0 5px;background: #ddd;border-radius: 10px;cursor: pointer;-webkit-transition: all 400ms;transition: all 400ms;}
.slick-dots > li.slick-active {background: #1c9ad6;}
.slick-dots > li > button {display: none;}
/* **************************************** *
 * CYCLE
 * **************************************** */
.cycle_pager_wrap {}
.cycle_pager {display: block;}
.cycle_pager li {display: block;width: 9px;height: 9px;margin-top: 12px;-webkit-transition: height 400ms ease;transition: height 400ms ease;}
.cycle_pager li:first-child {margin-top: 0;}
.cycle_pager li button {display: block;width: 100%;height: 100%;font-size: 0;padding: 0;border: none;background: #fff;border-radius: 10px;cursor: pointer;-webkit-transition: background 300ms;transition: background 300ms;}
.cycle_pager li button:hover {background: #1c9ad6;}
.cycle_pager li.cycle-pager-active {height: 29px;}
/* **************************************** *
 * MAGNIFIC POPUP
 * **************************************** */
/* overlay */
.mfp-bg {background: #000;opacity: 0.76;}
.mfp-with-zoom.mfp-ready.mfp-bg {opacity: 0.76;}
/* close button */
button.mfp-close {width: 55px;height: 55px;top: -11px;right: -73px;font-size: 0;opacity: 1;cursor: pointer;}
button.mfp-close:after {display: block;width: 100%;height: 100%;position: absolute;top: 1px;left: 0;font-family: 'xeicon';content: '\e921';font-size: 30px;line-height: 55px;font-weight: normal;text-align: center;color: #fff;-webkit-transition: 1s -webkit-transform cubic-bezier(.075,.82,.165,1);transition: 1s -webkit-transform cubic-bezier(.075,.82,.165,1);transition: 1s transform cubic-bezier(.075,.82,.165,1);transition: 1s transform cubic-bezier(.075,.82,.165,1), 1s -webkit-transform cubic-bezier(.075,.82,.165,1);-webkit-transform-origin: center center;-ms-transform-origin: center center;transform-origin: center center;}
button.mfp-close:active {top: -11px;}
/*button.mfp-close:hover:after {transform: rotate(180deg);}*/
.mfp-iframe-holder button.mfp-close {width: 55px;padding: 0;top: -11px;right: -73px;font-size: 0;}

/* **************************************** */ 
/* A11Y */
/* **************************************** */
.use_keyboard select:focus, .use_keyboard input:focus, .use_keyboard a:focus, .use_keyboard button:focus, .use_keyboard iframe:focus, .focus-input {outline:1px dotted #999; outline: -webkit-focus-ring-color auto 5px;}
.use_keyboard .jt_animate_btn, .use_keyboard .main_chemical_list li, .use_keyboard .jt_icon_enter, .use_keyboard .main_info_link {visibility:inherit !important;} 
.sr_only { position: absolute;height: 1px; width: 1px;  overflow: hidden; clip: rect(1px 1px 1px 1px); /* IE7 */ clip: rect(1px, 1px, 1px, 1px);}
.screen_out {overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px}

/* **************************************** */ 
/* skipnavi */
/* **************************************** */
#skipnavi{position:absolute;top:-1px;left:0;background-color:#333;z-index:999999}
#skipnavi a{position:absolute;top:0;left:0;padding:10px 25px;margin-top:-100px;text-align:center;line-height:1;white-space:nowrap;background:#000}
#skipnavi a:link{color:#333;}
#skipnavi a:focus{margin-top:0;text-decoration:underline;color:#fff}