@charset "utf-8";

/* *********************************************************************************************************
 * reset
 **********************************************************************************************************/
.desktop body, .desktop button, .desktop h1, .desktop h2, .desktop h3, .desktop h4, .desktop h5, .desktop h6, .desktop li, .desktop ol, .desktop p, .desktop ul{margin:0;padding:0}
.desktop body, .desktop button {font-family: 'Noto Sans KR','Noto Sans JP', Helvetica, sans-serif;line-height:1.5}
.desktop img{border:0;display:inline-block}
.desktop img,.desktop li{vertical-align:top}
.desktop li,.desktop ol,.desktop ul{list-style:none}
.desktop em{font-style:normal}
.desktop a{color:inherit;text-decoration:none}
.desktop a:active,a:focus,a:hover{text-decoration:underline}
.desktop button{border:0;background:0 0;cursor:pointer}
.desktop .blind {overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:1;line-height:0}
.desktop body{background:#090d16; color: #ffffff; font-family: 'Noto Sans KR','Noto Sans JP', Helvetica, sans-serif;}
.desktop #wrap{overflow:hidden;}


/* ******************************************************************************************************
 * header
 ****************************************************************************************************** */
 
 
	.desktop .header {position:fixed;overflow-y:auto;top:0;left:0;z-index:90; width:100%;padding:25px 60px;background:rgba(0,0,0,.5);-webkit-box-sizing:border-box;box-sizing:border-box}
	.desktop .header a:hover{text-decoration: none;}
	.desktop .header .btn_menu .ico {display:none;}
	.desktop .header .inner{display:block;overflow-y:auto;position:relative;top:0;left:0;z-index:90;width:100%;height:100%;text-align:center;opacity:1; height: 100%;}
	.desktop .header .inner .logo{float:left; width: 140px; margin: 0 0 0 0px;}
	.desktop .header .inner .logo img{height: auto; width: 100%;}
	.desktop .header .inner .logo a{display:block;position:relative;opacity:0.5;-webkit-transition:all .3s cubic-bezier(0.23, 1, 0.32, 1);-ms-transition:all .3s cubic-bezier(0.23, 1, 0.32, 1);transition:all .3s cubic-bezier(0.23, 1, 0.32, 1)}
	.desktop .header .inner .logo a:hover,.desktop .header .logo a:focus{opacity:1}
	.desktop .header .btn_menu{display: none;}
	.desktop .header .inner .gnb{float:right;margin:0;}
	.desktop .header .inner .gnb li{display:inline-block;margin-left:40px}
	.desktop .header .inner .gnb li:first-child{margin-left:0}
	.desktop .header .inner .gnb .btn{font-size:32px; font-weight:400; width:100%;margin:5px 0;padding:5px 0;position:relative;opacity:.3;-webkit-transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1);-ms-transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1);transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1)}
	.desktop .header .inner .gnb .btn:after{display:inline-block;width:70px;height:17px;}
	.desktop .header .inner .gnb .btn:hover{opacity:1;}
	.desktop .header .inner .util{float:left;margin:10px 0 0 25px}
	.desktop .header .inner .util .btn{display:inline-block;overflow:hidden;width:34px;height:30px;margin-left:10px;background:url(../img/p/common/sp.png) 0 0 no-repeat;vertical-align:top;color:transparent;opacity:.5}
	.desktop .header .inner .util .btn:hover{opacity:1}
	.desktop .header .inner .util .btn:first-child{margin-left:0px;}
	.desktop .header .inner .util .btn_twitter{background-position:0 -74px}
	.desktop .header .inner .util .btn_facebook{background-position:0 -108px}
	.desktop .header .inner .util .btn_cafe{background-position:-34px -74px}
	
 
