@charset "utf-8";

/* section01 */
/* 2023 SS season 리뉴얼 이전
.sec01{margin-bottom: 100px;}
.sec01 > ul > li{
	float: left;
	width: 25%;
}
.sec01 ul > li a{
	display: block;
	width: 100%;
	height: 100%;
}
.sec01 a img{
	width: 100%;
}*/
/* 2023 SS season 리뉴얼 이후 */
.sec01{
	margin: 0 auto 100px;
}
.sec01 > ul > li{
	position: relative;
	float: left;
	width: 33.333%;
}
.sec01 > ul > li:nth-child(3n){
	float: right;
}
.sec01 ul > li a{
	display: block;
	width: 100%;
	height: 100%;
}
.sec01 a img{
	width: 100%;
}
.sec01 li a img.hover_img{
	opacity: 0;
	position: absolute;
	left: 0; top: 0;
	transition: opacity .3s ease-in-out;
}
.sec01 li:hover a img.hover_img{
	opacity: 1;
}
.sec01 .vidBox{
	position: relative;
	overflow: hidden;
	height: 100%;
	padding-bottom: calc(100% + 25%);
}
.sec01 .vidBox iframe{
	position: absolute;
	width: calc(100% + 100%);
	height: 100%;
	left: 50%; transform: translateX(-50%);
}

/* section02 */
.sec02{
	text-transform: uppercase;
	margin-bottom: 100px;
	box-sizing: border-box;
	padding: 0 40px;
}
.sec02 ul li{
	float: left;
	width: 50%;
	box-sizing: border-box;
	padding-right: 25px;
}
.sec02 ul li:last-child{
	float: right;
	padding-left: 25px;
	padding-right: 0;
}
.sec02 .txtWrap{
	box-sizing: border-box;
	padding: 20px 0 0;
	line-height: 1;
}
.sec02 .txtWrap .tit{
	font-size: 3rem;
	font-weight: 500;
}
.sec02 .txtWrap .txt{
	font-size: 2rem;
	font-weight: 300;
	padding-top: 20px;
	line-height: 1.2;
}
.sec02 .txtWrap .date{
	font-size: 2rem;
	font-weight: 400;
	padding-top: 30px;
}
.sec02 ul li .imgBox{width: 100%;}

.sec02 li .imgBox {
	position: relative;
    padding-bottom: 56.25%;
}
.sec02 li .imgBox img{
	position: absolute;
	width: 100%;
	height: 100%;
}

.sec02 ul li .imgBox img{width :100%;}

/* sec02 ���� �ڽ� */
.sec02 .vidBox{
	 position: relative;
    padding-bottom: 56.25%;
    height: 0; 
    overflow: hidden;
}
.sec02 .vidBox iframe,
.sec02 .vidBox object,
.sec02 .vidBox embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.sec03 > h3{
	font-size: 2.6rem;
	font-weight: 500;
	letter-spacing: -1px;
	margin-bottom: 30px;
	padding: 0 40px;
}
.sec03 h3:hover a{
	color: #007549;
}
.sec03 h3 i{font-size: 2.4rem;}
.sec03 .contents{
	width: 100%;
}
/* �׺��� ���� (�ػ� 960px)
------------------------------------------------------ */
@media all and (max-width:960px) {
	.sec01{margin-bottom:10rem;}
	.sec02{margin-bottom:7rem; padding: 0 5%;}
	.sec02 .txtWrap{padding: 2rem 0 0;}
	.sec02 .txtWrap .tit{font-size:2.4rem;}
	.sec02 .txtWrap .txt, .sec02 .txtWrap .date{font-size: 1.6rem; padding-top: 10px; line-height: 1.3;}
	.sec03{padding: 0;}
	.sec03 h3{padding: 0 5%;}
}
/* max-width: 640px------------------------------------------------------ */
@media screen and (max-width:640px) {
	.sec01 > ul > li{width: 50%;}
	.sec02{padding: 0;}
	.sec02 ul li{width: 100%; padding-right: 0;}
	.sec02 ul li:last-child{padding-left: 0; margin-top: 5rem;}
	.sec02 .txtWrap{padding: 2rem 5% 0;}
}
