@import url('../../../css/normalize.css');
@import url('../../../css/common.css');
@import url('../../../css/webfont.css');

/* common */
/*.content_container {display:none; position:relative; width:1280px; margin:0 auto; overflow:hidden}*/
.content_container { position:absolute; top:0; left:50%; margin:0 0 0 -640px; width:1280px; height:900px; overflow:hidden; display:none; }
.content_page_wrap { display:none;}
div.pages { position:absolute; top:0; left:0; }

.show { display:block; }
.hide { display:none; }

/* btns */
.bn-back {position:absolute; top:0; right:0; display:none; z-index:10;}
.bn-preview {position:absolute; top:50%; left:0; margin-top:-33px; display:none;z-index:100; padding:23px 25px;}
.bn-next {position:absolute; top:50%; right:0; margin-top:-33px; display:none;z-index:100; padding:23px 25px;}

/* portal link */
.btns {display:none; position:absolute; right: 101px; bottom: 121px; z-index:1000}
.btns a {display:block; overflow:hidden; text-indent:-10000px; width:184px; height:11px; padding:8px 0 12px 11px;}
.btns .mPortal {background:url('../img/nav_milano.png') 15px 10px no-repeat; border:5px solid #000; margin:-5px 0 5px -5px;}

/* sns */
.sns-bns {position:absolute; bottom:40px; left:32px; display:none; z-index:10;}
.sns-bns li {}
.sns-bns li a { display:block; width:21px; height:51px }
.sns-bns li a.underline{border-bottom:1px solid #000;}
.sns-bns li a > img{margin-top:12px;}
.sns-bns li a > img.mTop14{margin-top:14px;}

/* indicator */
.indicator {position:absolute; left:50%; top:95%; z-index:10; margin-left:-59px; }
.indicator li{position:relative; width:15px; height:15px; margin: 0px 6px 0px 0px; float: left; cursor : pointer;}
.indicator li a{display:block; width:15px; height:15px; text-indent:-10000px; overflow:hidden;}
.indicator-btn {background:URL('../img/indicator_black.png') 0 0 no-repeat;}
.indicator-btn.on {background:URL('../img/indicator_on_black.png') 0 0 no-repeat;}

/* loading */

.loading { position:absolute; top:50%; left:50%; margin:-8px 0 0 -38px; width:100px; height:10px; opacity: 1;}
.loading .loading-list { width: 100%; height: 100%; display: flex; justify-content: space-around;}
.loading .loading-dot {width: 8px; height: 8px; border-radius: 100%;}
.loading p { position:relative; left:0%; top:25px; text-align:center; font:12px/1 'samsungif_bd'; }


/* 딜레이가 들어간 순차 확대 애니메이션 */
.loading .loading-dot {
  animation: loadingPulse 1.2s infinite ease-in-out;
  transform-origin: center center;
  background-color: #000; 
  opacity: 0.3;          
}

/* 각 dot에 순차 딜레이 */
.loading .loading-dot:nth-child(1) { animation-delay: 0s; }
.loading .loading-dot:nth-child(2) { animation-delay: 0.1s; }
.loading .loading-dot:nth-child(3) { animation-delay: 0.2s; }
.loading .loading-dot:nth-child(4) { animation-delay: 0.3s; }
.loading .loading-dot:nth-child(5) { animation-delay: 0.4s; }

@keyframes loadingPulse {
   0%, 100% {
    opacity: 0.3;
    transform: scale(1);
  }
  50% {
    opacity: 1;      
    transform: scale(1.1); 
  }
}

/* info_rotate */
.info_rotate { position:fixed; left:0; top:0; width:100%; height:100%; background:#fff; z-index:9999; display:none; }
.info_rotate img { width:100%; }

/* brightcove panel */
.fe_brightcovePanel{overflow:hidden}
.brightcovePanel { position:absolute; left:0; top:0; width:1080px; height:40px; overflow:hidden; filter:Alpha(opacity=0.1); opacity:0.01; z-index:0;background-image:url(http://www.samsung.com/common/img/bg_panel.gif); }
.brightcovePanel.show {filter:Alpha(opacity=100) !important; opacity:1 !important;z-index:4000 !important;}
.brightcovePanel .leftPanel {float:left}
.brightcovePanel .rightPanel {float:right}
.brightcoveContainer .video{position:relative;	z-index:3000;width:100%;height:100%}
.brightcovePanel button {float:left;width:50px;height:40px;overflow:hidden;padding-top:40px;font-family: Arial, verdana, sans-serif;color: #000;font-size: 1.1em;background-repeat: no-repeat;
}
.brightcovePanel .rewind {background-image: url(http://www.samsung.com/common/img/btn_rewind.gif); }
.brightcovePanel .play {background-image: url(http://www.samsung.com/common/img/btn_play.gif);}
.brightcovePanel .pause {background-image: url(http://www.samsung.com/common/img/btn_pause.gif); }
.brightcovePanel .forward {background-image: url(http://www.samsung.com/common/img/btn_forward.gif); }
.brightcovePanel .mute {background-image: url(http://www.samsung.com/common/img/btn_volon.gif); }
.brightcovePanel .volume-down {background-image: url(http://www.samsung.com/common/img/btn_voldown.gif); }
.brightcovePanel .volume-up {background-image: url(http://www.samsung.com/common/img/btn_volup.gif); }
.brightcovePanel .muted{background-image: url(http://www.samsung.com/common/img/btn_volmute.gif);}
.endofbrightcove{overflow:hidden;width:0px;height:0px;position:absolute}
.liveregion{overflow:hidden;width:0px;height:0px}
/* brightcove, youtube panel css add 20120618 acgyjjeong */
.brightcovePanel .rightPanel a, .youtubePanel .rightPanel a {overflow:hidden;display:inline-block;float:left;height:40px;}
.brightcovePanel .rightPanel button.bc-cc {width:34px;background-image:url(http://www.samsung.com/common/img/btn_bc_cc.png);}
.brightcovePanel .rightPanel button.bc-cc.over {background-image:url(http://www.samsung.com/common/img/btn_bc_cc_over.png) !important;}
.brightcovePanel .rightPanel button.bc-cc.on {background-image:url(http://www.samsung.com/common/img/btn_bc_cc_on.png) !important;}
.brightcovePanel .rightPanel a.bc-yt {padding-right:10px;}
.youtubePanel .rightPanel a.youtube-share {display:inline-block;padding:0 15px 0 17px;background:url(http://www.samsung.com/common/img/bg_yt_share_line.gif) no-repeat left top ;line-height:40px;color:#fff;font-size:11px;font-weight:bold;}
.youtubePanel .rightPanel a.youtube-share:hover {color:#00a8e1;text-decoration:none;}


/* contents */
body{font-size:12px; background:#fff}
#content_bg {width:1280px; height:900px;}
.pages {display:none; width:1280px; height:900px;}
.pages .pagebg{width:1280px; height:900px; background-repeat:no-repeat; background-position:left bottom; }

#headerIntro, .cntext_wrap{position:absolute;}
.cntext_wrap:after { content:"."; display:block; height:0; clear:both; visibility:hidden; }

#headerIntro{top:58px; left:80px; z-index:100; width:1120px}
#headerIntro h1, #headerIntro h2{display:block; width:400px; font-size:0; margin-left: 20px}
#headerIntro h2{display:none; margin-top: 27px;}
#headerIntro #gnb{display:none;  position:absolute; top:69px; right:20px; width:675px;}
#headerIntro #gnb li{float:left; width:135px;}
#headerIntro #gnb li span{display:block; height:1px; margin-top:2px; background:#afafaf}


#headerIntro #gnb li a, #headerIntro #gnb li a em{display:block; width:126px; height:28px;}
#headerIntro #gnb li a{position:relative; padding-top:13px;}
#headerIntro #gnb li a em{ background:url('../img/img_gnb.png') no-repeat; text-indent:-9999px; font-size:0; }
#headerIntro #gnb li em.on{display:none;position:absolute; left:0; top:13px; }
#headerIntro #gnb li.gnb_mn1 em{background-position:0 0}
#headerIntro #gnb li.gnb_mn2 em{background-position:-135px 0}
#headerIntro #gnb li.gnb_mn3 em{background-position:-270px 0}
#headerIntro #gnb li.gnb_mn4 em{background-position:-405px 0}
#headerIntro #gnb li.gnb_mn5 em{background-position:-540px 0}
#headerIntro #gnb li.gnb_mn1.hover em.on, #headerIntro #gnb li.gnb_mn1.current em.on{background-position:0 -53px}
#headerIntro #gnb li.gnb_mn2.hover em.on, #headerIntro #gnb li.gnb_mn2.current em.on{background-position:-135px -53px}
#headerIntro #gnb li.gnb_mn3.hover em.on, #headerIntro #gnb li.gnb_mn3.current em.on{background-position:-270px -53px}
#headerIntro #gnb li.gnb_mn4.hover em.on, #headerIntro #gnb li.gnb_mn4.current em.on{background-position:-405px -53px}
#headerIntro #gnb li.gnb_mn5.hover em.on, #headerIntro #gnb li.gnb_mn5.current em.on{background-position:-540px -53px}
#headerIntro #gnb li.hover span, #headerIntro #gnb li.current span{height:3px; margin:0 9px 0 0; background:#000}
#headerIntro #gnb li.gnb_mn5.hover span, #headerIntro #gnb li.gnb_mn5.current span{margin-right:0;}
#headerIntro #gnb li span.rgt_margin{margin-right:9px;}

/* 2014.04.11 webFont ADD */
.cntext_wrap .webfont_head{ margin-bottom:18px; font-size: 18px; line-height: 28px; font-family:secgcb}
.cntext_wrap .webfont{ font-size: 15px; font-family: secgcm; line-height: 28px; letter-spacing: 0; text-align:justify; word-break: break-all;}
/* 2014.04.11 webFont ADD */

#page1 {}
#page1 .side_txt{ position: absolute; top: 387px; left: 36px; z-index:1000}
#page1 .cntext_wrap{top:219px; left:98px}
#page1 .cntext_wrap h3{margin-bottom:22px}
#page1 .cntext_wrap h4{margin-bottom:22px; }
#page1 .cntext_wrap .txt01{ width: 737px; margin-bottom:12px;}
#page1 .cntext_wrap .txt01 span{font-style: italic; font-family: samsungif_medium; letter-spacing: 0px}
#page1 .btn_jmore{position:absolute; top:122px; left:796px }
#page1 .btn_jmore a, #page1 .btn_jmore span{display:block; width:284px; height:284px}
#page1 .btn_jmore span{background: url('../img/btn_journey_more.png') no-repeat 0 0; text-indent:-9999px; font-size:0;}
#page1 .btn_jmore span.on{display:none; position:absolute; left:0; top:0; background-position:0 -300px}
#page1 .pagebg{background-image: url('../img/page_bg_1.png');}

#page2 p.cnpic{ margin: 7px}
#page2 .cntext_wrap{ top: 278px; left: 187px;}
#page2 .cntext, #page2 .cnpic{float:left}
#page2 .cntext{width:312px}
#page2 .cntext_wrap .txt01 { width: 266px}
#page2 .cntext h3{margin-bottom:3px}
#page2 .pagebg{background-image: url('../img/page_bg_2.png');}

#page3 {}
#page3 .cntext_wrap{top: 284px; left: 99px;}
#page3 .cnpic{margin-bottom:26px; width: 1090px}
#page3 .cntext h3, #page3 .cntext h4{float:left}
#page3 .cntext { width: 1082px;}
#page3 .cntext h3{width:367px}
#page3 .cntext .txt01{ letter-spacing: 0px; line-height: 26px}
#page3 .pagebg{background-image: url('../img/page_bg_3.png'); background-position: top right}

#page4 {}
#page4 .cntext_wrap{top: 283px; left: 99px;}
#page4 .cnpic{position:relative; width: 1120px; height: 340px; margin-bottom:14px;}
#page4 .cnpic .btn_play span{text-indent:-9999px; width:0; height:0; font-size:0; visibility:hidden}
#page4 .cntext h3{margin-bottom:5px}
#page4 .cntext .txt01{width:703px; line-height: 26px}
#page4 .pagebg{background-image: url('../img/page_bg_4.png');}

#page5 {}
#page5 p.cnpic{ margin: 7px}
#page5 .cntext_wrap{ top: 277px; left: 188px; width: 992px;}
#page5 .cntext, #page2 .cnpic{float:left}
#page5 .cntext{width:312px}
#page5 .cntext h3{margin-bottom:3px; letter-spacing: -1px;}
#page5 .cntext_wrap .txt01 { width: 266px; line-height: 26px;}
#page5 .pagebg{background-image: url('../img/page_bg_5.png');}
#page5 #cnpic_list_wrap{width: 675px; position: absolute; right: 0px; top:6px}
#page5 .cnpic_list{position:relative; width: 675px; height:340px; overflow:hidden;}
#page5 .cnpic_list li{display:none; position:absolute; left:0; top:0 }

#page6 {}
#page6 .cnpic { margin-bottom: 10px}
#page6 .cntext_wrap{top: 283px; left: 101px; width: 1080px}
#page6 .cnpic_list{width:1120px}
#page6 .cnpic_list li{position:relative; float:left; margin:0 10px 9px 0}
#page6 .cnpic_list li.last{margin-right:0}
#page6 .cnpic_list li .sqbox_wrap{display:none; position:absolute; left:0; top:0; cursor:pointer }
#page6 .cnpic_list li.on .sqbox_wrap{display:block;}
#page6 .cnpic_list li span{ display:block; position:absolute; left:0; top:0;}
#page6 .cnpic_list li span.sqbox{width:201px; height:223px; border:4px solid #000000;}
#page6 .cnpic_list li span.mask{width:208px; height:230px; background:#fff; opacity:0.01; filter:alpha(opacity=0.1)}
#page6 .cnpic_list li a{display:block}
#page6 .cnpic_list li a>img{width:208px; height:230px}
#page6 .pagebg{background-image: url('../img/page_bg_6.png');}

.popup { position:absolute; left:0px; top:0px; width:1280px; height:900px;  z-index:10000; }
.popup div img { display:inline; }
.popup .close-btn { position:absolute; top:0px; right:30px; margin-top:30px; }
.popup .close-btn a { display:block; width:82px; height:83px; overflow:hidden; background:URL('../img/btn_close.png') 0 0  no-repeat; text-indent:-10000px;}

#popup_gal .popbg, #popup_vod .popbg{width:1280px; height:900px; background: url('../img/popbg.png') no-repeat 0 0; }
#video-container{
	background: #000; height: 175px;
}

#img-container{
	position: absolute; width: 997px; height: 577px; top:242px; left:50%; margin:0 0 0 -498px; text-align: center;
}
.length_Mode {top:100px !important;}