@media (max-width:768px) {
	.desktop .header{position:fixed;top:0;left:0;z-index:100;background:transparent; display: block;}
	.desktop .header.btn_menu .ico {display: inline-block; top:50%;margin-top:-1px;}
	.desktop .header.inner{display:none;overflow-y:auto;position:fixed;top:0;left:0;z-index:90;width:100%;height:100%;background:rgba(0,0,0,.9);text-align:center;opacity:1}
	.desktop .header.inner .logo{ width:168px; float:none; display:inline-block; margin: 15px 0;}
	.desktop .header.inner .logo a{height:auto;opacity:1;}
	.desktop .header.inner .gnb{float:none; width:228px;margin:0 auto 0;border-top:1px solid rgba(255,255,255,.2)}
	.desktop .header.inner .gnb li{display:block;margin-left:0}
	.desktop .header.inner .gnb .btn{font-size:24px; font-weight:400; display:inline-block;position:relative;opacity:1;-webkit-transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1);-ms-transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1);transition:opacity .5s cubic-bezier(0.23, 1, 0.32, 1)}
	.desktop .header.inner .gnb li:first-child{margin-left:0}
	.desktop .header.inner .util{float: none; width:228px;margin:0 auto;padding-top:30px;border-top:1px solid rgba(255,255,255,.2)}
	.desktop .header.inner .util .btn{ padding:0; margin: 0 0 0 10px;opacity:1 }
	.desktop .header.inner .util .btn:first-child{margin-left:0}
	
	.desktop .header.btn_menu{display:block; position:fixed;top:20px;left:15px;z-index:100;width:30px;height:25px;color:transparent;outline:0}
	.desktop .header.btn_menu:before,.desktop .header.btn_menu:after,
	.desktop .header.btn_menu .ico{overflow:hidden;position:absolute;left:0;width:100%;height:2px;border-radius:2px;background:#fff;opacity:1;-webkit-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.2);-moz-box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.2);box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.2);-webkit-transform:rotate(0);-moz-transform:rotate(0);transform:rotate(0);-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-transform-origin:left center;-moz-transform-origin:left center;transform-origin:left center;content:''}
	.desktop .header.btn_menu:before{top:0}
	.desktop .header.btn_menu:after{bottom:0}
	.desktop .header.btn_menu[aria-expanded=true] .ico{left:-50%;opacity:0}
	.desktop .header.btn_menu[aria-expanded=true]:before{-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg);-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;top:1px;left:3px}
	.desktop .header.btn_menu[aria-expanded=true]:after{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;left:3px;bottom:1px}
	.desktop .header.inner .util .btn_twitter:after{background-position:-169px 0}
	.desktop .header.inner .util .btn_facebook:after{background-position:-192px 0}
 }
 
	.desktop .header.inner{overflow:hidden;width:100%;max-width:1920px;margin:0 auto}
	.desktop .header.inner .util .btn:hover,.desktop .header.util .btn:focus{opacity:.8;-webkit-transition:all .3s ease-in-out;-ms-transition:all .3s ease-in-out;transition:all .3s ease-in-out}
	.desktop .header.inner .gnb .btn.on,
	.desktop .header.inner .gnb .btn:hover{opacity:1}
	.desktop .header.inner .gnb .btn_register{}
	.desktop .header.inner .gnb .btn_media{background-position:-191px -99px}
	.desktop .header.inner .gnb .btn_register.on,
	.desktop .header.inner .gnb .btn_register:hover,
	.desktop .header.inner .gnb .btn_media.on,
	.desktop .header.inner .gnb .btn_media:hover {text-decoration:none;}

	.desktop .header.inner .gnb .btn_register:after{}
	.desktop .header.inner .gnb .btn_media:after{}
	.desktop .header.inner .util .btn:after{display:inline-block;width:21px;height:21px;}
	
/* ******************************************************************************************************
 * section 
 ****************************************************************************************************** */
.desktop .section{position:relative;width:1440px;margin:0 auto; max-width:100%;}
.desktop .section:before,.desktop .section:after{position:absolute;top:0;width:560px;height:100%;background:0 0 no-repeat;content:''}
.desktop .section:before{left:0;margin-left:-560px}
.desktop .section:after{right:0;margin-right:-560px}
.desktop .section_content{position:absolute;top:0;left:0;z-index:20;width:100%;height:100%;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}

/* ******************************************************************************************************
 * main section
 ****************************************************************************************************** */
.desktop .main:before{background-image:url(../img/p/main/bg_l.jpg)}
.desktop .main:after{background-image:url(../img/p/main/bg_r.jpg)}
.desktop .main .video{position:absolute;top:50%;left:50%;z-index:10;width:2560px;height:100%;transform:translate3d(-50%, -50%, 0)}
.desktop .main .video:after{position:absolute;top:0;left:0;width:100%;height:100%;background: url(../img/p/main/bg_p.png) 0 0 repeat;content:''}
.desktop .main .video video{width:100%;height:100%}
.desktop .main .section_content{padding-top:400px}
.desktop .main .title{margin:0 auto 40px;font-size: 32px; font-weight: 700;}
.desktop .main .logo{max-width: 98%;}
.desktop .main .logo img{max-width: 100%;}
.desktop .main .btn_register{display:inline-block;margin-top:67px}
.desktop .main .btn_download {margin: 80px 0 0;}
.desktop .main .btn_download a {margin: 0 10px 0 0;}
.desktop .main .btn_download a:nth-child(2) {margin: 0 0 0 30px;}
.desktop .main .box{margin-top:40px}
.desktop .main .box .btn{display:inline-block;margin:0 17px}
.desktop .main .copy{position:absolute;bottom:30px;left:50%;z-index:10;transform:translateX(-50%)}

