/* 메인비주얼영역 */
#mainVisual {width: 100%; height: 680px; padding-top: 80px;}
#visualArea {width: 300px; height: 100%; text-align: center; margin: 0 auto; padding: 5% 0 8%;}
#visualArea:after {display:block;content:"";clear:both}


.visual_text {font-family: 'InkLipquid'; width: 300px; line-height: 30px;display: inline-block;color: #fff; margin-top: 5%;}
.visual_text span {height: 30px; font-size: 30px; letter-spacing: 2px;margin-right: 5px;}
.visual_text span:last-child {margin-right: 0;}
.visual_img {width: 300px; height: 300px; margin: 0 auto; display: inline-block; background: url(../images/visual_img.png) center center no-repeat; background-size:cover;}



/*.visual_text {width: 400px; margin: 50px auto; text-align: center; color: #fff;}
.visual_text .top {font-size: 40px; font-weight: bold;}
.visual_text .top span {font-family: 'InkLipquid'; font-size: 90px; font-weight: normal;letter-spacing: 2px; display: inline-block;margin-right: 20px;}
.visual_text .bottom {font-size: 24px;font-weight: bold;letter-spacing: 1px;margin-top: 10px;}*/


/*
.visual_text {animation-name: visual; animation-duration: 3s;}
@keyframes visual {
    0% {opacity: 0; transform: scale(0.8);}
    100% {opacity: 1; transform: scale(1);}
}
*/

/* 메인섹션영역*/
#mainArea{width: 1200px; margin: 50px auto 100px;}
#mainArea section {margin: 0 auto 100px;}

#mainArea section .sec_title {text-align: center;margin-bottom: 30px;}
#mainArea section .sec_title p {font-size: 28px;font-weight: bold;}
#mainArea section .sec_title span {width: 50px; height: 30px;display: block;margin: 0 auto; border-bottom: 3px solid #96c539;}

.section1Area {width:100%; height: 300px;  text-align: center; overflow:hidden; position:relative; border: 1px solid #ddd; }
.section1Area a {width: 100%; height: 100%; display: table; transition: all .3s ease-in-out;}
.section1Area .text {width:80%; display: table-cell; vertical-align: middle; transition: all .5s ease-in-out;}
.section1Area .text .top {font-size: 46px;font-weight: bolder; color: #ff0000; margin-bottom: 10px;}
.section1Area .text .bottom {font-size: 20px;font-weight: 600;color: #333;}
.section1Area:hover {box-shadow: 2px 2px 20px #aaa;}
.section1Area a:hover .text {transform: scale(1.1);}

.sec_contents1 {width: 100%;}
.sec_contents1:after {display:block;content:"";clear:both}
.sec_contents1 article {width: 32%; height: 480px; float: left; position: relative; margin-left: 2%; border: 1px solid #ccc; background: #fff; transition: all .2s ease-in-out;}
.sec_contents1 article:first-child {margin-left: 0;}
.sec_contents1 article:hover {box-shadow: 2px 2px 8px #aaa;}
.sec_contents1 article a {width: 100%; height: 100%; display: block;}

.sec_contents1 .con_img {width: 100%; overflow:hidden; background: #f0f0f0;height:329px;}
.sec_contents1 .con_img img {width: 100%;}

.con_img_M {display:none;}

.section2Area .sec_contents1 article {width:49%; height:400px; overflow: hidden;}
.section2Area .sec_contents1 article .con_img { height:249px; overflow: hidden;}


.con_text1 {width: 100%; height: 150px; padding:30px; position: absolute; bottom: 0; background:#fff; border-bottom: 5px solid #96c539;}
.con_text1 p:nth-child(1){font-size: 20px; font-weight: bold;margin-bottom: 15px;}
.con_text1 p:nth-child(2){font-size: 17px;line-height: 25px;}

.sec_contents2>div {width: 100%;margin-bottom: 50px;}
.sec_contents2>div:last-child {margin-bottom: 0px;}
.sec_contents2>div:after {display:block;content:"";clear:both}
.sec_contents2 article {width: 23.5%; height: 252px; float: left; margin-left: 2%; border: 1px solid #ccc; background: #f0f0f0 url(../images/cont_bg_logo.png) center center no-repeat; transition: all .3s ease-in-out;}
.sec_contents2 article:first-child {margin-left: 0;}
.sec_contents2 article:hover {border: 1px solid #96c539; box-shadow: 0px 0px 5px #96c539;}
.sec_contents2 article.m_hide:hover {border: 1px solid #ccc; box-shadow: none;}
.sec_contents2 article a {width: 100%; height: 100%; display: block;}


.sec_contents2 .con_img {width: 100%; height: 170px; overflow:hidden; background: #f0f0f0; position:relative;}
.sec_contents2 .con_img img {height: 100%; position:absolute;left:50%; top:50%; transform: translate(-50%,-50%);}

.con_text2 {width: 100%; height: 80px; line-height: 30px; background: #fff; color: #333; padding-top:10px; box-sizing:border-box;}
.con_text2 p{font-size: 20px; font-weight: bold;text-align: center;}
.con_text2 p.sub{font-size: 15px;text-align: center;font-weight:normal;letter-spacing: -0.5px;}


/* 가을호 추가 영역 */

.mab_20 {margin-bottom: 20px;}


@media only screen and (max-width: 1200px) {
	#mainArea {width: 100%;padding: 0 10px;}
}

@media only screen and (max-width: 1000px) {
	.section1Area .text {text-align:right; padding-right: 200px;}
}

@media only screen and (max-width: 900px) {
	#mainVisual {height: 500px;}
	.visual_img {width: 150px; height: 300px;}

	#mainArea {margin: 30px auto 100px;}
	#mainArea section {margin: 0 auto 50px;}

	.section1Area .text {text-align:right; padding-right: 10%;}
	.section1Area .text .top {font-size: 36px;}
	.section1Area .text .bottom {font-size: 20px;}

	.sec_contents1 article {width: 100%; height: 230px; float: none; margin: 0 0 30px;}
	.sec_contents1 .con_img {width: 60%; height: 230px;}
	.con_text1 {width: 40%; height: 130px; padding: 30px 10px 0; right:0; border:0;}
	.con_text1 p:nth-child(1){color: #96c539;}
	.con_text1 br {display:none;}

	.section2Area .sec_contents1 article {width: 100%; height: 230px; float: none; margin: 0 0 30px;}
	.section2Area .sec_contents1 .con_img {width: 60%; height: 230px;}

    .section3Area .con_img > img {margin-top:-70px;}
	
	.sec_contents2>div:first-child {margin-bottom: 0;}
	.sec_contents2 article {width: 49%; height: auto; margin-left: 2%; margin-bottom: 20px;}
	.sec_contents2 article:nth-child(3) {margin-left: 0;}
	.sec_contents2 .con_img {width: 100%; height: 270px;}
	.sec_contents2 .con_img img {height: 100%;}
}

@media only screen and (max-width: 650px) {
	.section1Area .text {padding-right: 30px;}
	.section1Area .text .top {font-size: 28px;}
	.section1Area .text .bottom {font-size: 17px;}

	.sec_contents2 .con_img {width: 100%; height: 190px;}
}

@media only screen and (max-width: 550px) {
	#mainVisual {height: 400px;}
	.visual_img {width: 145px; height: 145px;margin-top:5%;}
	.visual_text span {font-size: 24px;}

	.section1Area .text {width:100%; background: rgba(255,255,255,0.9); text-align:center; padding: 20px 0; display:inline; position: absolute; left:0; bottom:0;}
	
	.sec_contents1 article {width: 100%; height: 300px;}
	.sec_contents1 .con_img {width: 100%; height: 190px;}
	.section2Area .sec_contents1 article .con_img {height:190px;}
	.con_text1 {width: 100%; height: auto; padding: 15px 20px 10px; right:0; border-bottom: 5px solid #96c539;}

	.section2Area .sec_contents1 article {width: 100%; height: 300px;}
	.section2Area .sec_contents1 .con_img {width: 100%; height: 100%;}

	.sec_contents2>div:first-child {margin-bottom: 20px;}
	.sec_contents2 article {width: 100%;margin-left: 0; margin-bottom: 20px;}
	.sec_contents2 article:last-child {margin-bottom: 0;}
	.sec_contents2 .con_img {width: 100%; height: 200px;}
	.sec_contents2 .con_img img {width: 100%; height:auto;}
	.con_text1 p:nth-child(1){color: inherit; margin-bottom: 5px;}

	.m_hide {display:none;}
}
@media only screen and (max-width: 375px) {
	.section3Area .con_img > img {margin-top:-60px;}
}
@media only screen and (max-width: 350px) {
	.sec_contents2 .con_img img {width: auto; height:100%;}
	.section3Area .con_img > img {margin-top:-40px;}
}