@charset "utf-8";

/*
 * File       : rwd-main.css
 * Author     : STUDIO-JT (HEE)
 * Guideline  : JTstyle.1.1
 * Dependency : css/reset.css
 *              css/jt-strap.css
 *
 * SUMMARY:
 * 01)
 */

/* **************************************** *
 * 1800px
 * **************************************** */

@media(max-width: 1800px){
	/* VISUAL */
	.cycle_control { width: 76px; height: 148px; margin-top: -74px; right: 27px; }
	.cycle_btn { width: 70px; height: 70px; }
	.cycle_btn:after { line-height: 70px; }
	.main_visual_paging { left: 30px; }

}

/* **************************************** *
 * 1700px
 * **************************************** */

@media(max-width: 1700px){
	/* process */
	.main_process_video { width: 55%; }
	.main_process_txt { width: 45%; padding-left: 5%;}
	.main_process_txt p br {display: none;}
	.main_glance_item_txt {padding: 31px 20px 41px;}

	/* network */
	.main_network_list { margin-left: -10px; margin-right: -10px; }
	.main_network_item { margin: 0 10px; width: -webkit-calc(33.33% - 20px); width: calc(33.33% - 20px);}
	.main_network_txt {padding: 30px 35px;}
	.main_network_txt p br {display: none;}


	/* client */
	.main_client_list {margin: 0 -10px;}
	.main_client_item {padding: 0 10px;}
	
}

/* **************************************** *
 * 1600px
 * **************************************** */

@media(max-width: 1600px){
	/* process */
	.main_process_txt h3 br {display: none;}
	.main_process_txt p br {display: none;}
}


/* **************************************** *
 * 1340px
 * **************************************** */

@media(max-width: 1340px){
	/* VISUAL */
	.cycle_control {display: none;}

	.main_visual_paging { bottom: 25px; top: auto; left: 50%; -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: auto; }
	.main_visual_paging .cycle_pager li { display: inline-block; margin: 0 2.5px; }
	.slider_state { display: inline-block; margin-left: 2.5px; }

	/* glance */
	.main_glance_item_txt {padding: 30px 0 34px;}
}

/* **************************************** *
 * 1280px
 * **************************************** */

@media(max-width: 1280px){
	.bg_pic_ring {display: none;}
	.bg_pic_parallelogram {display: none;}
	
	/* product */
	.main_product .krst_product_list { margin-left: -10px; margin-right: -10px; width: -webkit-calc(100% + 20px); width: calc(100% + 20px); }
	.main_product .krst_product_item { padding: 0 10px; }

	/* glance */
	.main_glance_list { margin-left: -10px; margin-right: -10px; width: -webkit-calc(100% + 20px); width: calc(100% + 20px); }
	.main_glance_item { padding: 0 10px; }

	/* network */
	.main_network_txt {padding: 25px 30px;}


}

/* **************************************** *
 * 1023px
 * **************************************** */

@media(max-width: 1023px){
	/* VISUAL */
	.main_visual_content h2 { font-size: 45px; }
	.main_visual_btn {font-size: 14px;}

	/* COMMON */
	.main_section { padding-bottom: 120px; }
	.main_section_title {font-size: 36px; margin-bottom: 40px;}

	/* product */
	.main_product_tab > li > a { padding: 26px 20px 25px; }
	.main_product.main_section { padding-top: 120px; }
	.main_product .krst_product_list { margin-left: -5px; margin-right: -5px; width: -webkit-calc(100% + 10px); width: calc(100% + 10px); }
	.main_product .krst_product_item { padding: 0 5px; }

	/* process */
	.main_process.main_section { padding-top: 60px; padding-bottom: 60px; margin-bottom: 120px; }
	.main_process_video {width: 50%;}
	.main_process_txt {width: 50%;}
	.main_process_txt h3 { font-size: 26px; }

	/* glance */
	.main_glance_list {margin-left: -5px; margin-right: -5px; width: -webkit-calc(100% + 10px); width: calc(100% + 10px);}
	.main_glance_item {padding: 0 5px;}
	.main_glance_item_txt {padding: 25px 0;}
	.main_glance_item_txt h4 {font-size: 20px;}
	.main_glance_item_txt p {font-size: 16px; margin-bottom: 65px; } 
	.main_glance_item_txt a.view {bottom: 25px;}
	
	/* network */
	.main_network_list { width: -webkit-calc(100% + 10px); width: calc(100% + 10px); margin-left: -5px; margin-right: -5px; }
	.main_network_item { margin: 0 5px; width: -webkit-calc(33.33% - 10px); width: calc(33.33% - 10px);}
	.main_network_txt {padding: 25px;}
	.main_network_txt h4 {font-size: 20px; margin-bottom: 4px;}
	.main_network_txt p { font-size: 16px; line-height: 1.67;}
	.main_network_bg:before { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000000; background: rgba(0, 0, 0, .2); }

	/* client */
	.main_client_tab > li {margin-right:45px;}
	.main_client_tab > li.active:before { width: 8px; height: 8px; margin-left: -4px; }
	.main_client_tab > li > a {font-size: 36px;}
	.main_client_list {margin: 0;}
	.main_client_item {padding: 0;}

}

