/*** main ***/
/** top visual **/
.topVisual {height: auto; background-image: url(../img/ban.jpg);overflow:hidden;min-width:1300px;height:850px;
 background-repeat: no-repeat; background-position: center;}
.topVisual .visBg {z-index: 1; position: absolute; left: 0; right: 0; top: 0; }
.topVisual .visBg div {width:0px; margin:0 auto; background-repeat: no-repeat; background-position: 50% 50%;}
.topVisual .visBg.visBg01 div {background-image: url(../img/ban.jpg);-height:850px;}
.topVisual .visBg.visBg02 div {background-image: url(../img/ban.jpg);-height:850px;}
.topVisual .visBg.visBg03 div {background-image: url(../img/ban.jpg);-height:850px;}
.topVisualWrap {z-index: 20; position: relative; width: 1260px; margin: 0 auto; text-align: center;}
.mainVisual {display: none; height: 800px;}
.mainVisual:first-child {display: block;}
.mainVisual > [class*="vis"] {position: absolute; top:146px;}
.topVisual .visImg01 {left: 0; width: 630px; height: 100%; text-align: right;}
.topVisual .visImg01 p {position: relative; height: 100%; overflow: hidden;}
.topVisual .visImg01 p img {position: absolute; right: -100%;}
.topVisual .visImg02 {right: 0; width: 630px; height: 100%; text-align: left;}
.topVisual .visImg02 p {position: relative; height: 100%; overflow: hidden;}
.topVisual .visImg02 p img {position: absolute; left: -100%;}
.topVisual .visTxt01 {top: 331px; left: 0; width: 100%; text-align: center;}
.topVisual .visTxt01 span {opacity: 0;}
.topVisual .visTxt02 {top: 407px; left: 0; width: 100%; text-align: center;}
.topVisual .visTxt02 span {opacity: 0;}
.topVisual .visTxt03 span {opacity: 0;}
.topVisual .visWeb {display: block;}
.topVisual .visMob {display: none;}
.mTopVisual .visWeb {display: none;}
.mTopVisual .visMob {display: block;}
.topVisual.vis02 [class*="visImg"], .topVisual.vis03 [class*="visImg"] {top: 146px;}
.topVisual.vis03 .visTxt01 {top: 342px;}
.topVisual.vis03 .visTxt02 {top: 379px;}
.topVisual .visTxt03 {display: none;}
.mTopVisual .visTxt01, .mTopVisual .visTxt02 {display: none;}
.mTopVisual .visTxt03 {display: block;}
.topVisualWrap .btnBrand {position: absolute; bottom: 240px; left: 0; width: 100%; text-align: center;}
.topVisualWrap .btnBrand > a {display: inline-block; width: 200px; height: 62px; padding-top: 20px; background-color: #e62149; font-family: "Noto Sans Bold"; font-size: 18px; text-align: center;}
.topVisualWrap .btnBrand > a, .topVisualWrap .btnBrand > a:hover, .topVisualWrap .btnBrand > a:focus {color: #fff;}
.topVisualWrap .btnBrand > a:hover, .topVisualWrap .btnBrand > a:focus {background-color: #b81a3a;}

/** promotion **/
.promotionWr {position: relative; overflow: hidden; width: 100%; height: 700px;}
.promotionWr > ul {position: absolute; top: 0; left: 0; overflow: hidden; width: 99999px;}
.promotionWr .swiper-slide {position: relative; float: left; width: 100%; height: 700px; background-repeat: no-repeat; background-position: 50% 100%;}
.promotionWr .swiper-pagination {position: absolute; left: 0; text-align: center; top:40px; z-index: 800; width: 100%;}
.promotionWr .swiper-pagination-switch {display: inline-block; width: 8px; height: 8px; border-radius: 8px; background: #b5c2cc; margin: 0 2px; cursor: pointer;}
.promotionWr .swiper-active-switch {width: 16px; background: #e51937;}
.promotionWr li a {display: block; width: 100%; height: 100%;}
.promotionWr li a > p, .promotionWr .detailView {position: absolute;  left: 50%; width: 560px; margin-left: -280px;}

.promotionWr li.on .tit {top: 80px;
	-webkit-animation:playTit 1s forwards;
	-moz-animation:playTit 1s forwards;
	-ms-animation:playTit 1s forwards;
	-o-animation:playTit 1s forwards;
	animation:playTit 1s forwards;
}
@-webkit-keyframes playTit {
	from {left: 40%;}
	  to {left: 50%; margin-left: -280px;}
}
@-moz-keyframes playTit {
	from {left: 40%;}
	  to {left: 50%; margin-left: -280px;}
}
@-ms-keyframes playTit {
	from {left: 40%;}
	  to {left: 50%; margin-left: -280px;}
}
@-o-keyframes playTit {
	from {left: 40%;}
	  to {left: 50%; margin-left: -280px;}
}
@keyframes playTit {
	from {left: 40%;}
	  to {left: 50%; margin-left: -280px;}
}
.promotionWr li.on .desc {top: 181px;
	-webkit-animation:playTit 1.3s forwards;
	-moz-animation:playTit 1.3s forwards;
	-ms-animation:playTit 1.3s forwards;
	-o-animation:playTit 1.3s forwards;
	animation:playTit 1.3s forwards;
}
/*.promotionWr .tit span{display: block; font-family: 'Nanum Myeongjo Bold'; font-size: 40px; line-height: 44px; text-align: center;}*/
/*.promotionWr .desc span {display: block; font-size: 16px; color: #343434; line-height: 23px; text-align: center;}*/


.promotionWr .tit {top: 80px; font-family: "Nanum Myeongjo Bold"; font-size: 40px; line-height: 44px; text-align: center;}
.promotionWr .desc {top: 181px; font-size: 16px; color: #343434; line-height: 23px; text-align: center;}
.promotionWr .detailView {top: 251px; text-align: center;}
.promotionWr .detailView span {display: inline-block; position: relative; height: 18px; font-family: "Noto Sans Bold"; font-size: 14px;}
.promotionWr .detailView span {color: #e51937;}
/*.promotionWr a:hover .detailView span, .promotionWr a:focus .detailView span {color: #a40f25;}*/
.promotionWr .detailView span:after {display: block; position: absolute; bottom: 0; left: 0; content: ""; width: 100%; border-bottom: 2px solid #e51937;}
/*.promotionWr a:hover .detailView span:after, .promotionWr a:hover .detailView span:after {border-bottom-color: #a40f25;}*/

/* 2016-11-14 추가 */
.promotionWr .titW {top: 80px; font-family: "Nanum Myeongjo Bold"; font-size: 40px; line-height: 44px; text-align: center;color: #fff;}
.promotionWr .descW {top: 181px; font-size: 16px; color: #fff; line-height: 23px; text-align: center;}

/*
.promotionWr li:nth-of-type(1) p{color:#fff;}
.promotionWr li:nth-of-type(4) p{color:#fff;}
*/
