@charset "utf-8"; 

/* 메인비주얼 */
.F10_m_visual {position:relative; width:100%; height:810px; margin:0 auto; z-index:1; }
.F10_m_visual h2{position:absolute; width:1px; height:1px; top:-999999em; left:-999999em; }  
.F10_m_visual button{cursor:pointer; }
.F10_m_visual ul li{overflow:hidden; }
.F10_m_visual #m_visual{position:relative; width:1920px; height:100%; left:50%; z-index:0; margin-left:-960px; }
.F10_m_visual #m_visual div{height:100%; }
.F10_m_visual #m_visual p {height:100%; text-align:right; }
.F10_m_visual #m_visual p img { width:auto; height:100%; }
.F10_m_visual .slogan_wrap{ position:absolute; width:50%; top:100px; left:50%; margin-left:-700px; letter-spacing:-1px; z-index:1; }
.F10_m_visual #m_slogan .slick-slide{padding:20px 0; }
.F10_m_visual #m_slogan p { color:#000; }
.F10_m_visual #m_slogan p span{display:block; }
.F10_m_visual #m_slogan p.txt1{font-size:36px; font-family:'NotoL'; margin:0 0 10px; letter-spacing:-2px}
.F10_m_visual #m_slogan p.txt1 span{position:relative; display:inline-block; }
.F10_m_visual #m_slogan p.txt1 span::before{content:""; position:absolute; left:0; top:35%; width:100%; height:30%; background:#edfffe; z-index:0; }
.F10_m_visual #m_slogan p.txt1 span strong{position:relative; z-index:1; }
.F10_m_visual #m_slogan p.txt2{position:relative; display:inline-block; margin-left:170px; font-size:55px; line-height:1.1; letter-spacing:-1px; font-family:'NotoM'; }
.F10_m_visual #m_slogan p.txt2::before{content:""; position:absolute; left:0; bottom:-20px; width:180%; height:5px; background:#06b7af; z-index:0; }

.F10_m_visual .control{position:absolute; left:20px; bottom:-35px; width:22px; height:22px; margin-left:-15px; background:#5a7170; border-radius:20px; z-index:10; } 
.F10_m_visual .control button{width:100%; height:100%; border:0px; text-indent:-99999%; overflow:hidden; }
.F10_m_visual .control button.btn_stop{background:url('/images/common/F_10_main/btn_m_stop.png') no-repeat center; }
.F10_m_visual .control button.btn_play{display:none; background:url('/images/common/F_10_main/btn_m_play.png') no-repeat center; }

.F10_m_visual .slick-dots{position:absolute; left:20px; bottom:-35px; margin-left:15px;  }
.F10_m_visual .slick-dots li{float:left; line-height:0; margin:5px 4px; }
.F10_m_visual .slick-dots button{width:12px; height:12px; border-radius:10px; background:#a2d2d0; text-indent:-99999%; overflow:hidden; cursor:pointer; transition:all .3s ease; -ms-transition:all .3s ease; -moz-transition:all .3s ease; -webkit-transition:all .3s ease; }
.F10_m_visual .slick-dots .slick-active button{width:25px; background:#06b7af; }

.F10_m_visual .slogan_img{position:absolute; left:50%; top:340px; margin-left:-700px; }

@media screen and (max-width:1420px) { 	 
	/* 메인비주얼 */
	.F10_m_visual #m_visual{width:60%; left:auto; float:right; margin-left:0;}
	.F10_m_visual .slogan_wrap{margin-left:0; left:2.5%; }	
	.F10_m_visual .slogan_img{margin-left:0; left:2.5%; }	
}

@media screen and (max-width:1200px) {  
	/* 메인비주얼 */
	.F10_m_visual{height:600px; }
	.F10_m_visual #m_visual{width:55%; left:auto; float:right; margin-left:0;}
	.F10_m_visual .slogan_wrap{width:100%; top:70px;}
}

@media screen and (max-width:980px) {	 
	/* 메인비주얼 */
	.F10_m_visual{height:350px;}
	.F10_m_visual .slogan_wrap{top:30px; width:80%; padding:10px;}
	.F10_m_visual .slogan_wrap::before{content:""; position: absolute; left:0; top:0; width:400px; height:100%; background:rgba(255, 255, 255, 0.6);}
	.F10_m_visual #m_slogan p.txt1{font-size:30px;}
	.F10_m_visual #m_slogan p.txt2{font-size:45px; margin-left:120px;}
	.F10_m_visual #m_slogan p.txt2::before{width:150%;}
	.F10_m_visual .slogan_img{display:none;}
}

@media screen and (max-width:680px) {
	/* 메인비주얼 */
	.F10_m_visual #m_visual{width:65%;}
	.F10_m_visual .slogan_wrap::before{width:280px;}
	.F10_m_visual #m_slogan p.txt1{font-size:25px;}
	.F10_m_visual #m_slogan p.txt2{font-size:35px; margin-left:100px;}
	.F10_m_visual #m_slogan p.txt2::before{width:120%;}
}

@media screen and (max-width:590px) {
	/* 메인비주얼 */
	.F10_m_visual{height:300px;}
	.F10_m_visual .slick-dots{display:none !important;}
	.F10_m_visual .control{display:none !important;}
}

@media screen and (max-width:480px) {
	/* 메인비주얼 */
	.F10_m_visual{height:200px;}
	.F10_m_visual .slogan_wrap::before{width:230px;}
	.F10_m_visual #m_slogan p.txt1{font-size:20px;}
	.F10_m_visual #m_slogan p.txt2{font-size:30px; margin-left:0px;}
}