/* **************************************** *
 * 768px
 * **************************************** */

@media(max-width: 768px){
	.main_visual_btn { min-width: 150px; font-weight: 600; font-size: 13px;}
}

/* **************************************** *
 * 767px
 * **************************************** */

@media(max-width: 767px){
	/* VISUAL */
	.main_visual_slider {background-color: transparent;}
	.main_visual_slider_wrap { height: auto; padding-top: 0; top: 0; }
	.main_visual_slider { position: relative; width: 100%; height: 100%; top: 0; left: 0; }
	.main_visual_item_bg { /* bottom: 260px; */ background-position: 80% top; position: static; top: auto; left: auto; right: auto; bottom: auto; padding-top: 80%; min-height: 266px;}
	.main_visual_content { display: block; /* padding-top: 80%; */  height: auto;}
	.main_visual_content_inner { background: #f4f4f4; display: block; padding: 25px 0 75px; }
	.main_visual_content h2 { color: #222; font-size: 34px; line-height: 1.34; margin-bottom: 12px;}
	.main_visual_content p { color: #666; margin-bottom: 22px; font-size: 16px;}
	.main_visual_content .jt_btn_basic.main_visual_btn {position: absolute; bottom: 30px;}

	.main_visual_paging {bottom: auto; padding-top: 72%; }
	.cycle_control {display: none;}

	.jt_btn_basic.main_visual_btn { border-color: #B5121B; color: #B5121B; border-width: 2px; }
	
	/* COMMON */
	.main_section  {padding-bottom: 80px; }
	.main_section_title {font-size: 28px; margin-bottom: 40px;}

	/* product */
	.main_product.main_section {padding-top: 80px; padding-bottom: 80px;}
	.main_product.main_section .wrap {margin: 0;}

	.main_product_tabs_wrap {margin-top: -16px; }
	.main_product_tab_wrap { height:48px; overflow:hidden; -webkit-overflow-scrolling: touch;}
	.main_product_tab { height:54px; overflow-y: hidden; overflow-x: auto; white-space: nowrap; margin-left: -30px; margin-right: -30px; padding: 0 30px 15px;}
	.main_product_tab > li {margin: 0;}
	.main_product_tab > li > a { padding: 16px 18px 15px; font-size: 15px; }
    .main_product .krst_product_list_wrap {height:184px; margin-top: 25px; margin-bottom: 40px;  overflow:hidden; -webkit-overflow-scrolling: touch;}
	.main_product .krst_product_list { height:190px; overflow-y: hidden; overflow-x: auto; white-space: nowrap; margin:0px; padding: 0 30px;}
	.main_product .krst_product_item {width: 260px; height: auto;}

	.main_product .krst_product_list {width: 100%; margin-left:0; margin-right: 0;}
	.main_product .krst_product_item:first-child {padding-left: 0;}
	.main_product .krst_product_item:last-child {padding-right: 0;}

	/* process */
	.main_process.main_section {padding-top: 0; padding-bottom: 80px; margin-top: -40px; margin-bottom: 0;}
	.bg_pic_rect {display: none;}
	.main_process_cont_wrap { display: block; }
	.main_process_video { display: block; position: relative; bottom: -40px; right: -30px; left: 0; width: -webkit-calc(100% + 30px); width: calc(100% + 30px); }
	.main_process_txt { width: 100%; display: block; padding-left: 0; background: #f4f4f4; width: -webkit-calc(100% + 60px); width: calc(100% + 60px); margin: 0 -30px; padding: 65px 30px 35px;}
	.main_process_txt h3 { font-size: 24px; margin-bottom: 8px; }
	.main_process_txt p { font-size: 16px; line-height: 1.67;}

	/* glance */
	.main_glance.main_section .wrap {margin: 0;}
    .main_glance_list_wrap {height:375px; overflow:hidden; -webkit-overflow-scrolling: touch;}
	.main_glance_list { height:381px; overflow-y: hidden; overflow-x: auto; white-space: nowrap; margin-top:0; padding: 0 30px;}
	.main_glance_item { max-width: 240px; width: auto;}
	.main_glance_item_txt {padding: 16px 0;}
	.main_glance_item_txt h4 {font-size: 20px; margin-bottom: 5px;}
	.main_glance_item_txt p {font-size: 15px; white-space: normal; margin-bottom: 55px;}
	.main_glance_item_txt a.view { width: 34px; height: 34px; background: #B5121B; border-color: #B5121B; }
	.main_glance_item_txt a.view:before { font-size: 10px; line-height: 34px; color: #fff; }
	html.android .main_glance_item_txt a.view:before { line-height:32px;}

	.main_glance_board {margin-top: 80px; padding: 0 30px;}
	.main_glance_notice {position: relative;}
	.main_glance_notice:before {content:''; width: 100%; height: 1px; display: block; background: #ddd; position: absolute; bottom: 0; left: 0;}

	/* network */
	.main_network.main_section > .wrap {margin: 0;}
	.main_network_list_wrap {height:300px; overflow:hidden; -webkit-overflow-scrolling: touch;}
	.main_network_list { height:306px; overflow-y: hidden; overflow-x: auto; white-space: nowrap; padding: 0 30px;}
	.main_network_item {width: 240px; height: 300px; padding-top: 0;}
	.main_network_bg:before {content:''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #000000; background: rgba(0, 0, 0, .6)}
	.main_network_txt {white-space: normal; padding: 20px;}
	.main_network_txt h4 {font-size: 20px;}
	.main_network_txt p {font-size: 15px; line-height: 1.5;}

	/* client */
 	.main_client_tab {margin-bottom: 30px;}
	.main_client_tab > li {margin-right:30px;}
	.main_client_tab > li > a {font-size: 28px;}
	.main_client_tab > li.active:before {width: 6px; height: 6px; top:-13px; margin-left: -3px}
	/* .main_client_list:before,	.main_client_list:after {display: none;} */
	.main_client_list:before, .main_client_list:after {width: 100px;}
	.main_client_list .slick-arrow {width: 25px; height: 25px;}
	.main_client_list .slick-arrow:before {font-size: 24px;}
	.main_client_list .slick-arrow.slick-prev {left: 0;}
	.main_client_list .slick-arrow.slick-next {right: 0;}
	.main_client_item {width: 33.33%;}
	/* .main_client_item:nth-child(n+7) {display: none;} */
	.main_client_btn_wrap { display: block; margin-top: 40px; }

}

/* **************************************** *
 * 540px
 * **************************************** */

@media(max-width: 540px){
	/* VISUAL */
	/* .main_visual_item_bg {bottom: 254px;} */
	.main_visual_content_inner {padding-left: 15px; padding-right: 15px;}
	.main_visual_content h2 { font-size: 28px; margin-bottom: 8px; word-break: keep-all; }
	/* .main_visual_content h2 br { display: none; } */
	.main_visual_content p {font-size: 15px; margin-bottom: 18px;}
	.main_visual_content p br {display: none;}
	.main_visual_paging {padding-top: 70%; }
	.main_visual_btn { min-width: 140px; font-size: 12px; }

	/* COMMON */
	.main_section  {padding-bottom: 60px; }
	.main_section_title {font-size: 25px; margin-bottom: 30px;}

	/* product */
	.main_product.main_section {padding-top: 60px; padding-bottom: 60px;}
	.main_product_tab {margin-left: -15px; margin-right: -15px;}
	.main_product .krst_product_list {padding: 0 15px;}

	/* process */
	.main_process.main_section {padding-bottom: 60px;}
	.main_process_video {right: -15px; width: -webkit-calc(100% + 15px); width: calc(100% + 15px)}
	.main_process_txt h3 { font-size: 22px; margin-bottom: 5px;}
	.main_process_txt p {font-size: 15px; }

	/* glance */
	.main_glance_list_wrap {height: 422px;}
	.main_glance_list {height:428px; padding: 0 15px 15px;}
	.main_glance_item_txt {padding: 28px 20px 30px; border: 1px 	solid #ddd; border-top: 0;}
	.main_glance_item_txt:before {display: none;}
	.main_glance_item_txt p {margin-bottom: 50px; }
	.main_glance_item_txt a.view {bottom: 30px;}
	.main_glance_board {margin-top: 60px; padding: 0 15px; }
	
	/* network */
	.main_network_list {padding: 0 15px 15px;}

	/* client */
	.main_client_tab {margin-bottom: 20px;}
	.main_client_tab > li {margin-right:20px;}
	/* .main_client_tab > li.active:before {top:-10px} */
	.main_client_tab > li > a {font-size: 24px;}
	.main_client_btn_wrap {margin-top: 30px;}
	.main_client_btn_wrap .jt_btn_basic { min-width: 150px; font-size: 13px; padding: 14px 10px; }

}

/* **************************************** *
 * 480px
 * **************************************** */

@media(max-width: 480px){
	/* glance */
	.main_glance_list_wrap {height:100%;}
	.main_glance_list { height:100%; margin: 0; width: 100%;}
	.main_glance_item { display: block; padding: 0; width: 100%;  margin-bottom: 20px; max-width: 100%}
	.main_glance_item:last-child {margin-bottom: 0;}
}

/* **************************************** *
 * 359px
 * **************************************** */

@media(max-width: 359px){
	/* VISUAL */
	.main_visual_content h2 br {display: none;}

    /* client */
	.main_client_tab > li > a  {font-size: 20px;}
}