@import url('/kr/css/webfont.css');
/*common*/
.wa{text-indent:-9999px;font-size:0;position:absolute;top:-9999px;}
.sns-bns{text-indent:-9999px;font-size:0;position:absolute;top:-9999px;}
.clfix:after{content:'';display:block;clear:both;height:0;visibility: hidden;}
.vjs-control-bar,
.vjs-loading-spinner,
.vjs-text-track-display,
.vjs-big-play-button{display:none;}
.sns-bns{text-indent:-9999px;font-size:0;position:absolute;top:-9999px;}

/*Element*/
/*
.btn_close{display:inline-block;position:absolute;top:30px;right:30px;width:92px;height:93px;background:url(../img/element_contents.png) no-repeat -5px -80px;}
.btn_close.reverse{background-position:-110px -80px;}
.btn_close span{text-indent:-9999px;font-size:0;position:absolute;top:-9999px;}

.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_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}
*/

audio{display:none;}

#content {position:relative; min-width:1280px; margin:0 auto; overflow:hidden; line-height:26px; font-family:'samsungonekorean400'; font-size:15px; color:#444;}
.section{overflow:hidden;position:relative;width:100%;}

.btn_download{display:inline-block;width:210px;height:45px;background:url(../img/btn_download.png) no-repeat;}
.btn_download:hover{background-position: 0 -55px;}
.btn_download span{text-indent:-9999px;font-size:0;position:absolute;top:-9999px}

