@font-face {
        font-family: 'Spoqa Han Sans';
        font-weight: 600;
        src : url('https://img.childy.kr/font/Spoqa Han Sans Bold.woff2') format('woff2'),
                url('https://img.childy.kr/font/Spoqa Han Sans Bold.woff') format('woff');
    }
    @font-face {
        font-family: 'Spoqa Han Sans';
        font-weight: 400;
        src : url('https://img.childy.kr/font/Spoqa Han Sans Regular.woff2') format('woff2'),
                url('https://img.childy.kr/font/Spoqa Han Sans Regular.woff') format('woff');
    }
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,header,nav,aside,section,article,footer
{ margin:0;  padding:0;}
table {border-collapse:collapse; border-spacing:0;}
input,select { vertical-align:top; padding:0;}
fieldset,img {border:0; vertical-align:top;}
address,caption,cite,code,dfn,var {font-style:normal; font-weight:normal; }
ol,ul {list-style: none; }
caption,th { text-align:left;}
h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight:normal;}
q:before,q:after {content:"";}
a{outline:1;   text-decoration:none; color:#666;}
em { font-style:normal; }
body {margin:0; font-size:12px; font-family:'Spoqa Han Sans', 'Sans-serif';letter-spacing:-0.3px; color:#000; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-font-smoothing:subpixel-antialiased; line-height:1.5;font-weight:400;overflow-x:hidden;max-width:480px;margin:0 auto !important;}

.ready {position:absolute;width:100%;height:100%;animation:fadeOut 0.5s forwards;animation-delay:2s;z-index:10;opacity:1;max-width: 480px;background:#1863a5;}
.ready img {display:block;position:absolute;top:50%;transform:translateY(-50%);width:100%;vertical-align:top;margin:0 auto;}
.nav {position:fixed;bottom:-68px;width:100%;height:68px;line-height:68px;}
.nav ul {overflow:hidden;}
.nav ul li {float:left;width:20%;height:68px;cursor: pointer;text-align:center;}
.hold {width:100%;height:100%;position:fixed;top:0px;left:0px;z-index:99;overflow:hidden;}
.nav ul li {display:flex;justify-content:center;align-items:center;}
.nav ul li a {font-size:0;text-indent:-999px;}
.nav ul li .call_goods_list {width:28px;height:28px;background:url(https://img.childy.kr/img/showcase/goods.svg) no-repeat;background-size:28px;margin-right:5px;}
.nav ul li .call_memo {width:28px;height:28px;background:url(https://img.childy.kr/img/showcase/memo.svg) no-repeat;background-size:28px;margin-right:18px;}
.nav ul li .play_music {width:24px;height:24px;background:url(https://img.childy.kr/img/showcase/music-on.gif) no-repeat;background-size:24px;margin-left:9px;}
.nav ul li .play_music.on {background:url(https://img.childy.kr/img/showcase/music-off.png) no-repeat;background-size:24px;}

/* 210503 bgm 자동 재생으로 아이콘 변경
.nav ul li .play_music {width:24px;height:24px;background:url(https://img.childy.kr/img/showcase/music-off.png) no-repeat;background-size:24px;margin-left:9px;}
.nav ul li .play_music.on {background:url(https://img.childy.kr/img/showcase/music-on.gif) no-repeat;background-size:24px;}
*/

.header_cu_top {position:fixed;top:-54px;width:100%;height:54px;line-height:54px;}
.header_cu_top ul {overflow:hidden;}
.header_cu_top ul li {float:left;height:54px;cursor: pointer;text-align:center;display: flex; align-items: center;}
.header_cu_top ul li a {display:block;font-size:0;text-indent:-999px;}
.header_cu_top ul li:nth-child(1) {width:70%;}
.header_cu_top ul li:nth-child(2) {width:15%;}
.header_cu_top ul li:nth-child(3) {width:15%;}

.header_cu_top ul li .call_share {width:24px;height:24px;background:url(https://img.childy.kr/img/showcase/share.svg) no-repeat;background-size:24px;margin-left:18px;}
.header_cu_top ul li .home {width:24px;height:24px;background:url(https://img.childy.kr/img/showcase/home.svg) no-repeat;background-size:24px;margin-left:26px;}
.header_cu_top ul li .back {width:24px;height:24px;background:url(https://img.childy.kr/img/showcase/back.svg) no-repeat;background-size:24px;margin-left: 18px;}

.section {text-align:center;font-size: 3em;width:100%;height:100%;overflow:hidden;}

.section1 {background:#fff;}

.scene-1-0 {position:relative;top:0px;left:0px;width:100%;height:100%;background:#000;}
.scene-1-0:after {content:'';display:block;position:fixed;top:100%;width:100%;height:0%;background:#fff;z-index: 2;}
.scene-1-0 strong.black {position:absolute;display:block;top:50%;left:50%;transform: translate3d(-50%, -50%, 0);font-size: 26px;background:url(https://img.childy.kr/img/showcase/logo_off.png) no-repeat;background-size:120px;width:120px;height:84px;}
.scene-1-0 strong.white {position:absolute;display:block;top:50%;left:50%;transform: translate3d(-50%, -50%, 0);font-size: 26px;background:url(https://img.childy.kr/img/showcase/logo_on.png) no-repeat;background-size:120px;width:120px;height:84px;}
.scene-1-1 {width:100%;}
.scene-1-1 .a:after {content:'';display:block;position:absolute;top:0;right:0px;background:#fff;width:1px;height:0px;}
.scene-1-1 .a {overflow:hidden;background:#000;width:50%;height:100%;position:absolute;left:0;top:0px;opacity:0;}

.scene-1-1 .b {overflow:hidden;background:#000;width:50%;height:100%;position:absolute;right:0;top:0px;opacity:0;}
.scene-1-1 .b:after {content:'';display:block;position:absolute;top:0px;left:0px;background:#fff;width:1px;height:0px;}

.scene-1-2 {position:absolute;top:0px;width:100%;height:100%;opacity:0;background:#fff;}
.scene-1-2 .bg_scene-1-2 {position:absolute;overflow:hidden;width:100%;height:100%;top:0px;display:flex;justify-content: center;align-items: center;}
.scene-1-2 .bg_scene-1-2 img {width: 100%;/*position: relative;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0) scale(1) rotate(.001deg);height: auto;
display: block;*/transform:scale(1) rotate(.001deg);}
.scene-1-3 {font-size: 14px;position: absolute;top: 110px; width: calc(100% - 32px);margin: 0 16px;color: #fff;z-index: 2; font-weight: 600}

.slide .video_box video {position:relative;top:0px;left:50%;transform:translateX(-50%);z-index:3;border:1px solid rgba(0,0,0,0.1);box-sizing: border-box;}
.slide .video_box {overflow:hidden;position:relative;top:0px;width:100%;height:100%;}
.video_box .logoimg {width:70px;height:49px;display:block;position:absolute;z-index:4;bottom:68px;left:50%;transform:translateX(-50%);}
.video_box .logoimg2 {width:70px;height:49px;display:block;position:absolute;z-index:4;bottom:68px;left:50%;transform:translateX(-50%);}
#cuvideo1, #cuvideo2 {position: absolute;top: 0;left: 50%;transform: translateX(-50%);z-index:2;}


.fp-controlArrow {display:none;}

.pop_memo, .pop_goods_list {width:100%;height:100%;position:fixed;top:0px;left:100%;transition:all 0.5s;background:#fff;z-index:9999;}
.pop_memo.on, .pop_goods_list.on {width:100%;left:0px;transition:all 0.5s;}

.inp_txt_memo {background: #fff;width: 100%;height: 56px;position: fixed;bottom: 0px;border-top: 1px solid #f1f1f1;z-index:99999;}
.box_event {width:100%;height:calc(100% - 112px);overflow-y: scroll;background: beige;position:absolute;top:0px;}
.box_memo {background: #fff;width: 100%;height: 56px;position: fixed;bottom:56px;border-top: 1px solid #f1f1f1;transition:all 0.5s;z-index:99999}
.box_memo.on {height:calc(100% - 56px);transition:all 0.5s;}

/* 메모 */
.box_memo .head_memo {cursor:pointer;width:100%;height:56px;position:absolute;top:0px;line-height:56px;background:url(https://img.childy.kr/img/showcase/cu_arr_01.svg) no-repeat right 16px top 16px;background-size:20px;border-bottom: 1px solid #f1f1f1;}
.box_memo.on .head_memo {background:url(https://img.childy.kr/img/showcase/cu_arr_02.svg) no-repeat right 16px top 16px;background-size:20px;}
.head_memo > p {font-size: 15px;font-weight: 600;color: #333;padding-left:16px;}
.head_memo > p span {color:#1863a5;padding-left:4px;display:inline-block;}
.close_memo {display: none;position:fixed;top:20px;right:20px;width:40px;height:20px;}
.wrap_memo {position:absolute;top:56px;width:100%;height:calc(100% - 56px);overflow-y: scroll;}
.wrap_memo .list_memo li {position:relative;padding: 24px 16px;border-bottom: 1px solid #f1f1f1;letter-spacing:-0.3px;font-size:14px;color:#333;}
.wrap_memo .list_memo li strong {}
.wrap_memo .list_memo li p {line-height:22px;margin-top:10px;}
.wrap_memo .list_memo li span {display:inline-block;margin-top:8px;font-size:12px;color:#979797;}
.wrap_memo .list_memo li a {position:absolute;top:24px;right:16px;font-size:14px;color:#979797;}
.inp_txt_memo {overflow: hidden;}
.inp_txt_memo input {padding:18px 0 18px 16px;font-size:16px;width:calc(100% - 92px);height: 56px;border: none;box-sizing: border-box;float:left;}
.inp_txt_memo input::placeholder {color:#979797;}
.inp_txt_memo button {border:none;background:#1863a5;width:60px;height:38px;border-radius:2px;color:#fff;line-height:38px;box-sizing: border-box;text-align: center;font-size:14px;float:right;margin:8px 16px 8px 0;}

.close_memo {display:none;position:fixed;width:24px;height:24px;text-indent:-999px;font-size:0px;background:url(https://img.childy.kr/img/showcase/ico_close_cu.svg) no-repeat;top:16px;right:16px;}
.pop_memo.on .close_memo {display:block;}

.section2 div, .section3 div {position:absolute;overflow:hidden;width:100%;height:100%;}
.section2 div img {height: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0) scale(1.2) rotate(.001deg);}
.section3 div .bg {height: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0) scale(1.2)}
.section2 .box_txt, .section3 .box_txt {position: absolute;width: calc(100% - 32px);margin: 0 16px;font-size: 14px;color: #fff;opacity: 0;top: 110px; font-weight: 600}

.section3:after {content: '';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.4);width: 100%;height: 100%;z-index:4;}   
.section3 .box_txt {top:50%;transform:translateY(-50%);z-index:5;}


.section4 {overflow: hidden;}
.section4:after {content: '';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.2);width: 100%;height: 100%;z-index:2;}
.section5 {overflow:hidden;}
.section5 div {width: 100%;height: 100%;overflow: hidden;}
.section5 div > img {width: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0) scale(1.5);z-index:1;}
.section5 p {position:absolute;top:50%;left:50%;transform:translate3d(-50%, -50%, 0);}
.section5 .first-txt {opacity:1;width:120px;height:84px;margin:0 auto;z-index:2;}
.section5 .first-txt img {width:100%;}
.section5 .second-txt {opacity:0;width:calc(100% - 32px);margin:0 auto;color:#fff;font-size: 20px;z-index: 2;font-weight: 600;letter-spacing: 4px;}
.section5 .second-txt img {width:320px;}

.section6:after {content: '';display: block;position: fixed;left: 0;background: linear-gradient(to top, rgba(0,0,0,0.2), rgba(0,0,0,0));width: 100%;height: 100%;z-index:2;}
.section6 .box_slide {overflow:hidden;width:100%;height:100%;}
.section6 .img_slide {overflow:hidden;}
.section6 .img_slide li {float:left;width:20%;height:100%;overflow:hidden;}
.section6 .img_slide li img {display:block;vertical-align:top;font-size:0;position: relative;left: 50%;transform: translateX(-50%);width:100%;}
.section6 .img_slide li:nth-child(1) {left:0;}
.section6 .img_slide li:nth-child(2) {left:100%;}
.section6 .img_slide li:nth-child(3) {left:200%;}
.section6 .img_slide li:nth-child(4) {left:300%;}
.section6 .img_slide li:nth-child(5) {left:400%;}

.section6 .box_txt {width: calc(100% - 32px);font-size: 16px; position: absolute;bottom:128px;z-index: 4;margin: 0 16px;z-index:3;}
.section6 .box_txt p {opacity:0;font-size:14px;color:#fff;font-weight:600;text-align: left;padding-left: 12px;}
.section6.on .box_txt p:nth-child(1) {margin:0px;}
.section6.on .box_txt p:nth-child(2) {}
.section6.on .box_txt p:nth-child(3) {}

.section7 {background:#000;}
.section7 img {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:calc(100% - 100px);max-width:274px;}

.section7 {background:url(https://img.childy.kr/img/showcase/bg_scene7.jpg) no-repeat;background-size:cover;}

.section8:after {content: '';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.2);width: 100%;height: 100%;z-index:2;}
.section9 .box_slide {overflow:hidden;width:100%;height:100%;}
.section9 .img_slide2 {overflow:hidden;}
.section9 .img_slide2 li {float:left;width:20%;height:100%;overflow:hidden;}
.section9 .img_slide2 li img {width:100%;display:block;vertical-align:top;font-size:0;position: relative;left: 50%;transform: translateX(-50%);}
.section9 .img_slide2 li:nth-child(1) {left:0;}
.section9 .img_slide2 li:nth-child(2) {left:100%;}
.section9 .img_slide2 li:nth-child(3) {left:200%;}
.section9 .img_slide2 li:nth-child(4) {left:300%;}
.section9 .img_slide2 li:nth-child(5) {left:400%;}
.section9:after {content: '';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.2);width: 100%;height: 100%;z-index:2;}
.section9 .box_txt {width: calc(100% - 32px);position: absolute;top: 48%;z-index: 4;margin: 0 16px;}
.section9 .box_txt p {opacity:1;font-size: 20px;color: #fff;letter-spacing: 0;font-weight: 600;}

.section10:after {content:'';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.2);width: 100%;height: 100%;z-index:2;}
.section10 .bg_scene {width: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);z-index: 2;}
.section10 a {display:block;width:315px;height:503px;position:absolute;top:50%;left:50%;transform: translate3d(-50%, -50%, 0);z-index:3;}
.section10 a img {width:100%;}

.section11:after {content:'';display: block;position: fixed;left: 0;background: rgba(0,0,0,0.2);width: 100%;height: 100%;z-index:2;}
.section11 .bg_scene {width: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);z-index: 2;}
.section11 a {display:block;width:315px;height:503px;position:absolute;top:50%;left:50%;transform: translate3d(-50%, -50%, 0);z-index:3;}
.section11 a img {width:100%;}

.section10, .section11 {}

/*상품*/
.head_cu_back {position:fixed;top:0px;height:56px;width:100%;border-bottom:1px solid #f1f1f1;}
.pop_goods_list .close_goods {display:none;position:fixed;width:24px;height:24px;text-indent:-999px;font-size:0px;background:url(https://img.childy.kr/img/showcase/ico_close_cu2.svg) no-repeat;top:16px;right:16px;}
.pop_goods_list.on .close_goods {display:block;}
.list_goods_sh {overflow-y:scroll;clear:both;width:100%;height:calc(100% - 56px);position:fixed;top:56px;padding-top:24px;}
.list_goods_sh li {float: left;width: calc(50% - 16px);margin:0 8px;min-height:360px;}
.list_goods_sh li a {display: block;overflow: hidden;}
.list_goods_sh li a .sh_goods_img {height: 196px;position: relative;overflow: hidden;border-radius: 4px;}
.list_goods_sh li a .sh_goods_img img {width: 100%;position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);}
.list_goods_sh li a .sh_goods_desc {color: #333;letter-spacing:-0.3px;}
.list_goods_sh li a .sh_goods_desc strong {font-size: 11px;margin-top: 10px;display: block;}
.list_goods_sh li a .sh_goods_desc p {font-size: 13px;color: #979797;margin-top: 2px;line-height: 18px;}
.list_goods_sh li a .sh_goods_desc .desc_price {overflow:hidden;}
.list_goods_sh li a .sh_goods_desc .desc_price del {display:block;font-size:13px;color:#979797;margin-top:4px;}
.list_goods_sh li a .sh_goods_desc .desc_price .sale {float:left;font-size:15px;color:#e03830;font-weight:600;margin-right:4px;margin-top:4px;line-height:17px;}
.list_goods_sh li a .sh_goods_desc .desc_price .price {float:left;font-size:15px;color:#333;font-weight:600;margin-top:4px;line-height:17px;}
.list_goods_sh li a .sh_goods_desc .desc_badge img {margin-top: 8px;margin-right: 2px;height: 18px;}

.pop_share {width:100%;height: 100%;position:fixed;bottom:-100%;left:0px;z-index:99999;background:rgba(0,0,0,0.5);}
.pop_share.on {bottom:0px;}
.pop_share .box_share{width:100%;height:234px;position:absolute;bottom:0px;z-index:999999;background:#fff;}
.pop_share .box_share .close_share {width:20px;height:20px;position:absolute;top:20px;right:20px;background:url(https://img.childy.kr/img/showcase/ico_close_cu2.svg) no-repeat;background-size:20px;text-indent:-999px;font-size:0px;}
.pop_share .box_share p {text-align:center;font-size:16px;font-weight:600;padding-top:20px;}
.pop_share .box_share ul {overflow:hidden;width:172px;height:86px;margin:52px auto 0 auto;}
.pop_share .box_share ul li {width:60px;float:left;}
.pop_share .box_share ul li:nth-child(1) {margin-right:52px;}
.pop_share .box_share ul li:nth-child(1) a {padding-top:68px;background:url(https://img.childy.kr/img/showcase/kakao.svg) no-repeat top center;background-size:60px;text-align: center;display: block;width: 100%;height: 100%;}
.pop_share .box_share ul li:nth-child(2) a {padding-top:68px;background:url(https://img.childy.kr/img/showcase/url.svg) no-repeat top center;background-size:60px;text-align: center;display: block;width: 100%;height: 100%;}


/* 애니메이션 타이밍 */
.scene-1-0 {animation:fadeOut 1s forwards;animation-delay:8s;z-index:3;}
.scene-1-0:after {animation:curtain 2s ease forwards;animation-delay:3s;}
.scene-1-0 strong.black {animation:shortCut 2s forwards;animation-delay:3s;z-index:3;}
.scene-1-0 strong.white {animation:shortCut2 2s forwards;animation-delay:3s;z-index:4;}
.scene-1-1 .a {animation:moveLB 4s forwards;animation-delay:5s;z-index:6;} 
.scene-1-1 .b {animation:moveRB 4s forwards;animation-delay:5s;z-index:6;} 
.scene-1-1 .a:after {animation:line-1 1s forwards;animation-delay: 6s;}
.scene-1-1 .b:after {animation:line-1 1s forwards;animation-delay: 6s;}

.scene-1-2 {animation:fadeIn 1s forwards;animation-delay:8s;z-index:4;} 
.scene-1-2 div img {animation:zoomIn1 25s forwards;animation-delay:7s;}   

.scene-1-3 {animation:txtUp 1s forwards;animation-delay:9s;opacity:0;}
.nav {animation:navUp 1s forwards; animation-delay:9s;z-index:999;}
.header_cu_top {animation:topDown 1s forwards; animation-delay:9s;z-index:999;}

.section2.on div img{animation:zoomIn2 25s forwards;} /*, .section3.on div img */
.section2 .box_txt, .section3 .box_txt {opacity:0;z-index:5;}
.section2.on .box_txt, .section3.on .box_txt {animation:txtUp 2s forwards;}
.section3.on .box_txt {font-weight:600;}

.section3.on div .bg  {z-index:2;animation:zoomIn2 25s forwards;}

.section6.on .box_txt p:nth-child(1) {animation:txtUp 0.6s forwards;}
.section6.on .box_txt p:nth-child(2) {animation:txtUp 0.6s forwards;animation-delay:2s;}
.section6.on .box_txt p:nth-child(3) {animation:txtUp 0.6s forwards;animation-delay:4s;}


.section5.on .first-txt {animation:fadeOut 1s forwards;animation-delay:0.5s;}
.section5.on .second-txt {animation:fadeIn 0.5s forwards;animation-delay:1s;}

@keyframes shortCut2 {0%{z-index:4;}15%{z-index:3;}40%{z-index:3;}55%{z-index:4;}100%{z-index:4;}}
@keyframes shortCut {0%{z-index:3;}15%{z-index:4;}40%{z-index:4;}55%{z-index:3;}100%{z-index:3;}}
@keyframes colorChange1 {0%{background:#000;}100%{background:#fff;}}
@keyframes fadeIn {0%{opacity:0;}100%{opacity:1;}}
@keyframes fadeOut {0%{opacity:1;}100%{opacity:0;}}
@keyframes curtain {0%{top:100%;height:0%;}20%{top:0%;height:100%;}40%{top:0%;height:100%;}60%{top:100%;height:0%;}100%{top:100%;height:0%;}}
@keyframes navUp {0%{bottom:-54px;}100%{bottom:0px;}}
@keyframes topDown {0%{top:-54px;}100%{top:0px;}}
@keyframes line-1 {0% {height:0%;}100% {height:100%;}}
@keyframes moveL {0% {left:115%;}100% {left:100%;}}
@keyframes moveR {0% {right:115%;}100% {right:100%;}}
@keyframes moveLB {0% {opacity:0;}25%{opacity:1;}85% {width:50%;opacity:1;} 100% {width:0%;opacity:1;}}
@keyframes moveRB {0% {opacity:0;}25%{opacity:1;}85% {width:50%;opacity:1;}100% {width:0%;opacity:1;}}
@keyframes moveTL {0%{left:-100%;}100%{left:140%;}}
@keyframes zoomIn {0%{transform:translate3d(-50%, -50%, 0) scale(1) rotate(.001deg);}100%{transform:translate3d(-50%, -50%, 0) scale(1.3) rotate(.001deg);}}
@keyframes zoomIn2 {0%{transform:translate3d(-50%, -50%, 0) scale(1.2) rotate(.001deg);}100%{transform:translate3d(-50%, -50%, 0) scale(1.5) rotate(.001deg);}}
@keyframes zoomIn1 {0%{transform:scale(1) rotate(.001deg);}100%{transform:scale(1.3) rotate(.001deg);}}
@keyframes cursor{0%{border-right: 1px solid #fff} 50%{border-right: 1px solid #000} 100%{border-right: 1px solid #fff} }
@keyframes imgSlide1 {0%{background-position: 0% center}100%{background-position: 62% center}}
@keyframes txtUp {0%{opacity:0;}100%{opacity:1;}}