@charset "utf-8";
/* maintemplate basic001*/


/* MAIN VISUAL */
.mainVisual .mainSlider_001 {position:relative; background:#fff; overflow:hidden;}
.mainVisual .slide_wrap {position:relative; overflow:hidden; box-sizing:border-box;}
.mainVisual .slide_wrap img {width:100%; min-height:100%;}

/* MAIN SLIDE COPY */
.mainVisual .copy {position:absolute; z-index:9; width:100%;}
.mainVisual .copy .inner {width:100%; max-width:1300px; padding:0; margin:0 auto; box-sizing:border-box;}
.mainVisual .copy .inner div {padding:0 15px;}
.mainVisual .copy .tit {font-size:35px;font-weight:400;line-height:normal;color:white;letter-spacing: -0.5px;}
.mainVisual .copy .tit strong {font-weight:400;}
.mainVisual .copy .smallp {font-size:15px;line-height: 150%;padding-top:20px;}

	@media (min-width:1050px){
		.mainVisual .mainSlider_001 {max-height:550px;}
		.mainVisual .mainSlider_001 .slick-slider {max-height:550px;position: relative;}
		.mainVisual .slide_wrap {height:550px;}
	}
	@media (min-width:800px) and (max-width:1049px){
		.mainVisual .slide_wrap {height:0; padding-bottom:50%;}
		.mainVisual .slide_wrap img {position:absolute; top:0; left:0; min-height:100%;}

		.mainVisual .copy .tit {font-size: 30px;}
		.mainVisual .copy .smallp {font-size:14px;}	
	}
	@media (min-width:600px) and (max-width:799px){
		.mainVisual .mainSlider_001 {min-height:250px;}
		.mainVisual .slide_wrap {height:0; padding-bottom:50%;}
		.mainVisual .slide_wrap img {position:absolute; top:0; left:0; min-height:100%;}

		.mainVisual .copy .tit {font-size:23px;}
		.mainVisual .copy .smallp {font-size:14px;}
	}
	@media (max-width:599px){
		.mainVisual .slide_wrap {height:0; padding-bottom:65%;}
		.mainVisual .slide_wrap img {position:absolute; top:-9999px; bottom:-9999px; left:-9999px; right:-9999px; margin:auto;
									   width:auto; min-width:100%; height:100%; }

		.mainVisual .copy {background:rgba(000,000,000,0.5);top:unset !important;bottom:0 !important; padding:20px 0 30px;}
		.mainVisual .copy .tit, .mainVisual .copy .tit * {font-size: 22px !important;color: #fff !important;}
		.mainVisual .copy .smallp{font-size: 15px !important;color: #fff !important;}
	}

 


/*SLIDE BTN SETTING*/
    /* MAIN SLIDE bullet btn */
    .mainVisual .swiper-pagination {display:none !important;} /*기존슬라이드 불렛버튼*/
    .mainVisual .slick-dots {display: inline-block !important;vertical-align: middle;}
    .mainVisual .slick-dots {position:absolute;bottom: 27px;left:50%;z-index:10;width: 100%;max-width: 1300px;transform: translateX(-50%);text-align: left;padding: 0 36px;box-sizing: border-box;}
    .mainVisual .slick-dots li {display:inline-block;text-align:center;position:relative;margin-left: 7px;width: 13px;height: 13px;vertical-align: middle;}
    .mainVisual .slick-dots li:first-of-type {margin-left:0;}
    .mainVisual .slick-dots li.slick-active button {background:#333;border-color: rgba(255,255,255,0.7);}
    .mainVisual .slick-dots li button {text-indent:-999px;overflow:hidden;width: 100%;height: 100%;box-sizing: border-box;border: 1px solid #333;background: rgba(255,255,255,0.7);vertical-align: middle;}
    .mainVisual .slick-dots li button:focus {outline:auto;}

    /* MAIN SLIDE PLAY and STOP BTN  */
    .mainVisual .swiper-pagination-center {position:relative;position: absolute;bottom: 26px;left: 50%;}
    .mainVisual .slick-dots + div.indicator {display:inline-block !important;}
    .mainVisual div.indicator {z-index:10;display:inline-block;vertical-align: middle;position: absolute;bottom: 27px;left: 50%;transform: translateX(-50%);width: 100%;max-width: 1300px;height: 1px;padding: 0 15px;box-sizing: border-box;}
    .mainVisual div.indicator button{width:12px;height:12px;border:0;cursor:pointer;position: absolute;bottom: 0;}
    .mainVisual div.indicator button.play{background:url("/sample/img/slide/play.png")no-repeat; text-indent:-9999px;}
    .mainVisual div.indicator button.stop{background:url("/sample/img/slide/stop.png")no-repeat; text-indent:-9999px;}
    .mainVisual div.indicator button:focus {outline:auto;}
    
    /* MAIN SLIDE PREV and NEXT BTN  */
    .mainVisual .swiper-button-next, .mainVisual .swiper-button-prev {display:none !important;} /*기존 버튼*/
    .mainVisual .slick-arrow {display:none !important;}

    @media (max-width:799px){
        .mainVisual .slick-dots {display:none !important;}
        .mainVisual div.indicator {bottom:13px;}
        .mainVisual div.indicator button {opacity:0;}
        .mainVisual div.indicator button:focus {opacity:1;}
    }