/* ******************************************************************************************************
 * register
 ****************************************************************************************************** */
.desktop .register{height: 1600px;}
.desktop .register:before{background-image:url(../img/p/register/bg_l.jpg)}
.desktop .register:after{background-image:url(../img/p/register/bg_r.jpg)}
.desktop .register .section_content{padding-top:200px}
.desktop .register .box{display:inline-block;position:relative;vertical-align:top;z-index:10;}
.desktop .feature_img img {
    max-width: 80%;
    height: auto;
    margin: 0 auto;
}
.desktop .features h2 {
    font-size: 48px;
    line-height: 56px;
    text-align: center;
    margin: 0 0 40px 0;
    font-weight: 900;
}
.desktop .features .section_head_inner_bullet ul li {
    padding: 0 0 40px;
    font-size: 36px;
    line-height: 42px;
    text-align: center;
    list-style-position: inside;
    list-style-image: url(../img/p/main/st_bullet.png);
    color: rgba(255,255,255,0.6);
}
.desktop .features .section_head_inner_bullet {
    background-image: url(../img/p/main/feature_bg.jpg);
    background-position: top center;
    background-size: cover;
    background-repeat: none;
	-webkit-border-bottom-right-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
	-moz-border-radius-bottomright: 15px;
	-moz-border-radius-bottomleft: 15px;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	background-color:rgba(0,0,0,0.8);
	padding: 40px;
	max-width: 80%;
	margin: 0 auto;
	box-shadow: 0 0 15px rgba(0,0,0,0.8)
}
.desktop .spaceship1{position:absolute;top:380px;left:-570px;opacity:0;-webkit-transform:scale(.2);-ms-transform:scale(.2);transform:scale(.2);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1)}
.desktop .spaceship1.active{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-animation:spaceship1 2s linear .8s infinite alternate;animation:spaceship1 2s linear .8s infinite alternate}
@-webkit-keyframes spaceship1 {from{top:380px} to{top:350px}}
@keyframes spaceship1 {from{top:380px} to{top:350px}}
.desktop .spaceship2{position:absolute;bottom:10px;right:-600px;z-index:50;opacity:0;-webkit-transform:scale(.2);-ms-transform:scale(.2);transform:scale(.2);-webkit-transform-origin:bottom left;-ms-transform-origin:bottom left;transform-origin:bottom left;-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1)}
.desktop .spaceship2.active{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-animation:spaceship2 2s linear .8s infinite alternate;animation:spaceship2 2s linear .8s infinite alternate}
@-webkit-keyframes spaceship2 {from{bottom:20px} to{bottom:0px}}
@keyframes spaceship2 {from{bottom:20px} to{bottom:0px}}


/* ******************************************************************************************************
 * media section
 ****************************************************************************************************** */
