@charset "utf-8";

.container {width:1200px;}

	@media screen and (max-width:1219px){
		.container {width:100%; padding:0 2%;}
	}

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:84vh; position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
#mainVisual .mainVisualWrap, 
#mainVisual .mainVisualCon, 
#mainVisual .slick-list,  
#mainVisual .slick-track, 
.item{ height:100%; }

.mainVisualWrap {position:relative; z-index:2;}

	@media screen and (max-width:799px){
		#mainVisual {height:74vh;}
	}

	@media screen and (max-width:499px){
		#mainVisual {height:64vh;}
	}

/* 메인 비주얼 ::이미지 */
.item {position:relative;}
.item .mainImg{
	width:100%;
	height:100%;
	background-size:cover !important;
	-ms-transform:scale(1.1,1.1);
    -o-transform:scale(1.1,1.1); 
    -moz-transform:scale(1.1,1.1); 
    -webkit-transform:scale(1.1,1.1); 
     transform:scale(1.1,1.1);
	-webkit-transition:transform 5000ms  ease-in-out ;
	-moz-transition:transform 5000ms ease-in-out ;
	-o-transition:transform 5000ms ease-in-out ;
	-ms-transition:transform 5000ms ease-in-out ;
    transition:transform 5000ms ease-in-out ;	
}

