@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
******************************************************** */

/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1280px ){
	/* 공통 :: 레이아웃 */
	#fullpage .section:not(#mainVisual){height:auto !important;}
	#fullpage .fp-section .fp-tableCell{height:auto !important;}
}
@media all and ( max-width: 800px ){
  #fullpage #mainVisual{}
	/* 메인 비주얼 :: 이미지 */
	.main-visual-item .main-visual-pc-img{display:none;}
	.main-visual-item .main-visual-m-img{display:block;}
  .main-visual-item:nth-child(1) .main-visual-m-img {background-image: url("../images/main/main_visual_m_03.jpg") !important;
  background-size: cover; background-position: center;}
    .main-visual-item:nth-child(2) .main-visual-m-img {background-image: url("../images/main/main_visual_m_01.jpg") !important;
  background-size: cover; background-position: center;}
    .main-visual-item:nth-child(3) .main-visual-m-img {background-image: url("../images/main/main_visual_m_02.jpg") !important ;
  background-size: cover; background-position: center;}

	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-box{/*align-items: flex-start;*/}
	.main-visual-txt-inner{/*margin-top:calc(var(--header-height) + 1rem);*/}
	.main-visual-txt-box .main-visual-txt1{font-size:4rem; margin-left:0;}
	.main-visual-txt-box .main-visual-txt2{font-size:6rem; margin-left:0; margin-top:0;}
	.main-visual-txt-box .main-visual-txt2.cm-word-split-JS.splitting .word{line-height:0.8;}
	.main-visual-txt-box .cm-word-split-JS.splitting .char{padding-top:0.1em;}
	.main-visual-txt-box .main-visual-txt3{/*display: none;*/}
	/* 메인 비주얼 :: Dots */
	.main-slide-line-wrap{width:100%;}
	/* 메인 비주얼 :: 스크롤아이콘 */
	.main-scroll-icon{display:none}

	.main-visual-btn-box{height:auto; bottom:5rem;}

  /*메인 프로덕트*/
  #mainContent2 .mo-bg {position: static; display: block; width: 100%;
  height: 40rem;  transform: scale(1, 1); margin-bottom: 2rem;}
  #mainContent2:before{display: none;}
  #mainContent2 .main-tit-box .main-tit {
    margin-bottom: 2rem;
    color: #000;
}
#mainContent2 .main-tit-box .main-txt {
    color: #000;
}
}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
@media all and (max-width:800px){
	.main-tit-box .main-tit{font-size:5rem;}
}

/* -------- 메인 컨텐츠 :: 컨텐츠1(ODM OEM) -------- */
@media all and (max-width:1280px){
	#mainContent1{padding:15rem 0;}
	#mainContent1 .main-tit-box{display: block;}
	#mainContent1 .main-tit-box .main-tit{margin-right:0rem;}
  .main-news-list .list-item a{padding:4rem 2rem 13rem; }
}
@media all and (max-width:800px){
	#mainContent1{padding:10rem 0;}
	.main-odm-list{margin-top:4rem; display: block;}
	.main-odm-list .list-item{width:100%; margin-bottom:2rem;}
	.main-odm-list .list-item .img-box{padding-top:250px; position: relative;}
  .main-odm-list .list-item .img-box::before {display: block; content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #000000; z-index: 1; opacity: 0.2;}
	.main-odm-list .list-item .txt-box{bottom:auto; top:50%; transform:translateY(-50%); z-index: 2;}
}
/* @media all and (max-width:480px){
	.main-odm-list .list-item .img-box{padding-top:200px;}
} */

/* -------- 메인 컨텐츠 :: 컨텐츠2(RND) -------- */
@media all and (max-width:1280px){
	#mainContent2{padding:15rem 0;}
}
@media all and (max-width:800px){
	#mainContent2{padding:10rem 0;}
	#mainContent2:before{background-position-x:73%;}
	.main-rnd-list{display: block; margin-top:5rem;}
	.main-rnd-list .list-item{width:100%; margin-bottom:2rem;}
	.main-rnd-list .list-item .tit{font-size:2rem;}
}
/* -------- 메인 컨텐츠 :: 컨텐츠3(NEWS) -------- */
@media all and (min-width:801px){
	.main-news-list .list-item a:hover{background:var(--main-color);}
	.main-news-list .list-item a:hover .categoty{color:#fff;}
	.main-news-list .list-item a:hover .tit{color:#fff;}
	.main-news-list .list-item a:hover .txt{color:rgba(255,255,255,0.5);}
	.main-news-list .list-item a:hover .date{color:rgba(255,255,255,0.3);}
	.main-news-list .list-item a:hover .img{transform:scale(1);}
}
@media all and (max-width:1660px){
	.main-news-list-wrap{width:100%; margin-right:0rem;}
	.main-news-list{max-width:none; width:calc(100% + 3rem); margin-right:-3rem;}
	.main-news-btn-box{width: calc(100% - (2 * var(--area-padding)));}
}
@media all and (max-width:1280px){
	#mainContent3{padding:15rem 0;}
	#mainContent3 .main-tit-box{margin-top:0rem;}
}
@media all and (max-width:800px){
	#mainContent3{padding:10rem 0;}
	.main-news-list-wrap{padding:5rem 0 7rem;}
	.main-news-list .list-item .categoty{margin-bottom:1.7rem;}
	.main-news-list .list-item .tit{font-size:2.3rem;}
	.main-news-list .list-item .txt{-webkit-line-clamp: 3;}
	.main-news-list .list-item .img{display: none;}
}
@media all and (max-width:480px){
	.main-news-list-wrap{width:calc(100% + var(--area-padding)); margin-right:calc(-1 * var(--area-padding));}
	.main-news-list{width:calc(100% - 2rem - var(--area-padding));}
}

/* -------- 메인 컨텐츠 :: 컨텐츠4(Contact) -------- */
@media all and (max-width:1280px){
	#mainContent4{padding:15rem 0;}
	#mainContent4 .main-tit-box{margin-top:0rem;}
}
@media all and (max-width:1280px){
	#mainContent4{padding:10rem 0;}
	.main-contact-wrap{display: block;}
	.main-contact-wrap .contact-list{width:100%; margin-bottom:1rem;}
}
@media all and (max-width:800px){
	.main-contact-wrap .contact-list .list-item.radio-item dd .custom-radio-item-box .custom-radio-item{min-width:7rem;}
}

/* ******************  메인 오른쪽 퀵메뉴 (Fullpage) ********************** */
@media all and (max-width:1660px){
	#fp-nav.black{left:var(--area-padding);}
}
@media all and (max-width:1366px){
	#fp-nav{display:none;}
}