.cover_wrap{padding:50px 0 80px 0;}
.cover{position:relative;max-width:1760px;height:1028px;margin:0 auto;padding-top:191px;background:url(../img/bg_intro.gif) no-repeat 50% 0;}
.cover h2{position:relative;width:951px;height:339px;margin:0 0 69px 174px;}
.cover .txt_cover{position:relative;top:50px;opacity:0;}
.cover .title dl{margin:0 0 54px 275px;color:#fff;}
.cover .title dt{margin-bottom:60px;}
.cover .title dd{margin-bottom:20px;}
.cover .title dd:last-child{margin-bottom:0;}
.cover .annotation{height:30px;line-height:30px;margin-left:275px;padding-left:42px;color:#bbb;background:url(../img/ico_headphone.gif) no-repeat 0 50%;}
.img_turntable{position:absolute;top:0;left:80px;display:inline-block;width:162px;height:162px;background:url(../img/img_turntable.png) no-repeat;}
.ie9 .img_turntable{background:url(../img/img_turntable.gif) no-repeat 50% 50%;}

.information{height:900px;background:#252525;border-bottom:1px solid #fff;color:#fff;text-align:center;}
.information dl{width:815px;height:854px;margin:0 auto;padding-top:225px;}
.information dt{margin-bottom:60px;padding-top:156px;font-family:'samsungonelatin600';font-size:50px;background:url(../img/wave.gif) no-repeat 50% 0;}
.information dd{font-size:18px;line-height:32px;}

/*fixed*/
.fixed .cover_wrap{position:fixed;bottom:0;}
.fixed .information{margin-top:1380px;}

/*Common*/
.category_tit{margin-bottom:46px;line-height:86px;font-size:100px;font-family:'samsungonelatin200';font-weight:normal;}
.sub_tit{margin-bottom:27px;line-height:60px;font-size:50px;font-family:'samsungonelatin300';font-weight:normal;}
.mini_tit{font-family:'samsungonelatin800';font-size:16px;}
.txt_b{font-size:22px;line-height:38px;font-family:'samsungonekorean300';}
.txt{font-size:18px;line-height:30px;}
.scale_note{margin-top:131px;}
.scale_note p{margin-bottom:83px;}
.layout,
.desc{position:relative;}
.layout{width:1300px;height:100%;margin:0 auto;box-sizing:border-box;}


/*Over the Horizon*/
.section01{height:1318px;background:#252525;}
.section01 .layout{width:1370px;height:100%;margin:0 auto; padding-top:343px; color:#fff;text-align:center;box-sizing:border-box;}

/*Galaxy S7*/
.section02{height:1405px;background:#fff;}
.section02 .layout{padding-top:205px; color:#000;}
.section02 .desc{z-index:1;}
.section02 .galaxy_s7{position:absolute;top:337px;left:553px;width:300px;height:606px;}
.section02 .galaxy_s7 > div{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/galaxy_s7.png) no-repeat;opacity:0;}
.section02 .galaxy_s7 > div:nth-child(1){background-position:0 0;opacity:1;}
.section02 .galaxy_s7 > div:nth-child(2){background-position:-310px 0;}
.section02 .galaxy_s7 > div:nth-child(3){background-position:-620px 0;}
.section02 .galaxy_s7 > div:nth-child(4){background-position:-930px 0;}

.section02 .circle{position:absolute;top:200px;left:566px;width:748px;height:748px;border-radius:100%;background:#8dafb4;}
.section02 .circle li{position:absolute;top:0;left:0;opacity:0;width:652px;height:652px;border-radius:100%;border:48px solid #99b7bc;}
.ie9 .section02{background:#fff url(../img/bg_galaxy_s7.gif) no-repeat 50% 199px;}
.ie9 .section02 .circle{display:none;}

/*Gear Icon X*/
.section03{height:985px;background:#fff;}
.section03 .layout{padding-left:772px; color:#000;}
.section03 .desc{z-index:4;padding:0 0 90px 78px;}
.section03 .gear_iconx{position:absolute;top:33px;left:-59px;width:633px;height:633px;}
.section03 .gear_iconx .iconx_circle{position: relative;z-index:2;width:100%;height:100%;border-radius:100%;background:#7a87bc;}
.section03 .gear_iconx .iconx_left{position:absolute;z-index:5;top:78px;left:85px;}
.section03 .gear_iconx .iconx_right{position:absolute;z-index:5;top:135px;left:290px;}
.section03 .gear_iconx.icon01 .active_dot01{display:block;top:416px;left:303px;}
.section03 .gear_iconx.icon01 .active_dot02{display:none;}
.section03 .gear_iconx.icon02 .active_sound01{display:block;top:255px;left:743px;}
.section03 .gear_iconx.icon02 .active_sound02{display:block;width:84px;height:136px;top:156px;left:-16px;transform:rotate(180deg)}
.section03 .gear_iconx.icon03 .active_plus{display:block;top:255px;left:640px;}
.section03 .gear_iconx.icon03 .active_minus{display:block;top:464px;left:640px;}
.section03 .gear_iconx.icon04 .active_dot01{display:block;top:228px;left:138px;}
.section03 .gear_iconx.icon04 .active_dot02{display:block;top:368px;left:632px;}
.section03 .soundbar{z-index:3;}
.ie9 .section03 .gear_iconx.icon02 .active_sound02{width:84px;height:136px;background:url(../img/active_sound02.png) no-repeat;}
.ie9 .section03 .soundbar{display:block;left:50%;width:1920px;margin-left:-960px;opacity:1;background:url(../img/soundbar.png) no-repeat;}
.ie9 .section03 .soundbar > div{display:none;}


/*Beyond the Horizon*/
.section04{height:1234px;background:#252525;}
.section04 .layout{padding-top:290px; color:#fff;text-align:center;}

/*Q9500*/
.section05{height:1163px;padding-top:137px;background:#fff;}
.section05 .layout{padding:274px 0 0 850px; color:#000;}
.section05 .q9500_area{position:absolute;top:0;left:-81px;width:738px;height:972px;}
.section05 .q9500{position:relative;z-index:3;}
.section05 .aircon01 .active_dot{display:block;top:537px;left:588px;}
.section05 .aircon02 .active_up{display:block;top:579px;left:584px;}
.section05 .aircon02 .active_down{display:block;top:629px;left:584px;}
.ie9 .section05{background:#fff url(../img/bg_q9500.gif) no-repeat 100% 54px;}

/*Retro Oven*/
.section06{height:1013px;padding-top:150px;background:#fff;}
.section06 .layout{padding-top:90px; color:#000;}
.section06 .desc{z-index:1;width:400px;left:0;padding:0 40px 50px 0;}
.section06 .oven_area{position: absolute;top:0;left:624px;z-index:1;}
.section06 .oven01 .active_dot{display:block;top:207px;left:154px;}
.section06 .oven02 .active_sound{display:block;width:107px;height:177px;top:40px;left:542px;transform:rotate(-90deg)}
.section06 .oven03 .active_dot{display:block;top:307px;left:554px;}
.ie9 .section06 .soundbar02{display:block;left:50%;width:1920px;margin-left:-960px;opacity:1;background:url(../img/soundbar02.png) no-repeat -2px 0;}
.ie9 .section06 .soundbar02 > div{display:none;}
.ie9 .section06 .oven02 .active_sound{width:177px;height:107px;top:80px;left:522px;background:url(../img/oven_tone.png) no-repeat;}

/*Outro*/
.outro_wrap{padding:80px 0 56px 0;background:#fff;}
.outro{max-width:1760px;height:573px;margin:0 auto;padding-top:277px;color:#fff;text-align:center;background:url(../img/bg_outro.gif) no-repeat 50% 0;}
.outro dt{margin-bottom:33px;font-size:30px;line-height:38px;}
.outro dd{margin-bottom:45px;}

/*Common Sound Action*/
.sound_list{margin-top:110px;}
.sound_list li{margin-bottom:42px;}
.sound_list li a{line-height:0;vertical-align:top;}
.sound_list em{display:inline-block;height:44px;line-height:44px;font-family:'samsungonelatin800';line-height:44px;vertical-align:top;}
.sound_list li p{display:none;padding:10px 0 0 0;}
.sound_list li.on p{display:block;}

/*sound button*/
.btn_sound_s{display:inline-block;width:44px;height:44px;margin-left:5px;background:url(../img/btn_sound_s.png) no-repeat 0 -54px;vertical-align:top;}
a.on .btn_sound_s{background-position:0 0;}

/*sound button big*/
.scale_note .btn_control{display:inline-block;width:82px;height:82px;background:url(../img/btn_sound.png) no-repeat;}
.scale_note .btn_control.on{background-position:0 -92px;}

/*Animation & Transition*/
.img_turntable{animation:turntable 2s infinite linear;}

.gif_animation01{position:absolute;top:158px;left:0;width:210px;}
.gif_animation01 span{float:left;display:inline-block;width:59px;height:59px;border-radius:100%;margin:0 11px 11px 0;background:#f2704c;}
.gif_animation01 span:nth-child(1){animation:gif01 .6s .2s infinite alternate linear;}
.gif_animation01 span:nth-child(2){animation:gif01 .6s 1.0s infinite alternate linear;}
.gif_animation01 span:nth-child(3){animation:gif01 .6s .8s infinite alternate linear;}
.gif_animation01 span:nth-child(4){animation:gif01 .6s .3s infinite alternate linear;}
.gif_animation01 span:nth-child(5){animation:gif01 .6s .9s infinite alternate linear;}
.gif_animation01 span:nth-child(6){animation:gif01 .6s .1s infinite alternate linear;}
.gif_animation01 span:nth-child(7){animation:gif01 .6s .5s infinite alternate linear;}
.gif_animation01 span:nth-child(8){animation:gif01 .6s .7s infinite alternate linear;}
.gif_animation01 span:nth-child(9){animation:gif01 .6s 1.1s infinite alternate linear;}
.ie9 .gif_animation01{width:199px;height:199px;background:url(../img/gif_ani01.png) no-repeat 50% 50%;}
.ie9 .gif_animation01 span{display:none;}

.gif_animation02{position:absolute;bottom:240px;right:0;}
.gif_animation02 span{float:left;display:inline-block;width:59px;height:59px;border-radius:100%;margin:0 0 11px 11px;background:#5d99ba;animation:gif02 1.4s infinite ease-in-out both;}
.gif_animation02 span:nth-child(1){animation-delay: -0.32s;}
.gif_animation02 span:nth-child(2){animation-delay: -0.16s;}
.ie9 .gif_animation02{width:175px;height:59px;background:url(../img/gif_ani02.png) no-repeat 50% 50%;}
.ie9 .gif_animation02 span{display:none;}

.gif_animation03{position:absolute;top:163px;right:136px;}
.gif_animation03 span{display:inline-block;position:absolute;top:0;left:0;width:156px;height:156px;border-radius:100%;border:1px solid #e2b03f;animation: gif03 1s infinite ease-out both;}
.gif_animation03 span:nth-child(1){animation-delay: -0.2s;}
.gif_animation03 span:nth-child(2){animation-delay: -0.4s;}
.gif_animation03 span:nth-child(3){animation-delay: -0.6s;}
.gif_animation03 span:nth-child(4){animation-delay: -0.8s;}
.ie9 .gif_animation03 {top:98px;right:201px;width:288px;height:288px;background:url(../img/gif_ani03.png) no-repeat;}
.ie9 .gif_animation03 span{display:none;}

.gif_animation04{position:absolute;bottom:154px;left:0;height:126px}
.gif_animation04 span{display:inline-block;position:absolute;width:44px;height:44px;border-radius:100%;border:1px solid #ed8874;animation: gif04 1.8s infinite ease-in-out;}
.gif_animation04 span:nth-child(2){animation-delay: -1.2s;}
.gif_animation04 span:nth-child(3){animation-delay: -0.6s;}
.ie9 .gif_animation04 {width:117px;height:102px;background:url(../img/gif_ani04.png) no-repeat;}
.ie9 .gif_animation04 span{display:none;}

.sec02_animation .outer_circle li{position:absolute;border-radius:100%;}
.q9500_area .line_animation li{position:absolute;z-index:1;left:122px;bottom:122px;width:482px;height:482px;transform:rotate(45deg);opacity:1;border:20px solid #95b6c5;}
.sec05_animation .outer_square li{position:absolute;border:1px solid #f4baaf;}

.ie9 .section05 .q9500_area{left:-191px;width:957px;height:1083px;background:url(../img/q9500.gif) no-repeat 50% 100%;}
.ie9 .section05 .q9500_area .line_animation,
.ie9 .section05 .q9500_area img{display:none;}
.ie9 .sec05_animation .outer_square{display: none;}


.soundbar{overflow:hidden;position:absolute;top:605px;left:50%;width:40px;height:190px;margin-left:-359px;opacity:0;transition:left 3.5s .2s ease-in-out, width 3.5s .2s ease-in-out, margin-left 3.5s .2s ease-in-out,opacity .8s .2s ease-in-out;}
.soundbar > div{position:relative;width:1920px;height:190px;left:50%;margin-left:-960px;transition:left 3.5s .2s ease-in-out}
.soundbar .line{position:relative;float:left;width:25px;height:100px;margin-left:15px;border-radius:12px;background:#e1b95a;}
.active .soundbar .line{animation:soundbar70 1s infinite ease-in-out}
.active .soundbar .h190{animation:soundbar190 .8s infinite ease-in-out}
.active .soundbar .h130{animation:soundbar130 .8s infinite ease-in-out}
.active .soundbar .h60{animation:soundbar60 .8s infinite ease-in-out}
.active .soundbar .h25{animation:soundbar25 .8s infinite ease-in-out}

.soundbar02{overflow:hidden;position:absolute;top:770px;left:50%;width:20px;height:190px;margin-left:140px;opacity:0;transition:left 3.5s .2s ease-in-out, width 3.5s .2s ease-in-out, margin-left 3.5s .2s ease-in-out,opacity .8s .2s ease-in-out;}

.soundbar02 > div{position:relative;width:1920px;height:190px;left:50%;margin-left:-960px;transition:left 3.5s .2s ease-in-out}
.soundbar02 .line{position:relative;float:left;width:12px;height:100px;margin-left:8px;background:#87afb1;}
.active .soundbar02 .line{animation:soundbar70 1s infinite ease-in-out}
.active .soundbar02 .h190{animation:soundbar190 .8s infinite ease-in-out}
.active .soundbar02 .h130{animation:soundbar130 .8s infinite ease-in-out}
.active .soundbar02 .h60{animation:soundbar60 .8s infinite ease-in-out}
.active .soundbar02 .h25{animation:soundbar25 .8s infinite ease-in-out}

.active .soundbar{width:1920px;margin-left:-960px;opacity:0.8;}
.active .soundbar02{width:1920px;margin-left:-960px;opacity:0.6;}

.active .sec02_animation .circle li:nth-child(1){animation: circle 3.6s 3.6s infinite linear;}
.active .sec02_animation .circle li:nth-child(2){animation: circle 3.6s 3.3s infinite linear;}
.active .sec02_animation .circle li:nth-child(3){animation: circle 3.6s 3.0s infinite linear;}
.active .sec02_animation .circle li:nth-child(4){animation: circle 3.6s 2.7s infinite linear;}
.active .sec02_animation .circle li:nth-child(5){animation: circle 3.6s 2.4s infinite linear;}
.active .sec02_animation .circle li:nth-child(6){animation: circle 3.6s 2.1s infinite linear;}
.active .sec02_animation .circle li:nth-child(7){animation: circle 3.6s 1.8s infinite linear;}
.active .sec02_animation .circle li:nth-child(8){animation: circle 3.6s 1.5s infinite linear;}
.active .sec02_animation .circle li:nth-child(9){animation: circle 3.6s 1.2s infinite linear;}
.active .sec02_animation .circle li:nth-child(10){animation: circle 3.6s .9s infinite linear;}
.active .sec02_animation .circle li:nth-child(11){animation: circle 3.6s .6s infinite linear;}
.active .sec02_animation .circle li:nth-child(12){animation: circle 3.6s .3s infinite linear;}

.active .sec02_animation .outer_circle li:nth-child(1){width:356px;height:356px;top:455px;background:#e7dcd3;animation:outerCircleMove01 5.3s infinite ease-out}
.active .sec02_animation .outer_circle li:nth-child(2){width:200px;height:200px;top:534px;background:#c2d8e5;animation:outerCircleMove02 5.3s infinite ease-out}
.active .sec02_animation .outer_circle li:nth-child(3){width:292px;height:292px;top:428px;background:#5d99ba;animation:outerCircleMove03 5.8s infinite ease-out;}


.active .q9500_area .line_animation li:nth-child(1){animation: square01 1.8s 1.8s  infinite ease-out;}
.active .q9500_area .line_animation li:nth-child(2){animation: square01 1.8s 1.2s infinite ease-out;}
.active .q9500_area .line_animation li:nth-child(3){animation: square01 1.8s .6s infinite ease-out;}

.active .sec05_animation .outer_square li:nth-child(1){width:298px;height:298px;animation:outerSquareMove01 4.3s infinite ease-out}
.active .sec05_animation .outer_square li:nth-child(2){width:187px;height:187px;animation:outerSquareMove02 4.3s infinite ease-out}
.active .sec05_animation .outer_square li:nth-child(3){width:298px;height:298px;animation:outerSquareMove03 4.3s infinite ease-out}

.active_dot{display:none;position:absolute;z-index:10;width:30px;height:30px;border-radius:30px;background:#e74240;box-shadow:0 0 10px #252525;animation:blink .8s infinite alternate linear;}
.active_plus{display:none;position:absolute;z-index:10;width:79px;height:79px;background:url(../img/active_plus.png) no-repeat;animation:blink .8s infinite alternate linear;}
.active_minus{display:none;position:absolute;z-index:10;width:79px;height:33px;background:url(../img/active_minus.png) no-repeat;animation:blink .8s infinite alternate linear;}
.active_sound{display:none;position:absolute;z-index:10;width:107px;height:177px;background:url(../img/active_sound.png) no-repeat;background-size:cover;animation:blink .8s infinite alternate linear;}
.active_up{display:none;position:absolute;z-index:10;width:58px;height:43px;background:url(../img/active_up.png) no-repeat;animation:blink .8s infinite alternate linear;}
.active_down{display:none;position:absolute;z-index:10;width:58px;height:43px;background:url(../img/active_down.png) no-repeat;animation:blink .8s infinite alternate linear;}


/*Animation KeyFrames*/
@keyframes gif01 {
	0%{transform:scale(1);opacity:1;}
	100%{transform:scale(.3);opacity:.3;}
}

@keyframes gif02 {
	0%, 80%, 100% {transform: scale(0) }
	40% {transform: scale(1.0) }
}

@keyframes gif03 {
  0% {transform: scale(1);opacity:0;}
  80% {opacity:1;}
  100% {transform: scale(2);opacity:0;}
}

@keyframes gif04 {
  0% {transform: translateX(73px)}
  33% {transform: translateX(146px) translateY(100px)}
  67% {transform: translateX(0px) translateY(100px)}
  100% {transform: translateX(73px)}
}

@keyframes outerSquareMove01{
	0%{left:-146px;top:812px;transform:rotate(45deg) scale(0.5);opacity:.1;}
    80%{opacity:.9;}
	100%{left:-446px;top:612px;transform:rotate(45deg) scale(1.1);opacity:.1;}
}

@keyframes outerSquareMove02{
	0%{right:-37px;top:207px;transform:rotate(45deg) scale(0.5);opacity:.1;}
	50%{right:-137px;top:307px;transform:rotate(45deg) scale(0.5);}
    80%{opacity:.9;}
	100%{right:-187px;top:187px;transform:rotate(45deg) scale(1.1);opacity:.1;}
}

@keyframes outerSquareMove03{
	0%{right:-423px;top:115px;transform:rotate(45deg) scale(0.5);opacity:.1;}
	50%{right:-323px;top:15px;transform:rotate(45deg) scale(0.5);}
    80%{opacity:.9;}
	100%{right:-423px;top:115px;transform:rotate(45deg) scale(1.1);opacity:.1;}
}

@keyframes square01{
	0%{transform:rotate(45deg) scale(.8);opacity:.1;border:20px solid #95b6c5;}
    80%{opacity:.9;}
	100%{transform:rotate(45deg) scale(1.3);opacity:.1;border:1px solid #95b6c5;}
}

@keyframes outerCircleMove01{
	0%{left:42%;transform:scale(0.1);opacity:.1;}
    80%{opacity:.9;}
	100%{left:-400px;transform:scale(.8);opacity:.1;}
}

@keyframes outerCircleMove02{
	0%{left:50%;transform:scale(0.1);opacity:.1;}
    80%{opacity:.9;}
	100%{left:-200px;transform:scale(.8);opacity:.1;}
}

@keyframes outerCircleMove03{
	0%{right:-14px;transform:scale(0.1);opacity:.1;}
    80%{opacity:.9;}
	100%{right:-370px;transform:scale(1);opacity:.1;}
}


@keyframes soundbar190{
	0%, 80%, 100%{top:0;height:190px;}
	40%{top:25px;height:140px}
}
@keyframes soundbar130{
	0%, 80%, 100%{top:30px;height:130px}
	40%{top:55px;height:80px}
}

@keyframes soundbar70{
	0%, 80%, 100%{top:60px;height:70px}
	40%{top:40px;height:110px}
}

@keyframes soundbar60{
	0%, 80%, 100%{top:65px;height:60px}
	40%{top:45px;height:100px}
}

@keyframes soundbar25{
	0%, 80%, 100%{top:83px;height:25px}
	40%{top:63px;height:65px}
}

@keyframes turntable {
    0%{transform:rotate(0deg)}
    100%{transform:rotate(360deg)}
}
@keyframes blink {
    0%{opacity:0;}
    100%{opacity:1}
}

@keyframes circle {
	0% {transform: scale(0.1);opacity:0;}
	10% {transform: scale(0.1);opacity:0.1;}
	70% {transform: scale(0.8);opacity:0.9}
	100% {transform: scale(1);opacity:0.1}
}
