@charset "utf-8";

.btn-open{position:absolute;left:50%;top:50%;width:100px;height:100px;margin-left:-50px;margin-top:-50px}
    
.layer-video{display:none;position:fixed;left:0;top:0;width:100%;height:100%;z-index:9999}
.overlay{width:100%;height:100%;background:#000}
.multi{position:absolute;left:57%;top:50%;width:60%}
    
/*.multi{position:relative;width:100%}*/
.multi .m-video{display:none}
#m_v1{display:block}
.multi button{position:absolute;overflow:hidden;outline-style:none;text-indent:-9999em;font-size:0;line-height:0;background:none no-repeat 0 0;border:none;cursor:pointer}
/*.multi button.play{left:50%;top:50%;width:85px;height:85px;margin-left:-42.5px;margin-top:-42.5px;background-image:url(/etc/designs/odysseymen/kr/ko/clientlibs/images/product/btn_play.png)}*/
.multi button.play2{display:none;right:30px;bottom:32px;width:36px;height:32px;background-image:url(../images/movie/product/btn_play_s.png)}
.multi button.pause{display:none;right:30px;bottom:32px;width:36px;height:32px;background-image:url(../images/movie/product/btn_pause.png)}
.multi button.replay{display:none;right:30px;bottom:32px;width:36px;height:32px;background-image:url(../images/movie/product/btn_replay.png)}
.multi button.close{right:0;top:-53px;width:33px;height:33px;background-image:url(../images/movie/product/btn_close.png)}

.yt{width:100%}


.tutorial-content {max-width:1200px; margin:0 auto}
.tutorial-content .gallery-list .large-thumb .link-text {max-width:100%}
.tutorial-content .gallery-list .link-text {min-height:90px}

.gallery-list:after {content:""; display:block; clear:both}


.section-head {margin-bottom:60px; text-align:center;}
.section-head .section-title {color:#333; font-size:48px; line-height:1; margin-top:50px;}
.section-head .section-des {margin-top:16px; color:#666; font-size:15px; line-height:22px;}



/* 갤러리 리스트 */

.video-content {position:relative; max-width:1800px; margin:0 auto 80px}
.video-content .video-thumb img {width:100%; height:auto; max-width:100%}
.video-content div {width:100%; position:absolute; top:21%; left:0; text-align:center; color:#fff}
.video-content em {display:block; font-size:28px; font-weight:300}
.video-content strong {display:block; margin-top:15px; font-size:42px; font-weight:normal}
.video-content .video {position:absolute; top:0; left:0; right:0; bottom:0; z-index:100; width:100%; height:100%; padding-top:0; background:#000}
.video-content .video .btn-video-close {display:block; position:absolute; top:10px; right:10px; width:20px; height:20px; background:url(../images/common/ico_video_close.png) no-repeat center center;}
.video-content .video iframe {width:100%; height:100%;}

.btn-see-video {position:absolute; top:50%; left:50%; margin-top:-38px; margin-left:-38px;}

/* 마스킹 타입 비디오 */
.video-content .video.video-mask {overflow:hidden;}
.video-content .video.video-mask div.mask-layer {display:block; position:relative; left:0; top:-20%; width:100%; height:100%;}
.video-content .video.video-mask iframe {height:140%;}

.gallery-list:after {content:""; display:block; clear:both}
/*2016.01.07*/
.gallery-list li {float:left; width:25%; position: relative; margin-bottom: 20px;}
.gallery-list li .bg_size {width: 100%; line-height: 0;}
.gallery-list li a {display:block; position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.gallery-list li a:hover, .gallery-list li a:focus {background:#f58220;}
.gallery-list li img {width: 100%; height: auto;}
/*//2016.01.07*/

.gallery-list .btn-see-video {margin-top:-30px; margin-left:-30px}
.gallery-list .btn-see-video img {width:60px; height:60px}

.gallery-list .video-content, .gallery-list .thumb {margin-bottom:0; position:relative;}
.gallery-list .link-text {padding:0 20px 20px; height:103px}
.tutorial-content .gallery-list .link-text {min-height:90px}
.gallery-list .link-text div {margin-bottom:5px; font-size:14px}
.gallery-list .link-text div span {position:relative; display:inline-block; margin-left:6px; padding-left:5px}
.gallery-list .link-text div span:before {position:absolute; left:0; top:2px; content:""; width:1px; height:10px; border-left:1px solid #ccc}

.gallery-list .link-text strong {display:block; margin-bottom:0px;font-size:22px; color:#333; font-weight:500; white-space: nowrap; overflow:hidden; text-overflow:ellipsis; width:100%;}

.gallery-list .link-text p {font-size:14px; line-height:20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break:break-word; height:40px;}

.gallery-list .large-thumb {width:50%; height:;}
.gallery-list .large-thumb .btn-see-video {top:auto; bottom:30px; left:auto; right:30px; margin-top:0; margin-left:0}
.gallery-list .large-thumb .btn-see-video img {width:77px; height:77px}
.gallery-list .large-thumb .link-text {position:absolute !important; left:30px; bottom:30px; padding:0; color:#fff; max-width:200px; height:auto}
.gallery-list .large-thumb .link-text * {color:#fff}

.gallery-list li a:hover .link-text, .gallery-list li a:focus .link-text {color:#fff; z-index:1; position:relative;}

.gallery-list li a:hover .thumb:after,
.gallery-list li a:focus .thumb:after,
.gallery-list li a:hover .video-content:after,
.gallery-list li a:focus .video-content:after {content:" "; width:100%; height:100%; position:absolute; top:0; left:0; background:#000;opacity:0.5;filter:alpha(iopacity=50);-ms-filter:alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";}

.gallery-list li a:hover .btn-see-video,
.gallery-list li a:focus .btn-see-video {z-index:2}
.gallery-list li a:hover *,
.gallery-list li a:focus * {color:#fff}

.gallery-list li .btn-see-video img.over {display:none}
.gallery-list li a:hover .btn-see-video img,
.gallery-list li a:focus .btn-see-video img {display:none}
.gallery-list li a:hover .btn-see-video img.over,
.gallery-list li a:focus .btn-see-video img.over {position:relative; top:-1px; display:block}

.gallery-list .large-thumb a:hover,
.gallery-list .large-thumb a:focus {background:#fff}
.gallery-list .large-thumb a:hover .btn-see-video img.over,
.gallery-list .large-thumb a:focus .btn-see-video img.over {display:block}
.gallery-list .large-thumb .link-text {padding-bottom:0}

.gallery-list .link-text {padding-top:10%; padding-bottom:0px}
.gallery-list .video-content {margin-bottom:0; position:relative;}





@media screen and (max-width:767px) {
	
	.multi{position:absolute;left:38%;top:50%;width:100%}
	
	.video-content {margin-bottom:40px}
	.btn-see-video {margin-top:-19px; margin-left:-19px}
	.btn-see-video img {width:38px; height:38px;}

	/* 갤러리 리스트 */
	.gallery-content {margin-bottom:50px}
	.gallery-list .video-content, .gallery-list .thumb {margin-bottom:15px}
	.gallery-list .link-text {padding:0 10px}
	.gallery-list .link-text strong {font-size:18px}

	/*.gallery-list li {margin-bottom:10px}*/
	/*.gallery-list .large-thumb {margin-bottom:10px}*/
	.gallery-list .video-content {margin-bottom:15px}
	.gallery-list .link-text {padding-bottom:0}
	.gallery-list .link-text p {overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap:break-word; height:40px;}
	.gallery-list .large-thumb .link-text p {padding-bottom:0}

	/* 카드페이징 */
	.card-paging ul li .background-image img {width:100%; height:auto;}
	
	.section-head .section-title {color:#333; font-size:40px; line-height:1; margin-top:50px;}
	
}

@media screen and (max-width:640px) {
	.gallery-list li {width:50%; margin-bottom: 0;}
	.gallery-list li .bg_size {display: none;}
	.gallery-list li a {position: static;}
	.gallery-list .large-thumb {float:left; width:100%; margin-bottom: 0;}
	.gallery-list .large-thumb a {padding-bottom:0}
	.gallery-list .large-thumb .video-content {margin-bottom: 0;}

	/* 카드페이징 */
	.card-paging ul li .background-image img {width:100%; height:auto;}
	
	.section-head .section-title {color:#333; font-size:24px; line-height:1; margin-top:50px;}
}

@media screen and (min-width:481px) and (max-width:639px) {
	.gallery-list .large-thumb {margin-bottom:10px}
	.gallery-list .large-thumb .video-content {margin-bottom:0}
	
	.section-head .section-title {color:#333; font-size:30px; line-height:1; margin-top:50px;}
}	
	
	
	
@media all and (max-width:1199px) {

	.slide-menu-active .wrap {position:relative; /*transform:translateX(255px)*/}
	.slide-menu-active .slide-menu {display:block; /*transform:translateX(0);*/}
	.slide-menu-active .slide-dimm-wrap {display:block;}
	.btn_slide_menu {display:block;}
	.btn-top-search-toggle {display:block;}

	.container > .grid-row {padding:40px 20px 40px;}
	.container > .grid-row.nowrap {padding:20px 0 0;}
	.container .grid-row.wide {padding:40px 0 0}
	.container .grid-row.nowrap .section-head {padding:0 42px;}

	.section-head {margin-bottom:40px;}
	.breadcrumb {display:none;}

	.btn-go-top {right:20px;}
	/* sitemap */
	.sitemap {margin-top:-20px; margin-left:-26px;}
	.sitemap > li {width:33.3%; margin-top:20px; padding-left:26px;}
	.sitemap dl {padding:35px 40px 10px;}
	.sitemap dl dt a {font-size:22px;}
	.sitemap dl dd a {font-size:18px;}

	/* common style */
	.tab-title ul > li > a {line-height:35px;}

	/* search */
	.search .incline-tab .tab-title .col4 {display:table; width:100%;}
	.search .incline-tab .tab-title .col4 li {display:table-cell; width:25%;}

	/*find-store*/
	.store-map-container {height:auto; padding-left:0;}
	.store-map-container .map-load-area {height:690px;}
	.store-map-container .map-load-area img {width:100%; height:100%;}

	.store-info-area {position:static; top:auto; left:auto; width:100%; height:auto; border:1px solid #c6cbd2;}
	.store-info-area .info-top-search {position:relative;}
	.store-info-area .info-top-search .store-search-bar {position:absolute; top:20px; right:20px; width:260px;}
	.store-info-area .info-top-search .search-location {padding-right:270px;}

	/* 카드 페이징 */
	.card-paging ul li {width:33.33%;}

	.error-wrap .error-link {display:none;}

	/* 갤러리 리스트 */
	.video-content div {}
	.tutorial-content .gallery-list .large-thumb {float:left}
	.section-head.gallery-view {display:none;}

}