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

.main-visual-item.mobile .main-visual-pc-img{display:none;}
/* ******************  메인 비주얼 ********************** */
@media all and ( max-width: 1280px ){
	/* 메인 비주얼 :: 텍스트 */
	main-visual-txt-inner{padding:0 10rem;}
}
@media all and ( max-width: 800px ){
	/* 메인 비주얼 :: 이미지 */
	.main-visual-item .main-visual-pc-img{display:none;}
	.main-visual-item .main-visual-m-img{display:block; /* height:calc(100% - var(--header-height)); */ height:100%;}
	/* 메인 비주얼 :: 텍스트 */
	.main-visual-txt-inner{padding:0 3rem;}
	.main-visual-txt-box .main-visual-txt2{font-size:1.8rem;}
	/* 메인 비주얼 :: 화살표 */
	.main-visual-con .slick-arrow{display:none !important;}
}


/* ******************  메인 슬라이드 해제 ********************** */
@media all and ( max-width: 1280px ){
	.main-page #mainVisual{overflow:auto; height:auto;}
	.main-page .swiper-container{overflow:auto;}
	.main-page .swiper-wrapper{display: block;}
	.main-page .swiper-slide{height:auto !important;}
}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: Topics -------- */
@media all and (max-width:1580px){
	.main-topics-con .left-box{left:var(--area-padding);}
	.main-topics-con .topics-contral-box{left:var(--area-padding);}
}
@media all and (max-width:1280px){
	.main-topics-slide{padding:12rem 0;}
	.main-topics-con .left-box{width:34rem;}
	.main-topics-con .topics-contral-box .slider-progress{width:15rem}
	/* Topics :: 컨텐츠 위치 */
	/* .topics-slide-list .list-item.slick-current, 
	.topics-slide-list .list-item.slick-current + .list-item, 
	.topics-slide-list .list-item.slick-current + .list-item + .list-item, 
	.topics-slide-list .list-item.slick-current + .list-item + .list-item + .list-item{transform: translateX(35rem);} */
}
@media all and (max-width:800px){
	.main-topics-slide{padding:8rem 0;}
	.main-topics-con{padding-bottom:11rem;}
	/* Topics :: 타이틀 */
	.main-topics-con .left-box{position: initial; width:100%; margin-bottom:4rem;}
	.main-topics-con .tit-box{text-align:center; width:100%; margin-bottom:0;}
	.main-topics-con .tit-box .tit{font-size:5rem; margin-bottom:1.5rem;}
	.main-topics-con .tit-box .txt{font-size:1.6rem;}
	/* Topics :: 컨트롤 */
	.main-topics-con .topics-contral-box{position: absolute; width:calc(100% - (2 * var(--area-padding))); bottom:0; left:var(--area-padding); transform:none; top:auto; margin-top:0;}
	.main-topics-con .topics-contral-box .slider-progress{width: calc(100% - 19rem);}
	/* Topics :: 컨텐츠 */
	.main-topics-con .right-box{width:100%; margin-left:0;}
	.topics-slide-list .list-item{transform: translateX(0rem) !important;}
	.topics-slide-list .list-item .txt-box{padding:2.5rem;}
	.topics-slide-list .list-item .txt-box .tit{font-size:2.4rem;}
	.topics-slide-list .list-item .txt-box .txt{height:9rem; -webkit-line-clamp:3; margin-bottom:0;}

	/* Topics :: 컨텐츠 효과 */
	.main-topics-con .topics-slide-list .list-item a{transform:none !important;}
	.topics-slide-list .list-item.slick-current a{box-shadow: 0px 0px 4rem #AF003033;}
	.topics-slide-list .list-item.slick-current a .txt-box .tit{color:#5A5B5E;}
}

/* -------- 메인 컨텐츠 :: Product -------- */
@media all and (min-width:801px){
	.main-product-con .main-tit-box{margin-top:-5rem;}
}
@media (min-width:801px) and (max-width:1280px){
	.accordion-list .accordion-item.accordion-over:not(.accordion-active) .accordian-tit-img{left: -3rem; bottom: 8rem; width: calc(100% + 6rem); padding-top: calc(100% + 6rem);}
	.accordion-list .accordion-item.accordion-over.accordion-active .accordian-tit-img{width: 30rem; padding-top: 30rem; transition:all 0.6s ease-in-out, width 1.2s 0.4s ease-in-out, padding-top 1.2s 0.4s ease-in-out;}
	.accordion-list .accordion-item.accordion-active .accordian-con-box{left:20rem; width: calc(100% - 20rem);}
}
@media all and (max-width:1580px){
	/* 아코디언 내부 리스트 */
	.accordion-list .accordion-item{width:48%;}
	.accordian-con-box .accordian-product-list{width:100%;}
}
@media all and (max-width:1280px){
	.product-con{margin-bottom:10rem;}
	.accordion-list .accordion-item{padding:3rem;}
	.accordian-tit-box{width:20rem;}
	.accordian-tit-box .accordian-tit{font-size:4rem;}
	.accordian-tit-box .accordian-txt{font-size:1.3rem;}

	.accordian-tit-img span{bottom:0; left:17rem; width:70%; padding-top:70%;}

	.accordion-list .accordion-item .accordion-arrow{bottom:3rem; left:3rem;}
}
@media all and (max-width:800px){
	.product-con{margin-bottom:0;}
	.main-product-con{margin-bottom:5rem;}
	.main-product-con .main-tit-box{font-size:5rem; margin-bottom:2.5rem;}

	.accordion-list .accordion-item{padding:2.2rem 3rem; margin-bottom:4rem; width:100% !important;}
	.accordion-list .accordion-item .m-btn{display: block;}
	.accordian-tit-box{width:100%;}
	.accordian-tit-box .accordian-txt{font-size:1.6rem;}
	.accordian-tit-img span{position: relative; left: 50%; width: 416px; padding-top: 416px; /* margin-top: -110px; */ margin-top:0; transform:translateX(-50%);}
	.accordian-con-box{position: relative; width:100%; top:auto; left:auto; margin-bottom:5rem; display: none; transition:none; margin-top:7rem;}
	.accordian-con-box .accordian-product-list{display: block;}
	.accordian-con-box .accordian-product-list .list-item{width:100%; margin-bottom:2rem;}
	.accordian-con-box .accordian-product-list .list-item:last-child{margin-bottom:0; }
	.accordian-con-box .accordian-product-list .list-item .basic-item{height:240px; transition: height 0.4s;}
	.accordian-con-box .accordian-product-list .list-item .basic-item .img{width:180px; padding-top:180px; margin:auto;}
	.accordian-con-box .accordian-product-list .list-item .basic-item .tit{padding:2rem; box-sizing:border-box;}
	.accordian-con-box .accordian-product-list .list-item .over-item{height:auto;}
	.accordion-list .accordion-item .accordion-arrow{bottom:auto; left:auto; top:2rem; right:2rem; transform:rotate(90deg); z-index:9; transition:all 0.4s}

	.accordion-list .accordion-item.accordion-active .accordion-arrow{transform:rotate(270deg); }
	.accordian-con-box .accordian-product-list .list-item.on .over-item{top:0;}
}
@media all and (max-width:480px){
	.accordian-tit-img span{left: calc(-1 * var(--area-padding)); width: calc(100% + (2 * var(--area-padding))); padding-top: calc(100% + (2 * var(--area-padding))); /* margin-top: -30%; */ margin-top:0; transform:translateX(0%);}
}


/* -------- 메인 컨텐츠 :: MENU -------- */
@media all and (max-width:1580px){
	.main-menu-con{padding:140px var(--area-padding) 80px;}
}
@media all and (max-width:1280px){
	.main-menu-con{padding:9rem var(--area-padding);}
	.main-footer-box{position: relative;}
}
@media all and (max-width:800px){
	.main-menu-list{display: block;}
	.main-menu-list .list-item{width:100%; margin-bottom:3rem;}
	.main-menu-list .list-item:last-child{margin-bottom:0;}
	.main-menu-list .list-item .txt-box{padding: 3rem 2.5rem 4rem;}

}