.desktop .media:before{background-image:url(../img/p/media/bg_l.jpg)}
.desktop .media:after{background-image:url(../img/p/media/bg_r.jpg)}
.desktop .media .section_content{padding-top:240px}
/* Slider */
.desktop .media .swiper_wrap{position:relative;width:1096px;margin:69px auto 0}
.desktop .media .swiper_wrap .swiper{overflow:hidden;width:100%}
.desktop .media .swiper_wrap .slides{font-size:0;white-space:nowrap}
.desktop .media .swiper_wrap .slide{display:inline-block;padding:0 16px}
.desktop .media .swiper_wrap .slides img.d_thumb {display:block;}
.desktop .media .swiper_wrap .slides img.m_thumb {display:none;}
.desktop .media .swiper_wrap .btn{display:none;position:absolute;top:50%;width:38px;height:75px;background:url(../img/p/common/sp.png) no-repeat;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
.desktop .media .swiper_wrap .btn_prev{left:-80px;background-position:-71px -74px}
.desktop .media .swiper_wrap .btn_next{right:-80px;background-position:-113px -74px}
/* Play icon */
.desktop .media .swiper_wrap .btn_play{position:relative}
.desktop .media .swiper_wrap .btn_play .ico_play{position:absolute;top:50%;left:50%;width:181px;height:181px;margin:-90px 0 0 -90px;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1)}
.desktop .media .swiper_wrap .btn_play .ico_play:before,.desktop .media .swiper_wrap .ico_play:after{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/p/common/sp.png) no-repeat;-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);content:''}
.desktop .media .swiper_wrap .btn_play .ico_play:before{background-position:0 -338px;opacity:1}
.desktop .media .swiper_wrap .btn_play .ico_play:after{background-position:0 -153px;opacity:0}
.desktop .media .swiper_wrap .btn_play:hover .ico_play,
.desktop .media .swiper_wrap .btn_play:hover .ico_play{transform: scale(1.05)}
.desktop .media .swiper_wrap .btn_play:hover .ico_play:before,
.desktop .media .swiper_wrap .btn_play:hover .ico_play:before{opacity:0}
.desktop .media .swiper_wrap .btn_play:hover .ico_play:after,
.desktop .media .swiper_wrap .btn_play:focus .ico_play:after{opacity:1}
/* Horizontal yellow lines */
.desktop .media .swiper_wrap .btn_play .line_h{position:absolute;top:0;left:0;width:100%;height:100%}
.desktop .media .swiper_wrap .btn_play .line_h:before,
.desktop .media .swiper_wrap .line_h:after{position:absolute;width:0;height:2px;background:url(../img/p/common/sp.png) 0 -523px no-repeat;-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);content:''}
.desktop .media .swiper_wrap .btn_play .line_h:before{top:0;left:0}
.desktop .media .swiper_wrap .btn_play .line_h:after{bottom:0;right:0;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}
.desktop .media .swiper_wrap .btn_play:hover .line_h:before,
.desktop .media .swiper_wrap .btn_play:hover .line_h:after,
.desktop .media .swiper_wrap .btn_play:focus .line_h:before,
.desktop .media .swiper_wrap .btn_play:focus .line_h:after{width:100%}
/* Vertical yellow lines */
.desktop .media .swiper_wrap .btn_play .line_v{position:absolute;top:0;left:0;width:100%;height:100%}
.desktop .media .swiper_wrap .btn_play .line_v:before,.desktop .media .swiper_wrap .line_v:after{position:absolute;width:2px;height:0;background:url(../img/p/common/sp.png) -187px -153px no-repeat;-webkit-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);-ms-transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);transition:all 0.8s cubic-bezier(0.075, 0.82, 0.165, 1);content:''}
.desktop .media .swiper_wrap .btn_play .line_v:before{top:0;left:0}
.desktop .media .swiper_wrap .btn_play .line_v:after{bottom:0;right:0;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}
.desktop .media .swiper_wrap .btn_play:hover .line_v:before,
.desktop .media .swiper_wrap .btn_play:hover .line_v:after,
.desktop .media .swiper_wrap .btn_play:focus .line_v:before,
.desktop .media .swiper_wrap .btn_play:focus .line_v:after{height:100%}

/* ******************************************************************************************************
 * pop-up
 ****************************************************************************************************** */
.desktop .dialog_wrapper{display:none;position:fixed;top:0;left:0;z-index:200;width:100%;height:100%;background:rgba(0,0,0,.8);text-align:center;white-space:nowrap;}
.desktop .dialog_wrapper:after{display:inline-block;width:0;height:100%;vertical-align:middle;content:''}
.desktop .dialog_wrapper .dialog{display:inline-block;position:relative;vertical-align:middle}
.desktop .dialog_wrapper .dialog img{display:block}
.desktop .dialog_wrapper .btn_close{position:absolute;top:17px;right:14px;width:140px;height:140px;background:url(about:blank)}
.desktop .dialog_wrapper .dialog_video{padding:10px;border:1px solid #fff}
.desktop .dialog_wrapper .dialog_video iframe{width:970px;height:614px;box-shadow:0 5px 10px rgba(0,0,0,0.8);background: #000;}
.desktop .dialog_wrapper .dialog_video .btn_close{top:0;right:0;width:80px;height:80px;margin-right:-80px}
.desktop .dialog_wrapper .dialog_video .btn_close:after{display:inline-block;width:36px;height:36px;background:url(../img/p/common/sp.png)0 -529px no-repeat;content:''}