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

/* Common */
.show { display:block}
.hide { display:none}
.wa{position:absolute;top:-9999px;text-indent:-9999px;font-size:0}

/* btns */
.bn-back, .bn-preview, .bn-next{display:none; position:absolute}
.bn-back {top:0; right:0; z-index:10}
.bn-preview {top:50%; left:0; margin-top:-33px;z-index:100; padding:23px 25px}
.bn-next {top:50%; right:0; margin-top:-33px; z-index:100; padding:23px 25px}
.bn-back span, .bn-preview span, .bn-next span{display:block; text-indent:-9999px; overflow: hidden}
.bn-back span{width:60px; height:60px; background:url('../img/bn_back.png') no-repeat left top; overflow: hidden}
.bn-preview span{width:14px; height:21px; background:url('../img/bn_preview_white.png') no-repeat left top}
.bn-next span{width:14px; height:21px; background:url('../img/bn_next_white.png') no-repeat left top}

.reverse .bn-preview span{background:url('../img/bn_preview.png') no-repeat left top}
.reverse .bn-next span{background:url('../img/bn_next.png') no-repeat left top}

.inverse.bn-back span{background:url('../img/bn_back.png') no-repeat left top}
.inverse.bn-preview span{background:url('../img/bn_preview.png') no-repeat left top}
.inverse.bn-next span{background:url('../img/bn_next.png') no-repeat left top}

.reverse .inverse.bn-preview span{background:url('../img/bn_preview_white.png') no-repeat left top}
.reverse .inverse.bn-next span{background:url('../img/bn_next_white.png') no-repeat left top}