/* 메인 비주얼 ::텍스트 */
.item .text_box {position:absolute; width:1500px; top:50%; left:calc(50% - 750px); margin-top:-53px;}
.item .text_box h3.title,
.item .text_box p,
.item .text_box .main-visual-more-btn{
	opacity:0;filter:Alpha(opacity=0);
	-ms-transform:translateX(-50px); 
    -o-transform:translateX(-50px); 
    -moz-transform:translateX(-50px);
    -webkit-transform:translateX(-50px); 
     transform:translateX(-50px);
	-webkit-transition:opacity 1.0s, transform 1.0s;
	-moz-transition:opacity 1.0s, transform 1.0s;
	-o-transition:opacity 1.0s, transform 1.0s;
	-ms-transition:opacity 1.0s, transform 1.0s;
	transition:opacity 1.0s, transform 1.0s;
}
.item .text_box h3.title {display:block;font-size:42px; font-weight:600; color:#fff;}
.item .text_box h3.title em {font-style:normal; font-size:26px; font-weight:500; display:block; margin-bottom:20px;}
.item .text_box p{margin-top:15px; font-weight:400; font-size:24px; color:#fff; line-height:120%; -webkit-transition-delay:0.3s;-moz-transition-delay:0.3s;-o-transition-delay:0.3s;-ms-transition-delay:0.3s;transition-delay:0.3s;}
.item .text_box .main-visual-more-btn {display:inline-block; letter-spacing:0.05em; font-size:16px; font-weight:400; margin-top:60px; color:#fff; text-transform:uppercase; width:180px; line-height:48px; height:50px; border:1px solid rgba(256,256,256,0.3); text-align:center; padding-left:20px; -webkit-transition-delay:0.5s;-moz-transition-delay:0.5s;-o-transition-delay:0.5s;-ms-transition-delay:0.5s;transition-delay:0.5s;}
.item .text_box .main-visual-more-btn span.bul {display:block;position:absolute;top:calc(50% - 4px);left:25px;background:#fff;transition:all .5s;width:2px;height:8px;margin:0;}
.item .text_box .main-visual-more-btn span.bul:after {content:"";display:block;position:absolute;top:0;width:8px;height:2px;margin:3px 0 0 -3px;background:#fff;}
/* 메인 비주얼 ::active효과 */
.item.active-item .mainImg{
	-ms-transform:scale(1.0,1.0) rotate(0.0001deg);
    -o-transform:scale(1.0,1.0) rotate(0.0001deg);
    -moz-transform:scale(1.0,1.0) rotate(0.0001deg);
    -webkit-transform:scale(1.0,1.0) rotate(0.0001deg);
     transform:scale(1.0,1.0) rotate(0.0001deg);
}
.item.active-item h3.title,
.item.active-item p,
.item.active-item .main-visual-more-btn{
	opacity:1.0;filter:Alpha(opacity=100);
	-ms-transform:translateX(0px); 
    -o-transform:translateX(0px); 
    -moz-transform:translateX(0px);
    -webkit-transform:translateX(0px); 
     transform:translateX(0px);
}

	@media screen and (max-width:1419px){
		.item .text_box {width:100%; left:auto; padding:0 5%;}
	}

	@media screen and (max-width:799px){
		.item .mainImg.main02 {background-position:65% 50% !important;}
		.item .text_box {top:45%;}
	}

	@media screen and (max-width:499px){
		.item .text_box {top:47%;}
	}


#mainVisual .slick-arrow {position:absolute; top:calc(50% - 1px); width:10px; height:14px; background-color:inherit; background-repeat:no-repeat; background-position:50% 50%; margin-top:-110px; cursor:pointer; border:0; cursor:pointer; z-index:9999; font-size:0;}

#mainVisual .slick-arrow.slick-prev {left:calc(50% - 746px); background-image:url('../img/main/prevBtn.png');}
#mainVisual .slick-arrow.slick-next {left:calc(50% - 644px); background-image:url('../img/main/nextBtn.png'); border-left:0;}

#mainVisual .slick-dots {position:absolute; left:calc(50% - 750px); top:29%; z-index:1099;}
#mainVisual .slick-dots li {display:inline-block; margin:0 1px; width:30px; height:2px; overflow:hidden; font-size:0;}
#mainVisual .slick-dots li button {width:100%;}

#mainVisual .slick-counter {position:absolute; width:1500px; top:50%; left:calc(50% - 718px); margin-top:-115px; color:#fff; z-index:1009;}
#mainVisual .slick-counter .active {font-weight:900;}
#mainVisual .slick-counter .total {font-weight:300;}

	@media screen and (max-width:1419px){
		#mainVisual .slick-arrow.slick-prev {left:5%;}
		#mainVisual .slick-arrow.slick-next {left:calc(5% + 90px);}
		#mainVisual .slick-counter {width:100%; padding:0 calc(5% + 20px); left:0;}
	}

	@media screen and (max-width:799px){
		#mainVisual .slick-arrow {top:45%;}
		#mainVisual .slick-counter {top:45%;}
	}

	@media screen and (max-width:499px){
		#mainVisual .slick-arrow {top:47%;}
		#mainVisual .slick-counter {top:47%;}
	}

/*scroll icon */
@-webkit-keyframes bounce {
	0%, 20%, 50%, 80%, 100% {-webkit-transform:translateY(0);}
	40% {-webkit-transform:translateY(-30px);}
	60% {-webkit-transform:translateY(-15px);}
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform:translateY(0);}
	40% {transform:translateY(-30px);}
	60% {transform:translateY(-15px);}
}
.scrollDown{position:absolute; bottom:3%; width:100%; text-align:center; z-index:999;}
.scrollDown.bounce {display:block; animation:bounce 2.5s infinite;}


	@media screen and (max-width:999px){
		.item .text_box h3.title {font-size:220%;}
		.item .text_box h3.title em {font-size:62%;}
	}

	@media screen and (max-width:799px){
		.item .text_box h3.title {font-size:180%;}
	}

	@media screen and (max-width:499px){
		.item .text_box h3.title {font-size:140%;}
	}


/* ===================================== 메인컨텐츠 ===================================== */
#mainContents {font-size:20px;}
#mainContents .br {display:block;}

	@media screen and (max-width:1419px){
		#mainContents {font-size:18px;}
		#mainContents .br {display:inline;}
	}

	@media screen and (max-width:999px){
		#mainContents {font-size:110%;}
	}

	@media screen and (max-width:799px){
		#mainContents {font-size:100%;}
	}

	@media screen and (max-width:499px){
		#mainContents {font-size:90%;}
	}



/* 메인컨텐츠 - 공통 */
.mainSec .titleBox {}
.mainSec .titleBox h3 {opacity:0; font-size:48px; letter-spacing:-0.05em;}
.mainSec .titleBox h3 .sTit {display:block; font-size:24px; color:#0d6e5e; letter-spacing:0; margin-bottom:15px;}
.mainSec .titleBox p {opacity:0; font-weight:300; margin-top:31px; word-break:keep-all; line-height:140%;}
.mainSec .titleBox .more {opacity:0; display:block; margin-top:43px; display:inline-block;}
.mainSec .titleBox .more .arrow {display:inline-block;}

	@media screen and (max-width:1619px){
	}

	@media screen and (max-width:1419px){
		.mainSec .titleBox h3 {font-size:42px;}
		.mainSec .titleBox h3 .sTit {font-size:22px;}
	}

	@media screen and (max-width:1199px){
		.mainSec .titleBox h3 {font-size:36px;}
		.mainSec .titleBox h3 .sTit {font-size:20px;}
		.mainSec .titleBox .more {margin-top:33px;}
	}

	@media screen and (max-width:999px){
		.mainSec .titleBox h3 {font-size:180%;}
		.mainSec .titleBox h3 .sTit {font-size:60%;}
		.mainSec .titleBox .more {margin-top:23px;}
	}

	@media screen and (max-width:799px){
		.mainSec .titleBox h3 {font-size:160%;}
		.mainSec .titleBox h3 .sTit {font-size:60%; margin-bottom:10px;}
		.mainSec .titleBox .more {margin-top:18px;}
	}

	@media screen and (max-width:499px){
		.mainSec .titleBox h3 {font-size:140%;}
	}


/* effect */
.show .titleBox h3,
.show .titleBox p {opacity:1; animation:fadeInDown 1s both;}
.show .titleBox p {animation-delay: 0.1s !important;}
.show .titleBox .more {opacity:1; animation:fadeInRight 1s both; animation-delay: 0.2s !important;}
.show .titleBox .more:hover .arrow {animation: arrowbounce 1s backwards;}

	@keyframes arrowbounce {
		0%, 20%, 50%, 80%, 100% {transform: translateX(0);}
		40% {transform: translateX(20px);}
		60% {transform: translateX(10px);}
	}


/* 메인컨텐츠 - 퀵 */
.mainSec.mainQuick {position:relative; text-align:center; padding:185px 0 192px;}
.mainSec.mainQuick .quickBox {margin-top:76px;}
.mainSec.mainQuick .quickBox ul {display:flex; justify-content: space-between; width:920px; margin:0 auto;}
.mainSec.mainQuick .quickBox ul li {opacity:0; position:relative; width:25%; max-width:200px; font-family:'Eulyoo1945', sans-serif; padding-bottom:23px;}
.mainSec.mainQuick .quickBox ul li:after {position:absolute; display:block; width:100%; height:2px; bottom:0; background:#c5ddd9; content:'';}
.mainSec.mainQuick .quickBox ul li a {display:flex; flex-direction: column; align-items: center;}
.mainSec.mainQuick .quickBox ul li a .icon {display:block; width:51px; height:51px; background-position:center; background-size:contain; background-repeat:no-repeat; margin-bottom:27px;}
.mainSec.mainQuick .quickBox ul li.quick01 a .icon {background-image:url('../img/main/mainQuick01.png');}
.mainSec.mainQuick .quickBox ul li.quick02 a .icon {background-image:url('../img/main/mainQuick02.png');}
.mainSec.mainQuick .quickBox ul li.quick03 a .icon {background-image:url('../img/main/mainQuick03.png');}
.mainSec.mainQuick .quickBox ul li.quick04 a .icon {background-image:url('../img/main/mainQuick04.png');}

.mainSec.mainQuick .quickBox ul li:hover {transition:0.1s ease-in-out; }
.mainSec.mainQuick .quickBox ul li:hover:after {background:#0a7161;}
.mainSec.mainQuick .quickBox ul li:hover a {color:#0a7161; font-weight:500;}

	@media screen and (max-width:1419px){
		.mainSec.mainQuick .titleBox p .br {display:block !important;}
	}

	@media screen and (max-width:999px){
		.mainSec.mainQuick {padding:155px 0 162px;}
	}

	@media screen and (max-width:939px){
		.mainSec.mainQuick .quickBox ul {width:100%; padding:0 2%;}
		.mainSec.mainQuick .quickBox ul li {width:22%;}
	}

	@media screen and (max-width:799px){
		.mainSec.mainQuick {padding:115px 0 122px;}
		.mainSec.mainQuick .titleBox p .br {display:inline !important;}
		.mainSec.mainQuick .quickBox {padding:0 3%;}
		.mainSec.mainQuick .quickBox ul {flex-wrap: wrap; margin-top:-30px;}
		.mainSec.mainQuick .quickBox ul li {width:50%; margin-top:30px;}
	}

	@media screen and (max-width:499px){
		.mainSec.mainQuick {padding:85px 0 92px;}
		.mainSec.mainQuick .quickBox ul li {width:48%;}
	}

/* effect */
.mainQuick .show .quickBox ul li {opacity:1; animation:fadeInLeft 1s both;}
.mainQuick .show .quickBox ul li.quick01 {animation-delay: 0.3s;}
.mainQuick .show .quickBox ul li.quick02 {animation-delay: 0.4s;}
.mainQuick .show .quickBox ul li.quick03 {animation-delay: 0.5s;}
.mainQuick .show .quickBox ul li.quick04 {animation-delay: 0.6s;}


/* 메인컨텐츠 - 전통안료 특장점*/
.mainSec.mainTraditional {background:url('../img/main/mainTraditionalBg.jpg') center no-repeat; background-size:cover; padding:210px 0 180px;}
.mainSec.mainTraditional .container {display:flex; flex-direction: row-reverse; width:1400px;}
.mainSec.mainTraditional .titleBox {width:46%; padding-left:8%;}
	
	@media screen and (max-width:1199px){
		.mainSec.mainTraditional .titleBox {padding-left:4%;}
	}

	@media screen and (max-width:999px){
		.mainSec.mainTraditional .titleBox {width:100%; padding:0 4%;}
	}


.mainSec.mainTraditional .sliderBox {position:relative; width:54%; padding-left:27px;}
.mainSec.mainTraditional .sliderBox .circle {position:absolute; top:-27px; right:-23px; z-index:2; animation: cirTxt 8s linear infinite;}

	@media screen and (max-width:1419px){
		.mainSec.mainTraditional .container {width:100%; align-items: center;}
	}

	@media screen and (max-width:999px){
		.mainSec.mainTraditional {padding:140px 0 110px;}
		.mainSec.mainTraditional .container {flex-direction: column;}
		.mainSec.mainTraditional .sliderBox {width:100%; margin-top:60px; padding:0 4%;}
		.mainSec.mainTraditional .sliderBox .circle {right:-2%;}
	}

	@media screen and (max-width:799px){
		.mainSec.mainTraditional {padding:100px 0 70px;}
		.mainSec.mainTraditional .sliderBox .circle {top:-8px;}
		.mainSec.mainTraditional .sliderBox .circle img {width:80px;}
	}

	@media screen and (max-width:499px){
		.mainSec.mainTraditional {padding:70px 0 40px;}
	}

	@keyframes cirTxt{ 
		100% { 
			transform: rotate(360deg);
		} 
	}


.mainSec.mainTraditional .sliderBox .slick-counter {position:relative; left:30px; font-family: 'Montserrat', sans-serif; letter-spacing:0.05em; font-size:16px; font-weight:400; color:#666; margin-bottom:6px;}
.mainSec.mainTraditional .sliderBox .slick-counter .active {font-size:20px; font-weight:700; color:#000; min-width:15px;}
.mainSec.mainTraditional .sliderBox .slick-arrow {position:absolute; top:-23px; width:8px; height:11px; background-color:inherit; background-repeat:no-repeat; background-position:50% 50%; cursor:pointer; border:0; cursor:pointer; z-index:2; font-size:0;}
.mainSec.mainTraditional .sliderBox .slick-arrow.slick-prev {left:8px; background-image:url('../img/main/sliderPrevBtn.png');}
.mainSec.mainTraditional .sliderBox .slick-arrow.slick-next {left:80px; background-image:url('../img/main/sliderNextBtn.png'); border-left:0;}
.mainSec.mainTraditional .sliderBox .item {display:flex;}
.mainSec.mainTraditional .sliderBox .colorBox {width:100%; margin:0 7px;}
.mainSec.mainTraditional .sliderBox .mainColor {position:relative;}
.mainSec.mainTraditional .sliderBox .mainColor .box {max-width:220px; width:100%; height:260px; margin:20px 0;}
.mainSec.mainTraditional .sliderBox .mainColor .box:before {content: ""; width:100%; max-width:220px; height: 0; position: absolute; top: -20px; left: 0; border-bottom: 20px solid pink; border-left: 20px solid transparent; border-right: 20px solid transparent; z-index:2;}
.mainSec.mainTraditional .sliderBox .mainColor .box:after {content: ""; width:100%; max-width:220px; height: 0; position: absolute; bottom: -20px; left: 0; border-top: 20px solid pink; border-left: 20px solid transparent; border-right: 20px solid transparent; z-index:2;}
.mainSec.mainTraditional .sliderBox .mainColor .tit {position:absolute; width:100%; bottom:6px; text-align:center; color:#fff; font-size:20px; font-weight:300;}
.mainSec.mainTraditional .sliderBox .mainColor .tit .sTit {display:block; font-size:16px;}
.mainSec.mainTraditional .sliderBox .subColor {display:flex; flex-wrap: wrap; margin-top:25px; margin-left:-5px;}
.mainSec.mainTraditional .sliderBox .subColor li {width:calc(20% - 5px); max-width:40px; height:20px; margin-top:5px; margin-left:5px;}
		
	@media screen and (max-width:1199px){
		.mainSec.mainTraditional .sliderBox .mainColor .box {height:200px;}
		.mainSec.mainTraditional .sliderBox .mainColor .tit {font-size:18px;}
		.mainSec.mainTraditional .sliderBox .mainColor .tit .sTit {font-size:13px;}
		.mainSec.mainTraditional .sliderBox .subColor li {height:15px;}
	}	

	@media screen and (max-width:999px){
		.mainSec.mainTraditional .sliderBox .mainColor .box {height:240px;}
	}

	@media screen and (max-width:799px){
		.mainSec.mainTraditional .sliderBox .mainColor .box {height:180px;}
	}

	@media screen and (max-width:499px){
		.mainSec.mainTraditional .sliderBox .item {flex-direction: column;}
		.mainSec.mainTraditional .sliderBox .colorBox {width:98%; margin:0 1% 10px;}
		.mainSec.mainTraditional .sliderBox .mainColor .box {max-width:100%; height:80px;}
		.mainSec.mainTraditional .sliderBox .mainColor .box:before {max-width:100%; top: -10px; border-bottom: 10px solid pink; border-left: 10px solid transparent; border-right: 10px solid transparent;}
		.mainSec.mainTraditional .sliderBox .mainColor .box:after {max-width:100%; bottom: -10px; border-top: 10px solid pink; border-left: 10px solid transparent; border-right: 10px solid transparent;}
		.mainSec.mainTraditional .sliderBox .mainColor .tit {font-size:100%; bottom:0;}
		.mainSec.mainTraditional .sliderBox .subColor {margin-top:-5px;}
		.mainSec.mainTraditional .sliderBox .subColor li {max-width:100%; margin-top:3px;}
	}


/* 뇌록 */
.mainSec.mainTraditional .sliderBox .color01 .mainColor .box {background:#365444;}
.mainSec.mainTraditional .sliderBox .color01 .mainColor .box:before {border-bottom-color:#365444;}
.mainSec.mainTraditional .sliderBox .color01 .mainColor .box:after {border-top-color:#365444;}
.mainSec.mainTraditional .sliderBox .color01 .subColor li.sub01 {background-color:#4a644e;}
.mainSec.mainTraditional .sliderBox .color01 .subColor li.sub02 {background-color:#727868;}
.mainSec.mainTraditional .sliderBox .color01 .subColor li.sub03 {background-color:#85937a;}
.mainSec.mainTraditional .sliderBox .color01 .subColor li.sub04 {background-color:#98a393;}
.mainSec.mainTraditional .sliderBox .color01 .subColor li.sub05 {background-color:#7e845b;}

/* 군청,석청 */
.mainSec.mainTraditional .sliderBox .color02 .mainColor .box {background:#264450;}
.mainSec.mainTraditional .sliderBox .color02 .mainColor .box:before {border-bottom-color:#264450;}
.mainSec.mainTraditional .sliderBox .color02 .mainColor .box:after {border-top-color:#264450;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub01 {background-color:#14304a;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub02 {background-color:#153960;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub03 {background-color:#224259;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub04 {background-color:#214f6b;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub05 {background-color:#275569;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub06 {background-color:#2d696f;}
.mainSec.mainTraditional .sliderBox .color02 .subColor li.sub07 {background-color:#4d6f6f;}

/* 하엽,석록 */
.mainSec.mainTraditional .sliderBox .color03 .mainColor .box  {background:#287f64;}
.mainSec.mainTraditional .sliderBox .color03 .mainColor .box:before {border-bottom-color:#287f64;}
.mainSec.mainTraditional .sliderBox .color03 .mainColor .box:after {border-top-color:#287f64;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub01 {background-color:#207a5e;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub02 {background-color:#50836a;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub03 {background-color:#30926c;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub04 {background-color:#459b77;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub05 {background-color:#519a7a;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub06 {background-color:#5f9074;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub07 {background-color:#779b83;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub08 {background-color:#749a81;}
.mainSec.mainTraditional .sliderBox .color03 .subColor li.sub09 {background-color:#a7b7a6;}

/* 황토 */
.mainSec.mainTraditional .sliderBox .color04 .mainColor .box  {background:#955c2b;}
.mainSec.mainTraditional .sliderBox .color04 .mainColor .box:before {border-bottom-color:#955c2b;}
.mainSec.mainTraditional .sliderBox .color04 .mainColor .box:after {border-top-color:#955c2b;}
.mainSec.mainTraditional .sliderBox .color04 .subColor li.sub01 {background-color:#b78f55;}
.mainSec.mainTraditional .sliderBox .color04 .subColor li.sub02 {background-color:#ba8f4f;}
.mainSec.mainTraditional .sliderBox .color04 .subColor li.sub03 {background-color:#cdb083;}
.mainSec.mainTraditional .sliderBox .color04 .subColor li.sub04 {background-color:#b2784c;}

/* 석황 */
.mainSec.mainTraditional .sliderBox .color05 .mainColor .box  {background:#d7b545;}
.mainSec.mainTraditional .sliderBox .color05 .mainColor .box:before {border-bottom-color:#d7b545;}
.mainSec.mainTraditional .sliderBox .color05 .mainColor .box:after {border-top-color:#d7b545;}
.mainSec.mainTraditional .sliderBox .color05 .subColor li.sub01 {background-color:#ddbd67;}
.mainSec.mainTraditional .sliderBox .color05 .subColor li.sub02 {background-color:#f0d07b;}

/* 주사 */
.mainSec.mainTraditional .sliderBox .color06 .mainColor .box  {background:#a03b2f;}
.mainSec.mainTraditional .sliderBox .color06 .mainColor .box:before {border-bottom-color:#a03b2f;}
.mainSec.mainTraditional .sliderBox .color06 .mainColor .box:after {border-top-color:#a03b2f;}
.mainSec.mainTraditional .sliderBox .color06 .subColor li.sub01 {background-color:#a34840;}
.mainSec.mainTraditional .sliderBox .color06 .subColor li.sub02 {background-color:#a34034;}
.mainSec.mainTraditional .sliderBox .color06 .subColor li.sub03 {background-color:#b05241;}
.mainSec.mainTraditional .sliderBox .color06 .subColor li.sub04 {background-color:#a44330;}
.mainSec.mainTraditional .sliderBox .color06 .subColor li.sub05 {background-color:#87493e;}

/* 석간주 */
.mainSec.mainTraditional .sliderBox .color07 .mainColor .box  {background:#90452f;}
.mainSec.mainTraditional .sliderBox .color07 .mainColor .box:before {border-bottom-color:#90452f;}
.mainSec.mainTraditional .sliderBox .color07 .mainColor .box:after {border-top-color:#90452f;}
.mainSec.mainTraditional .sliderBox .color07 .subColor li.sub01 {background-color:#744031;}
.mainSec.mainTraditional .sliderBox .color07 .subColor li.sub02 {background-color:#884838;}
.mainSec.mainTraditional .sliderBox .color07 .subColor li.sub03 {background-color:#7c3e2d;}

/* 대자 */
.mainSec.mainTraditional .sliderBox .color08 .mainColor .box  {background:#573a30;}
.mainSec.mainTraditional .sliderBox .color08 .mainColor .box:before {border-bottom-color:#573a30;}
.mainSec.mainTraditional .sliderBox .color08 .mainColor .box:after {border-top-color:#573a30;}
.mainSec.mainTraditional .sliderBox .color08 .subColor li.sub01 {background-color:#946b54;}
.mainSec.mainTraditional .sliderBox .color08 .subColor li.sub02 {background-color:#6d5348;}
.mainSec.mainTraditional .sliderBox .color08 .subColor li.sub03 {background-color:#9d6755;}
.mainSec.mainTraditional .sliderBox .color08 .subColor li.sub04 {background-color:#815e56;}
.mainSec.mainTraditional .sliderBox .color08 .subColor li.sub05 {background-color:#724332;}

/* 호분 */
.mainSec.mainTraditional .sliderBox .color09 .mainColor .box  {background:#e0dad0;}
.mainSec.mainTraditional .sliderBox .color09 .mainColor .box:before {border-bottom-color:#e0dad0;}
.mainSec.mainTraditional .sliderBox .color09 .mainColor .box:after {border-top-color:#e0dad0;}
.mainSec.mainTraditional .sliderBox .color09 .subColor li.sub01 {background-color:#d9d7ca;}
.mainSec.mainTraditional .sliderBox .color09 .subColor li.sub02 {background-color:#d1cbc4;}
.mainSec.mainTraditional .sliderBox .color09 .subColor li.sub03 {background-color:#d2d3cf;}
.mainSec.mainTraditional .sliderBox .color09 .subColor li.sub04 {background-color:#d5d5d0;}
.mainSec.mainTraditional .sliderBox .color09 .subColor li.sub05 {background-color:#c4c5c1;}

/* 백토 */
.mainSec.mainTraditional .sliderBox .color10 .mainColor .box  {background:#d6d8d2;}
.mainSec.mainTraditional .sliderBox .color10 .mainColor .box:before {border-bottom-color:#d6d8d2;}
.mainSec.mainTraditional .sliderBox .color10 .mainColor .box:after {border-top-color:#d6d8d2;}
.mainSec.mainTraditional .sliderBox .color10 .subColor li.sub01 {background-color:#d2d6d6;}

/* 송연 */
.mainSec.mainTraditional .sliderBox .color11 .mainColor .box  {background:#252625;}
.mainSec.mainTraditional .sliderBox .color11 .mainColor .box:before {border-bottom-color:#252625;}
.mainSec.mainTraditional .sliderBox .color11 .mainColor .box:after {border-top-color:#252625;}
.mainSec.mainTraditional .sliderBox .color11 .subColor li.sub01 {background-color:#30302f;}

/* 연홍 */
.mainSec.mainTraditional .sliderBox .color12 .mainColor .box  {background:#c59a7d;}
.mainSec.mainTraditional .sliderBox .color12 .mainColor .box:before {border-bottom-color:#c59a7d;}
.mainSec.mainTraditional .sliderBox .color12 .mainColor .box:after {border-top-color:#c59a7d;}
.mainSec.mainTraditional .sliderBox .color12 .subColor li.sub01 {background-color:#d19363;}
.mainSec.mainTraditional .sliderBox .color12 .subColor li.sub02 {background-color:#d47648;}
.mainSec.mainTraditional .sliderBox .color12 .subColor li.sub03 {background-color:#e4c0ca;}
.mainSec.mainTraditional .sliderBox .color12 .subColor li.sub04 {background-color:#be5882;}
.mainSec.mainTraditional .sliderBox .color12 .subColor li.sub05 {background-color:#b04f63;}


/* effect */
.mainTraditional .show .titleBox h3,
.mainTraditional .show .titleBox p {opacity:1; animation:fadeInRight 1s both; }

/* 메인컨텐츠 - 천연석채 특장점 */
.mainSec.mainEarth {padding:135px 0;}
.mainSec.mainEarth .container {display:flex; align-items: center; width:1600px;}
.mainSec.mainEarth .titleBox {width:50%; padding-left:128px;}
.mainSec.mainEarth .imageBox {width:50%;}
.mainSec.mainEarth .imageBox img {max-width:100%;}

	@media screen and (max-width:1619px){
		.mainSec.mainEarth .container {width:100%; padding:0 2%;}
		.mainSec.mainEarth .titleBox {padding-left:0;}
	}

	@media screen and (max-width:1199px){
		.mainSec.mainEarth .titleBox {width:52%; padding-right:2%;}
		.mainSec.mainEarth .imageBox {width:48%;}
	}

	@media screen and (max-width:999px){
		.mainSec.mainEarth {padding:105px 0;}
		.mainSec.mainEarth .container {flex-direction: column; padding:0 6%;}
		.mainSec.mainEarth .titleBox {width:100%;}
		.mainSec.mainEarth .imageBox {width:100%; margin-top:60px;}
	}

	@media screen and (max-width:499px){
		.mainSec.mainEarth {padding:75px 0;}
		.mainSec.mainEarth .imageBox {margin-top:30px;}

	}
	
/* effect */
.mainEarth .show .titleBox h3,
.mainEarth .show .titleBox p {animation:fadeInLeft 1s both;}
.mainEarth .show .titleBox .more {animation:fadeInLeft 1s both;}


/* 메인컨텐츠 - 갤러리 */
.mainSec.mainGallery {background:#fcfcfc; padding:110px 0;}
.mainSec.mainGallery .container {display:flex; justify-content: space-between; width:1200px;}
.mainSec.mainGallery .titleBox h3 {font-size:36px; font-weight:500;}
.mainSec.mainGallery .contentBox {position:relative;}
.mainSec.mainGallery .contentBox:before {position:absolute; display:block; width:100%; top:-74px; content:url('../img/main/mainQuickBg.png'); text-align:center; z-index:2;}

	@media screen and (max-width:1419px){
		.mainSec.mainGallery .titleBox h3 {font-size:32px;}
	}

	@media screen and (max-width:1199px){
		.mainSec.mainGallery .container {width:100%; padding:0 6%;}
		.mainSec.mainGallery .titleBox h3 {font-size:28px;}
	}

	@media screen and (max-width:999px){
		.mainSec.mainGallery .titleBox h3 {font-size:160%;}
	}

	@media screen and (max-width:799px){
		.mainSec.mainGallery .container {flex-direction: column;}
	}

	@media screen and (max-width:499px){
		.mainSec.mainGallery {padding:80px 0;}
	}


.mainGallery.show .swiper-slide {opacity:1; animation:fadeInLeft 1s both;}


.sec-footer {margin-top:0 !important;}