@charset "utf-8";
/* *******************************************************
 * filename : content_responsive.css
 * description : 서브페이지 컨텐츠 반응형 CSS
 * date : 2020-11-25
******************************************************** */


/* ******************  서브공통 ********************** */
/* -------- 공통 스크롤바  -------- */
@media all and (max-width:1220px){
	.custom-scrollbar-wrapper .scroll-object{max-width:100%;}
}
@media all and (max-width:800px){
	.custom-scrollbar-wrapper{position:relative;/*margin-right:-15px; */cursor:move}
	.custom-scrollbar-wrapper .scroll-object{max-width:none !important; width:800px; }
	.custom-scrollbar-cover{display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px; background-color:rgba(0,0,0,0.5)}
	.custom-scrollbar-cover .scroll-cover-txt{position:absolute; top:50%; left:0; width:100%; text-align:center; color:#fff; font-size:300; font-size:15px;}
	.custom-scrollbar-cover .scroll-cover-txt i{font-size:30px; display:block; margin-bottom:20px; }
}

/* -------- 공통 :: 탭 -------- */
@media all and (max-width:1220px){
	.sub-tab-list-style .area{padding:0}
}
@media all and (max-width:1024px){
	/* Tab Fixed Move*/
	.sub-tab-list-style.top-fixed{top:80px;}
}
@media all and ( max-width: 800px ){
	/* Tab 공통 스타일 */
	.sub-tab-wrapper-style,
	.sub-tab-list-style.top-fixed,
	.sub-tab-list-style ul li a{height:40px; }
	.sub-tab-list-style ul li a em{font-size:13px}
	/* Tab Fixed Move*/
	/* Mobile Tab Drop Menu */
	.sub-drop-menu-style{position:relative;}
	.sub-drop-open-btn-style{display:block; position:relative; padding:0 15px; height:40px; line-height:40px; font-size:15px; background-color:#333; box-sizing:border-box;}
	.sub-drop-open-btn-style span{color:#fff; }
	.sub-drop-open-btn-style .arrow{color:#fff; position:absolute; top:50%; right:15px; margin-top:-7px}
	.sub-drop-open-btn-style.open .arrow{transform:rotate(180deg)}
	.sub-drop-menu-style ul{display:none; margin:0; height:auto; position:absolute; top:100%; left:0px; right:0px; background-color:#fff; border:1px solid #ddd; border-top:0; z-index:11; box-sizing:border-box;}
	.sub-drop-menu-style ul li{position:static; display:block; float:none; border:0; border-top:1px solid #eee; width:auto; background-color:transparent}
	.sub-drop-menu-style ul li:first-child{border-top:0; border-left:0}
	.sub-drop-menu-style ul li a{display:block; width:auto; height:auto; padding:10px 15px; border:0;}
	.sub-drop-menu-style ul li a em{font-size:13px;}
	.sub-drop-menu-style ul li.selected a{background-color:transparent;}
	.sub-drop-menu-style ul li.selected a em{color:#f57f20; font-weight:600; }
}
@media all and (max-width:480px){
	/* Tab Fixed Move*/	
	.sub-tab-list-style.top-fixed{top:60px;}
}


/* ******************  제품 ********************** */
/* ------------ 제품 :: 컨텐츠1(비주얼) ---------- */
@media all and (max-width:1820px){	
	/* 왼쪽바 */
	.prd-left-bar{left:15px}
}
@media all and (max-width:1780px){
	/* 비주얼 :: 메뉴탭 */	
	.prd-visual-menu .prd-menu-list li a .inner .txt p br{display:none}
}
@media all and (max-width:1620px){
	/* 비주얼 :: 메뉴탭 */
	.prd-visual-menu .prd-menu-list li a{padding:0 5%}
	.prd-visual-menu .prd-menu-list li a .inner .txt p{font-size:1.7rem; margin-top:1.5rem}
	.prd-visual-menu .prd-menu-list li.active a .inner, .prd-visual-menu .prd-menu-list li:hover a .inner{padding-left:8rem}
	/* 비주얼 :: 스크롤다운 */
	#prdVisualCon .rt-scroll-down{right:0}
}
@media all and (max-width:1024px){	
	/* 왼쪽바 */
	.prd-left-bar{display:none}
	/* 비주얼 :: 메뉴탭 */
	.prd-visual-menu .prd-menu-list li a .inner .icon{display:none}
	.prd-visual-menu .prd-menu-list li.active a .inner, .prd-visual-menu .prd-menu-list li:hover a .inner{padding-left:0}
}
@media all and (max-width:800px){
	/* 비주얼 :: 메뉴탭 */
	.prd-visual-menu{bottom:3rem; left:15px; right:15px; width:auto}
	.prd-visual-menu .prd-menu-list{display:block}
	.prd-visual-menu .prd-menu-list li{width:100%; height:8rem; border:1px solid rgba(255,255,255,0.35); margin-top:1rem}
	.prd-visual-menu .prd-menu-list li:last-child{border-right:1px solid rgba(255,255,255,0.35)}
	.prd-visual-menu .prd-menu-list li a{padding:0 3%}
	.prd-visual-menu .prd-menu-list li a .inner:after{position:absolute; content:"\e913"; font-family:"xeicon"; right:0; top:50%; transform:translateY(-50%); color:#fff; font-size:1.5rem}
	.prd-visual-menu .prd-menu-list li a .inner .txt p,
	.prd-visual-menu .prd-menu-list li a .inner .icon{display:none}
	.prd-visual-menu .prd-menu-list li a .inner .txt strong{font-size:2.5rem}
	/* 비주얼 :: 텍스트 */
	.prd-visual-txt-inner{padding-right:4rem}
	/* 비주얼 :: 스크롤다운 */
	#prdVisualCon .rt-scroll-down i{left:23px}
	#prdVisualCon .rt-scroll-down i.icon-01{top:-50px}
	#prdVisualCon .rt-scroll-down i.icon-02{bottom:-62px}
}
@media all and (max-width:640px){		
	/* 비주얼 :: 텍스트 */
	.prd-visual-txt-inner{padding-right:0}
	/* 비주얼 :: 스크롤다운 */
	#prdVisualCon .rt-scroll-down{display:none}
}	
@media all and (max-width:480px){
	/* 비주얼 :: 텍스트 */
	.prd-visual-txt-con .prd-visual-txt1{font-size:5.5rem}
	.prd-visual-txt-con .prd-visual-txt2{font-size:2.2rem}
	.prd-visual-txt-con .prd-visual-txt3{font-size:2rem}
	/* 비주얼 :: 메뉴탭 */
	.prd-visual-menu .prd-menu-list li{height:7rem}
	.prd-visual-menu .prd-menu-list li a .inner .txt strong{font-size:2rem}
}
@media all and ( min-width: 801px ) and (max-height: 770px) {	
	#prdVisualCon{height:750px !important}
}
@media all and ( max-width: 800px ) and (max-height: 600px) {	
	#prdVisualCon{height:600px !important}
}


/* ------------ 제품 :: 제품 컨텐츠2(제품설명)  ---------- */
@media all and (max-width:1024px){	
	#prdInfoCon{padding:8rem 0}
	#prdInfoCon .prd-info-tit-con .prd-info-mb-txt{display:block}
}

@media all and (max-width:800px){	
	#prdInfoCon .prd-info-tit-con{margin-bottom:3rem}
	#prdInfoCon .prd-info-txt{margin-top:4rem}
}
@media all and ( min-width: 1025px ) and (max-height: 895px) {	
	#prdInfoCon .prd-info-tit-con{margin-bottom:4rem}
	#prdInfoCon .prd-info-img img{max-width:80%}
	#prdInfoCon .prd-info-txt{margin-top:4rem}
	#prdInfoCon .prd-info-txt .txt-03{margin-top:2rem}
}
@media all and (max-height: 750px) {	
	#prdInfoCon{padding:8rem 0}
	#prdInfoCon .prd-info-txt .txt-03 br{display:none;}
}


/* ------------ 제품 :: 제품 컨텐츠3(솔루션구성)  ---------- */
@media all and (max-width:1220px){
	/* 팝업 */
	#prdPop .prd-con-inner .txt-con .explain span br,
	#prdPop .prd-box-list .box-list span.br{display:none}
}
@media all and (max-width:1024px){	
	#prdSolutionCon{padding:8rem 0;}
	.prd-solution-list.col-04 li{width:40%;}
	.prd-solution-list.col-04 li:nth-child(n+3){margin-top:7rem}
}
@media all and (max-width:800px){	
	.prd-solution-list{margin-top:8rem}
	.prd-solution-list li .solution-pop .circle-icon span img{max-height:50px}
	.solution-overview-btn{margin:4rem auto -4rem}
	/* 팝업 */
	#prdPop{margin:100px 15px}
	#prdPop .modal-close-btn{opacity:1}
	#prdPop .tit-con strong{float:none; width:100%; margin:0 0 1.5rem; display:block}
	#prdPop .tit-con span{float:none; width:100%; display:block}
	#prdPop .tit-con .sub-tit{font-size:14px; float:none; margin-top:3rem}
	#prdPop .tit-con .sub-tit em{font-size:13px;}
	#prdPop .prd-con-inner > div{display:block; }
	#prdPop .prd-con-inner .img-con{width:100%; text-align:center; margin-top:6rem}
	#prdPop .prd-con-inner .img-con.wide-img{width:100%}
	#prdPop .prd-con-inner .txt-con{padding-right:0}
	#prdPop .prd-con-inner .txt-con .explain span:last-child{margin-bottom:0}
	#prdPop .prd-box-list .box-list{padding-right:0}
	#prdPop .prd-con-inner.has-wide-box{padding-bottom:0}
	#prdPop .prd-box-list.wide-box{position:relative;}
	#prdPop .prd-box-list .box-list.w-33p span,
	#prdPop .prd-box-list .box-list.w-25p span{width:calc(50% - 0.4rem)}
	#prdPop .prd-box-list .box-list.w-400 span,
	#prdPop .prd-box-list .box-list.w-430 span,
	#prdPop .prd-box-list .box-list.w-425 span,
	#prdPop .prd-box-list .box-list.w-375 span{max-width:none; width:100% !important}
	#prdPop .prd-box-list .box-list.txt-lf span em{padding:0 1.5rem}
	/* 팝업 :: 스타일02 (DSRC) */
	#prdPop.type-02 .prd-con-inner .img-con{margin-top:4rem}
}
@media all and (max-width:640px){		
	.prd-solution-list li{width:100% !important; margin-bottom:8rem}
	.prd-solution-list li:last-child{margin-bottom:0}
	.prd-solution-list li .solution-pop .tit{margin:3rem 0 4rem}
	.prd-solution-list.col-04 li:nth-child(n+3){margin-top:0}
}
@media all and (max-width:480px){		
	/* 팝업 */
	#prdPop .prd-box-list .box-list span{width:calc(50% - 0.4rem) !important}
	#prdPop .prd-box-list .box-list.w-33p span{width:100% !important}
}

/* ------------ 제품 :: DSRC  ---------- */
/* ------------ 제품 :: 제품 컨텐츠4(DSRC 제품군)  ---------- */
@media all and (max-width:1024px){	
	#prdDsrcCon{padding:8rem 0}
}

/* ------------ 제품 :: Radar Sensor  ---------- */
@media all and (max-width:800px){		
	/* 팝업 :: check아이콘 텍스트 */
	#prdPop .check-txt-list{margin-top:3rem}
}
@media all and (max-width:480px){		
	/* 팝업 :: spec표 */
	#prdPop .spec-table-con .cm-spec-tbl.txt-lf td{padding:1.5rem 0.3rem 1.5rem 0.7rem}
	#prdPop .spec-table-con .cm-spec-tbl th, #prdPop .spec-table-con .cm-spec-tbl td{font-size:1.35rem}
}


/* ------------ 제품 :: MCU  ---------- */
@media all and (min-width:1221px){
	#prdPop .cate-list-con .cate-con li.cate-con-min{height:314px;}
}
@media all and (max-width:1320px){		
	/* 팝업 :: 자동차 HSM */
	#prdPop .cate-list-con .cate-con li p.nowrap{white-space:normal}
}
@media all and (max-width:1220px){		
	/* 팝업 :: 자동차 HSM */
	#prdPop .cate-list-con .cate-con li p .br-none{display:block}
	#prdPop .cate-list-con{margin:0}
	#prdPop .cate-list-con .cate-con{float:none; width:100%; margin:0 -0.5%; display:flex; flex-wrap:wrap}
	#prdPop .cate-list-con .cate-con li{width:49%; margin:0 0.5%}
	#prdPop .cate-list-con .cate-con.item-01 li:last-child,
	#prdPop .cate-list-con .cate-con.item-02 li:last-child{padding-bottom:0}
}
@media all and (max-width:1024px){		
	/* 팝업 :: 자동차 HSM */
}
@media all and (max-width:480px){		
	/* 팝업 :: 자동차 HSM */
	#prdPop .cate-list-con .cate-con{margin:0; display:block}
	#prdPop .cate-list-con .cate-con li{width:100%; margin:0}

}


/* ******************  IR ********************** */
/* ------------ IR :: 보도자료  ---------- */
@media all and (max-width:480px){		
	.cm-notice-list-style li .inner{padding:2rem}
	.cm-notice-list-style li .inner .tit{padding-right:0}
	.cm-notice-list-style li .inner .rt-btn{position:relative; display:inline-block; top:auto; margin-top:2rem; right:auto}
}
/* ------------ IR :: 공지사항  ---------- */
@media all and (max-width:480px){		
	.notice-list.cm-notice-list-style li .inner .tit{padding-right:0}
	.notice-list.cm-notice-list-style li .inner .date-more{position:relative; top:auto; right:auto; margin-top:2rem}
}


/* ****************** 문의게시판 ********************** */
/* ------------ 문의게시판 :: 제품홍보동영상  ---------- */
@media all and (max-width:800px){		
	.video-list li{width:48%}
	.video-list li a .txt-con .date{margin-top:2rem}
	.video-list li a .play-icon{width:16%}
}
@media all and (max-width:480px){		
	.video-list li a .play-icon{width:4.4rem}
}


/* ****************** ABOUT ********************** */
@media all and (min-width:801px){
	.about-ci-btn a:hover{background:#195ac5;}
	.about-ci-btn a:last-child:hover{background:#000;}
}

@media all and (max-width:1220px){
	.con-info-inner-02 .email-list li a{padding:24px 12px;}
	/* 컨텐츠 05 */
	.location-info-con dl dd .email-list li{float:none; width:100%; margin:0 0 5px}
	.location-info-con dl dd .email-list li a{padding:15px}

}
@media all and (max-width:1024px){	
	.about-con .tit-bg{font-size:130px; top:-80px;}
	.about-con.con-03 .tit-bg, .about-con.con-04 .tit-bg, .about-con.con-05 .tit-bg{font-size:120px; top:-65px;}

	/* 컨텐츠 05 */
	.location-info-con dl dt{position: relative; margin-bottom:3px;}
	.location-info-con dl dd, .location-info-con.con-01 .con-info-inner-02 dl dd{padding-left:0;}
	.location-info-con.con-01{display: block;}
	.location-info-con.con-01 .con-info-inner-01{width:100%; padding:0 0 20px 0}
	.location-img-con .con-info-inner-02{position:relative; width:100%; margin-top:14px; text-align:center}
	.location-info-con.con-01 .con-info-inner-02 dl dd{padding-left:125px;}
	.location-info-con dl.email{margin-top:0}
	.location-info-con dl dd .email-list{max-width:none}
}

@media all and (max-width:800px){	
	.about-con{padding:80px 0 50px !important}
	.about-con-inner .tit{font-size:30px;}
	.about-con-inner .txt, .about-ci-btn a .btn-txt, .location-info-con dl dd, .location-info-con dl dt, .con-info-inner-02 .email-list li a .txt{font-size:14px;}
	.about-con.con-03 .history-list-box-style02 .history-year-box h4{font-size:26px;}
	.about-ci-btn a .btn-txt i, .ci-detail-wapper .ci-color-list li .ci-color-name strong{font-size:15px;}
	.about-ci-btn a .btn-download, .ci-detail-wapper .ci-color-list li .ci-color-name .sub-name, .ci-detail-wapper .ci-color-list li .ci-color-name p span, .con-info-inner-02 .email-list li a .mail{font-size:13px;}
	.about-location-info .location-tit{font-size:23px;}

	/* about페이지 공통 */
	.about-con .tit-bg{top:-60px !important; font-size:100px !important}

	/* 컨텐츠 01 */
	.about-con.con-01 .about-con-inner .tit{margin-bottom:15px;}
	.about-con.con-01 .about-con-inner .txt{margin-bottom:10px;}
	/* 컨텐츠 02 */
	.about-con.con-02 .about-con-inner .tit{margin-bottom:20px;}

	/* 컨텐츠 03 */
	.about-con.con-03 .about-con-inner .tit{margin-bottom:20px;}
/* 	.about-con.con-03 .history-list-box-style02 .history-year-box .history-year-item .history-year:before{left:100px;}
	.about-con.con-03 .history-list-box-style02 .history-year-box .history-year-item .history-year:after{left:94px;}
	.about-con.con-03 .history-list-box-style02 .history-year-box .history-year-item:before{left:100px;} */

	/* 컨텐츠 04 */
	.about-con.con-04{padding-bottom:0 !important}
	.about-con.con-04 .about-con-inner .tit{margin-bottom:20px;}
	.about-ci-wrap{padding:50px; margin-bottom:30px;}
	.about-ci-btn{margin:0 -0.8%}
	.about-ci-btn a{float:left; width:48.4%; margin:0% 0.8% !important; padding:0 3%; height:40px; line-height:40px;}
	/* -------- Company :: CI소개 02 -------- */  
    .ci-detail-wapper .ci-color-wrap{margin-top:9px}
    .ci-detail-wapper .ci-color-list li{width:48%; margin-bottom:20px;}
    .ci-detail-wapper .ci-color-list li .ci-color p{height:20px;}
    .ci-detail-wapper .ci-color-list li .ci-color-name{margin-top:7px; overflow:hidden;}
    .ci-detail-wapper .ci-color-list li .ci-color-name strong{/* float:left; */ font-size:15px}
    .ci-detail-wapper .ci-color-list li .ci-color-name p{/* float:right; */ text-align:right; margin-top:10px;}
    .ci-detail-wapper .ci-color-list li .ci-color-name p span{font-size:12px}

	/* 컨텐츠 05 */
	.about-con.con-05 .about-con-inner .tit{margin-bottom:20px;}
	.about-location-info{padding-top:30px;}
	.location-img-con{padding-bottom:30px;}
	.location-info-con.con-01 .con-info-inner-01{padding-bottom:10px}
	.about-location-info .location-tit{margin-bottom:15px;}
	.location-info-con dl{margin-bottom:5px;}
	.location-info-con.con-01 .con-info-inner-02{margin-top:5px;}
}

@media all and (max-width:640px){
	.about-con .tit-bg{font-size:55px !important; top:-30px !important}	
	/* 컨텐츠 01 */
	.about-con.con-01 .tit-bg{font-size:42px !important; top:-26px !important}
	/* 컨텐츠 04 */
	.about-ci-btn a .btn-download{display: none;}
	/* 컨텐츠 05 */
	.about-location-con{padding-top:240px;}
	.location-info-con dl{margin-bottom:12px;}
	.location-info-con dl dd .email-list{margin:7px 0 0;}
	.location-info-con dl dd .email-list li{float:none; width:100%; margin:0 0 5px;}
	.location-info-con dl dd .email-list li a{padding:10px;}
	.location-info-con dl dd .email-list li a{position: relative;}
	.location-info-con dl dd .email-list li a .txt{position: absolute;}
	.location-info-con dl dd .email-list li a .mail{padding-left:70px;}
}
@media all and (max-width:480px){
	/* 컨텐츠 03 */
	.about-con.con-03 .history-list-box-style02 .history-year-box h4{font-size:20px;}

	/* -------- Company :: CI소개 02 -------- */  
    .ci-detail-wapper .ci-color-list{margin:0}
    .ci-detail-wapper .ci-color-list li{float:none; width:100%; margin:0 0 18px}

}

/* ****************** 팝업 에디터 이미지 ********************** */
@media all and (min-width:801px){
	.prd-editor-inner .editor{max-height:500px; overflow-Y:scroll;}
}