/* sns */
.sns-bns {position:absolute; bottom:40px; left:32px; display:none; z-index:10000}
.sns-bns li {border-bottom:1px solid #fff}
.sns-bns li.inverse{border-bottom:1px solid #000}
.sns-bns li a { display:block; overflow: hidden; width:21px; height:51px; background-position:left center; background-repeat:no-repeat; text-indent:-9999px}
.sns-bns li.sns_3 { border: none}
.sns-bns li.sns_0 a{background-image:url('../img/bn_facebook_white.png')}
.sns-bns li.sns_1 a{background-image:url('../img/bn_twitter_white.png')}
.sns-bns li.sns_2 a{background-image:url('../img/bn_qqq_white.png')}
.sns-bns li.sns_3 a{background-image:url('../img/bn_google_white.png')}
.sns-bns li.inverse.sns_0 a{background-image:url('../img/bn_facebook.png')}
.sns-bns li.inverse.sns_1 a{background-image:url('../img/bn_twitter.png')}
.sns-bns li.inverse.sns_2 a{background-image:url('../img/bn_qqq.png')}
.sns-bns li.inverse.sns_3 a{background-image:url('../img/bn_google.png')}

.reverse .sns-bns li {border-bottom:1px solid #000}
.reverse .sns-bns li.inverse{border-bottom:1px solid #fff}
.reverse .sns-bns li.sns_3 { border: none}
.reverse .sns-bns li.sns_0 a{background-image:url('../img/bn_facebook.png')}
.reverse .sns-bns li.sns_1 a{background-image:url('../img/bn_twitter.png')}
.reverse .sns-bns li.sns_2 a{background-image:url('../img/bn_qqq.png')}
.reverse .sns-bns li.sns_3 a{background-image:url('../img/bn_google.png')}
.reverse .sns-bns li.inverse.sns_0 a{background-image:url('../img/bn_facebook_white.png')}
.reverse .sns-bns li.inverse.sns_1 a{background-image:url('../img/bn_twitter_white.png')}
.reverse .sns-bns li.inverse.sns_2 a{background-image:url('../img/bn_qqq_white.png')}
.reverse .sns-bns li.inverse.sns_3 a{background-image:url('../img/bn_google_white.png')}


/* indicator */
.indicator {position:absolute; left:50%; z-index:10; margin-left:-52px}/*top:95%;*/
.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_white.png') 0 0 no-repeat}
.indicator-btn.on {background:URL('../img/indicator_on_white.png') 0 0 no-repeat}
.indicator-btn.inverse {background:URL('../img/indicator.png') 0 0 no-repeat}
.indicator-btn.inverse.on {background:URL('../img/indicator_on.png') 0 0 no-repeat}

/* focus */
.sns-bns li a:focus { outline: 1px dotted #fff}
.indicator-btn a:focus { outline: 1px dotted #fff}
a.bn-next:focus { outline: 1px dotted #fff}
a.bn-top:focus { outline: 1px dotted #fff}
a.bn-bottom:focus { outline: 1px dotted #fff}
a.bn-preview:focus { outline: 1px dotted #fff}
.sns-bns li.inverse a:focus { outline: 1px dotted #000}
.indicator-btn.inverse a:focus { outline: 1px dotted #000}
a.bn-next.inverse:focus { outline: 1px dotted #000}
a.bn-preview.inverse:focus { outline: 1px dotted #000}

/* loading */
.loading { position:absolute; top:50%; left:50%; margin:-8px 0 0 -38px; width:76px; height:16px; background:url('../img/loading.png') 0 0}
.loading p { position:relative; left:0%; top:25px; text-align:center; font:12px/1 'samsungif_bd'}

/* 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%}

/*
------------------------------------------------
 customized contents
------------------------------------------------
*/

.indicator{top:-9999px}

/*VIDEO*/
.vjs-control-bar{display:none}
.movie_area{position:absolute;top:0;left:0;width:1280px;height:900px;z-index:0}
.movie{width:100%;height:100%}
.movie video{width:100%;height:100%}

/* Page Common */
body{font-family:'samsungif_rg';font-size:15px;line-height:26px;color:#000}
.body_wrap{width:1280px; height:900px}
.content_container{display:none; position:absolute; top:0; left:50%; width:1280px; height:900px; margin:0 0 0 -640px; overflow:hidden;background:#000}
.content_page_wrap{display:none}
.pages{display:none;position:absolute;top:0;left:0;width:1280px;height:900px;overflow:hidden;box-sizing:border-box;background:#fff}
.pages p{position:relative;z-index:7;margin-bottom:23px}
.pages dl{position:relative;z-index:7;margin-bottom:15px;color:#000}
.pages dl dt{margin-bottom:20px;font-family:'samsungif_medium';font-size:20px}

.prdt_img:after{content:'';display:block;clear:both;visibility:hidden;height:0}
.prdt_img li{float:left;margin-right:4px}
.prdt_img li > a{position:relative;z-index:5;display:block;width:10px;height:10px;background:url(../img/prdt_indicator.png) no-repeat -34px 0}
.reverse .prdt_img li > a{background-position:-54px 0}
.prdt_img li.on > a{width:30px;background-position:0 0}
.prdt_img li > img{position:absolute;top:0;left:0;z-index:1}

.csstransforms .prdt_img li > a{background:rgba(0, 0, 0, 0.4);border-radius:10px;-webkit-transition:all 1s;transition:all 1s}
.csstransforms .reverse .prdt_img li > a{background:rgba(255, 255, 255, 0.5)}
.csstransforms .prdt_img li.on > a{background:rgba(43, 135, 210, 1);border-radius:10px;opacity:1}

.time{position:relative;width:238px;margin-bottom:25px}
.time .am{display:block;width:45px;height:21px;margin-bottom:16px;background:url(../img/txt_am.png) no-repeat}
.time .pm{display:block;width:47px;height:28px;margin-bottom:16px;background:url(../img/txt_pm.png) no-repeat}
.time p{margin-bottom:0;background:url(../img/colon.png) no-repeat 50% 50%}
.time p:after{content:'';display:block;clear:both;visibility:hidden;height:0}
.time p span{display:block;float:left;overflow:hidden;width:44px;height:58px}
.time p span.time02{margin-right:60px}
.time p span img{position:relative}

.ico_aircon{position:relative;z-index:7;margin-bottom:48px}
.movie_copy{-ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0}

/* Page Detail */
.page01{padding-top:400px;background:url(../img/bg-page01.jpg) no-repeat}
.page01 h1{text-align:center}
.page02{padding:190px 0 0 150px;background:url(../img/bg-page02.jpg) no-repeat}
.page02 p{line-height:28px}
.page02 .annotation{font-size:13px;line-height:20px;}
.page03{padding:190px 0 0 150px;background:url(../img/bg_img01_movie.jpg) no-repeat;}
.page04{padding:110px 0 0 150px}
.page05{padding:190px 0 0 150px}
.page06{padding:270px 0 0 666px;background:url(../img/bg_img02_movie.jpg) no-repeat;}
.page07{padding:110px 0 0 130px}
.page08{padding:350px 0 0 675px}
.page08 dl{color:#fff}
.page08 .prdt_img li > a{background-position:-54px 0}
.page08 .prdt_img li.on > a{background-position:0 0}
.page09{padding:250px 0 0 150px;background:url(../img/bg_img03_movie.jpg) no-repeat;}
.page09 .ico_aircon p{background:url(../img/ico_aircon03.png) no-repeat}
.page09 p{color:#fff}
.page09 .time p{background-image:url(../img/colon_white.png)}
.page09 .time .pm{background:url(../img/txt_pm_bwhite.png) no-repeat}
.page10{padding:365px 0 0 835px}
.page10 .prdt_img li > img{-webkit-transition:opacity 0s .1s;transition:opacity 0s .1s}
.page10 .prdt_img li.on > img{-webkit-transition:opacity .1s;transition:opacity .1s}
.page11{padding:110px 0 0 150px} 
.page11 .prdt_img li > a{background-position:-54px 0}
.page11 .prdt_img li.on > a{background-position:0 0}
.page11 dl{color:#fff}
.page12{padding:190px 0 0 150px;background:url(../img/bg-page12.jpg) no-repeat}
.page12 p{line-height:30px}
.page12 p.mb35{margin-bottom:35px}
.page12 .btn_download{margin-right:10px}

.reverse .page04 dl{color:#fff}
.reverse .page08 dl{color:#000}
.reverse .page08 .prdt_img li > a{background-position:-34px 0}
.reverse .page08 .prdt_img li.on > a{background-position:0 0}
.reverse .page11 .prdt_img li > a{background-position:-34px 0}
.reverse .page11 dl{color:#000}

.csstransforms .page08 .prdt_img li > a{background:rgba(255, 255, 255, 0.5)}
.csstransforms .page08 .reverse .prdt_img li > a{background:rgba(0, 0, 0, 0.4)}
.csstransforms .page08 .prdt_img li.on > a{background:rgba(43, 135, 210, 1)}
.csstransforms .page10 .prdt_img li > a{-webkit-transition:all 0.1s;transition:all 0.1s}
.csstransforms .page11 .prdt_img li > a{background:rgba(255, 255, 255, 0.5)}
.csstransforms .page11 .reverse .prdt_img li > a{background:rgba(0, 0, 0, 0.4)}
.csstransforms .page11 .prdt_img li.on > a{background:rgba(43, 135, 210, 1)}

.navigation{position:absolute;bottom:68px;left:347px;z-index:5;width:557px;height:16px;background:url(../img/line-black.png) no-repeat}
.navigation .navigation_line{position:absolute;top:0;left:0;width:16px;height:16px;background:url(../img/line-blue.png) no-repeat}
.navigation .navigation_line > span{display:block;width:16px;height:16px;position:absolute;top:0;right:0px;background:url(../img/dot_on.png) no-repeat}
.navigation ul{width:557px;height:16px;background:url(../img/line-white.png) no-repeat}
.navigation li{position:relative;z-index:6;float:left;width:16px;margin-left:92px}
.navigation li:first-child{margin-left:0}
.navigation li a{display:block;width:16px;height:16px;background:none}
.navigation li span{position:absolute;top:22px;display:block;height:12px;text-indent:-9999px;font-size:0}
.navigation li .nav_intro{left:-11px;width:39px;background:url(../img/txt_intro_black.png) no-repeat}
.navigation li .nav_am{left:-24px;width:58px;background:url(../img/txt_am_black.png) no-repeat}
.navigation li .nav_pm{left:-24px;width:59px;background:url(../img/txt_pm_black.png) no-repeat}
.navigation li .nav_pm2{left:-24px;width:59px;background:url(../img/txt_pm2_black.png) no-repeat}
.navigation li .nav_outro{left:-15px;width:46px;background:url(../img/txt_outro_black.png) no-repeat}
.navigation.inverse{background:url(../img/line_white.png) no-repeat}
.navigation.inverse li .nav_intro{width:39px;background:url(../img/txt_intro_white.png) no-repeat}
.navigation.inverse li .nav_am{width:58px;background:url(../img/txt_am_white.png) no-repeat}
.navigation.inverse li .nav_pm{width:59px;background:url(../img/txt_pm_white.png) no-repeat}
.navigation.inverse li .nav_pm2{width:59px;background:url(../img/txt_pm2_white.png) no-repeat}
.navigation.inverse li .nav_outro{width:46px;background:url(../img/txt_outro_white.png) no-repeat}

.btn_download{display:inline-block;width:177px;height:38px;background:url(../img/btn_download_pdf.png) no-repeat}
.btn_download:hover{background-position:0 -48px}
.btn_download span{text-indent:-9999px;font-size:0;position:absolute;top:-9999px}

.btn_play_video{display:inline-block;width:212px;height:38px;background:url(../img/btn_play_video.png) no-repeat}
.btn_play_video:hover{background-position:0 -48px}
.btn_play_video span{text-indent:-9999px;font-size:0;position:absolute;top:-9999px}

.btn_sec{display:inline-block;width:177px;height:38px;background:url(../img/btn_sec.png) no-repeat}
.btn_sec:hover{background-position:0 -48px}
.btn_sec span{text-indent:-9999px;font-size:0;position:absolute;top:-9999px}