/*
+----------------------------------------------------------------------+
| Copyright (c) 2010-2019 STUDYMAX. co. Ltd
+----------------------------------------------------------------------+
| 작업일 : 2019-05-23
| 파일설명 : 생생표현과정 오픈이벤트 PC CSS
+----------------------------------------------------------------------+
| 작업자 : 우현진        
+----------------------------------------------------------------------+
| 수정이력

+----------------------------------------------------------------------+
*/

@charset "utf-8";


/*공통*/
.innerContent{width: 1100px; margin:0 auto;}
.minH560{min-height:560px;}
.minH730{min-height:730px;}
.mgBottom_25{margin-bottom: 25px;}
.mgBottom_35{margin-bottom: 35px;}
.mgBottom_55{margin-bottom: 55px;}
.mgBottom_70{margin-bottom: 70px;}
.mgBottom_80{margin-bottom: 80px;}
.textIndent_9{text-indent: 9px;}

/*영역*/
.mainIntro{height: 947px;background: url('/smciImages/front/community/event/event123/event123_01.png') no-repeat 50% 0; }
.bgImg_green{height: 2110px;background: url('/smciImages/front/community/event/event123/green_bg.png') no-repeat 50% 0; }
.section2Cont{padding: 85px 0 63px;}
.section3Cont{text-align: center;}
.section4Cont{padding: 90px 0;}
.section5Cont{width: 1102px; margin: 0 auto; padding: 0 0 60px;}

/* bg색상 */
.bgColor_d0fff4{background-color:#d0fff4}
.bgColor_f3f3f3{background-color:#f3f3f3}

/*버튼 위치*/
.btnDetail02{bottom:75px; left: 0; width: 100%; margin: 0 auto;}

/* 영상위치 */
.mainIntroMovieBox{position: absolute;left: 50%;top: 345px;margin-left: -457px;}

/*gif*/
.flowerGif{position: absolute;bottom: 96px;left: 50%;margin-left: -545px;}

/*감상평*/
.admireArea textarea{width: 1000px;height: 94px;padding: 20px;border: 2px solid #D3D3D3;background-color: #fff;resize: none; font-family: 'Malgun Gothic', dotum, sans-serif;font-size: 21px;color: #a8a8a8;}

/*상품영역*/
.selectWrap{width: 1012px; margin:  0 auto 50px;}
.selectWrap:after{content:''; display: block; clear: both;}
.selectWrap > ul > li{float: left; width: 294px; margin-left: 65px;}
.selectWrap > ul > li:first-child{margin-left: 0;}
.selectWrap > ul > li > a{display: inline-block; width: 294px; height: 221px;}
.selectWrap .userSelOne{background: url(/smciImages/front/community/event/event123/event_sel_1.png);}
.selectWrap .userSelTwo{background: url(/smciImages/front/community/event/event123/event_sel_2.png);}
.selectWrap .userSelThree{background: url(/smciImages/front/community/event/event123/event_sel_3.png);}

.selectWrap .userSelOne:hover, .selectWrap .userSelOne.active{background: url(/smciImages/front/community/event/event123/event_sel_1_on.png);}
.selectWrap .userSelTwo:hover, .selectWrap .userSelTwo.active{background: url(/smciImages/front/community/event/event123/event_sel_2_on.png);}
.selectWrap .userSelThree:hover, .selectWrap .userSelThree.active{background: url(/smciImages/front/community/event/event123/event_sel_3_on.png);}

.selectWrap .userSelOne.selDefault{background: url(/smciImages/front/community/event/event123/event_sel_1_on.png);}

/* 유의사항 */
.eventNoticeWrap{text-align: left;}
.eventNoticeWrap .eventNoticeInner{width: 1000px;margin: 0 auto;padding: 61px 0 50px; font-size: 0;}
.eventNoticeWrap .eventNoticeTitle{display: inline-block;margin-right: 30px;vertical-align: top;text-align: left;font-size: 24px;font-family: 'Malgun Gothic', dotum, sans-serif;color:#1a1a1a;margin-bottom: 10px;font-weight: bold;}
.eventNoticeWrap .noticeList {display: inline-block;}
.eventNoticeWrap .noticeList ul li{letter-spacing: -1px;color:#4a4a4a;padding: 5px 0;font-size: 18px;font-family: 'Malgun Gothic', dotum, sans-serif;}


/*컨텐츠 animation*/
.directionArea{position: relative;}
.direction01.directionOn{animation: move 0.8s ease; -webkit-animation: move 0.8s ease;}
.direction02.directionOn{animation: move 2.6s ease; -webkit-animation: move 1.2s ease;}
.direction03.directionOn{animation: move 3.4s ease; -webkit-animation: move 1.6s ease;}
.direction04.directionOn{animation: move 4.4s ease; -webkit-animation: move 2.0s ease;}

@keyframes move {
 0% {
 		transform: translateY(30px);
		transition: transform 1.2s cubic-bezier(0.38, 1, 0, 1), opacity 0.6s ease;
		opacity: 0;
 }
 100% {
 		transform: translateY(0px);
		transition: transform 1.2s cubic-bezier(0.38, 1, 0, 1), opacity 0.6s ease;
		opacity: 1;
 }
}
@-webkit-keyframes move {
 0% {
 		transform: translateY(30px);
		transition: transform 1.2s cubic-bezier(0.38, 1, 0, 1), opacity 0.6s ease;
		opacity: 0;
 }
 100% {
 		transform: translateY(0px);
		transition: transform 1.2s cubic-bezier(0.38, 1, 0, 1), opacity 0.6s ease;
		opacity: 1;
 }
}