@charset "utf-8";
/*@font-face{font-family:KiaB;font-weight:normal;font-style:normal;src:url('/content/dam/kwcms/au/en/font/kia_bold.eot');src:url('/content/dam/kwcms/au/en/font/kia_bold.eot?#iefix') format('embedded-opentype'),url('/content/dam/kwcms/au/en/font/kia_bold.woff') format('woff')}
@font-face{font-family:KiaM;font-weight:normal;font-style:normal;src:url('/content/dam/kwcms/au/en/font/kia_medium.eot');src:url('/content/dam/kwcms/au/en/font/kia_medium.eot?#iefix') format('embedded-opentype'),url('/content/dam/kwcms/au/en/font/kia_medium.woff') format('woff')}
*/
#container{overflow: hidden;}
.pip_gallery_new{padding-top:50px; box-sizing: border-box;}
.pip_gallery_new .con_tit2{position:relative; font-size:36px;color:#000;line-height:60px; text-align: center;}
.pip_gallery_new .con_tit2:after{display:block; position:absolute; top:0; left:50%; margin-left:-35px; width:70px;height:4px;background:#05141f; content:'';}
.pip_gallery_new .tab_nav{display:table; /*margin:20px auto 40px;*/}
.pip_gallery_new .tab_nav li{display: inline-block; margin:0 25px;float: none;}
.pip_gallery_new .tab_nav li button{position:relative; font-size:20px; line-height: 40px; color:#888; transition: 0.3s; outline: 0;background-color: transparent;} /* 2018.05.18 outline:0; 추가 */
.pip_gallery_new .tab_nav li button:after{position:absolute; bottom:0; left:50%; width:0; height:2px; background:#05141f; content:''; transition: 0.3s;}
.pip_gallery_new .tab_nav li button:hover, .pip_gallery_new .tab_nav li button.active{color:#05141f;transition: 0.3s;background-color: transparent;}
.pip_gallery_new .tab_nav li button:hover:after, .pip_gallery_new .tab_nav li button.active:after{width:100%; left:0; transition: 0.3s;}

.pip_gallery_new .thum_list_con{position:relative; height:265px; width:5000%; margin-bottom:20px; overflow: hidden;}
.pip_gallery_new .thum_list{position:absolute;display: inline-block;}
.pip_gallery_new .thum_list li{position:relative; float:left; width:400px; height:265px; margin:0 10px; overflow: hidden; transition: 0.3s}
.pip_gallery_new .thum_list li.first{margin-left:0;}
.pip_gallery_new .thum_list li.last{margin-right:0;}
.pip_gallery_new .thum_list li > a {display: block;}
.pip_gallery_new .thum_list li > a > img {position:absolute; /*top:50%; left:50%; transform: translateX(-50%) translateY(-50%);*/ /*width:100%;*/ transition: 0.3s;}
/*.pip_gallery_new .thum_list li>a:hover img{width:110%; transition: 0.3s;}*/
.pip_gallery_new .thum_list li.type_videos>a:after{position:absolute; display: block; top:50%; left:50%; z-index:1; width:50px; height:50px; background:url('../images/video-play-icon.png') no-repeat center center; content:''; transform: translateX(-50%) translateY(-50%);}

.pip_gallery_new .slider_con{position:relative; margin:25px auto 60px; width:90%; height:28px; max-width:660px;}
.pip_gallery_new .slider_con:before{ position: absolute; width: 100%; height:3px; top: 50%; background:#8e8e8e; border-radius: 2px; content: "";}
.pip_gallery_new .slider_con button	{position:absolute; top:0; left:0; z-index:1; width:69px; height:30px; background:url('../images/ico_scroll.png') no-repeat center center; font:0/0 a;}

#gallery_pop{position:fixed; display: none; top:0; left:0; width:100%; height:100%; background: rgba(0, 0, 0, 0.8); z-index:9999 }
#gallery_pop .btn_prev{position:absolute; top:50%; left:10px; z-index:1; width:30px; height:44px; margin-top:-22px; opacity:0.6; transition: 0.3s; background:url('../images/btn_gallery_prev.png') no-repeat center center; font:0/0 a;outline: 0 !important;}
#gallery_pop .btn_next{position:absolute; top:50%; right:10px; z-index:1; width:30px; height:44px; margin-top:-22px; opacity:0.6; transition: 0.3s; background:url('../images/btn_gallery_next.png') no-repeat center center; font:0/0 a;transform: translateY(-50%);outline: 0 !important;}
#gallery_pop .btn_close{position:absolute; right:-18px; top:0px; z-index:1; width:36px; height:36px; background:url('../images/btn_close_popup.png') no-repeat center center; font:0/0 a;    transform: translateY(-50%);outline: 0 !important;}
#gallery_pop button:hover{opacity:1; transition: 0.3s;}
#gallery_pop .gallery_content{position:absolute; width: 100%; height: 100%;  max-width:80%; min-height: 400px;  max-height:80vh;  max-width:60%; top:50%; left:50%; transform: translateX(-50%) translateY(-50%);}
#gallery_pop .player{display: none;}
#gallery_pop .images{display: none; text-align: center;}
#gallery_pop .player iframe{width:100%; display:inline-block; border:0;}
#gallery_pop .images img{max-width:100%; max-height: 100%;}

@media screen and (max-width:1024px) {
#gallery_pop .gallery_content {transform: translateX(-50%) translateY(-35%);}
}

@media screen and (max-width:1023px) {
	.pip_gallery_new .thum_list_con{height:236px;}
	.pip_gallery_new .thum_list li{width:370px; height: 236px;}
}


@media screen and (max-width:767px) {
	.pip_gallery {overflow: hidden !important; }
	.pip_gallery_new{padding-top:25px;}
	.pip_gallery_new .con_tit2{font-size:15px;line-height:30px;}
	.pip_gallery_new .con_tit2:after{display:block; position:absolute; top:0; left:50%; margin-left:-17px; width:35px;height:2px;background:#05141f; content:'';}
	.pip_gallery_new .tab_nav{display:table; /*margin:10px auto 20px;*/}
	.pip_gallery_new .tab_nav li{ margin:0 10px;}
	.pip_gallery_new .tab_nav li button{font-size:14px; line-height: 32px; }

	.pip_gallery_new .thum_list_con{height:142px; margin-bottom:10px;}
	.pip_gallery_new .thum_list li{width:240px; height: 142px; margin:0 5px;}


	.pip_gallery_new .slider_con{margin-bottom:40px;}
	.pip_gallery_new .slider_con button{background:url('../images/ico_scroll.png') no-repeat center center; background-size:69px 30px;font:0/0 a;}
	#gallery_pop .btn_prev{left:10px; width:15px; height:22px; margin-top:-11px;  background-size: 15px 22px;}
	#gallery_pop .btn_next{right:10px; width:15px; height:22px; margin-top:-11px;  background-size: 15px 22px;}
	#gallery_pop .btn_close{/*right:-9px; top:-9px; width:18px; height:18px;  */background-size: 18px 18px;}

	#gallery_pop .gallery_content{min-height: 200px;}


	#gallery_pop .gallery_content {position:absolute; width:100%; min-height: none;  max-height:none;  max-width:80%; top:100%; left:50%; transform: translateX(-50%) translateY(-85%);}

}

@media screen and (max-width:414px) {

#gallery_pop .gallery_content {
    position: absolute;
    width: 100%;
    min-height: none;
    height: auto;
    max-width: 80%;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

}