﻿body,
.ui-page-theme-a {background-color:#f1f1f1 !important;}
.layer_not_scroll {position:fixed;overflow:hidden;width:100%;height:100%}

.swiper-wrapper {position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box;}
.swiper-container-android .swiper-slide,
.swiper-wrapper {-webkit-transform:translate3d(0px, 0, 0);transform:translate3d(0px, 0, 0);}
.swiper-container-multirow > .swiper-wrapper {-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;}
.swiper-container-free-mode > .swiper-wrapper {-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto;}
.swiper-slide {-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;/*width:100%;height:100%;*/position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform;}
.search-container {background:#dedede;}

#page-main {display:-webkit-box;-webkit-box-pack:center;}
#page-main .content-wrapper {width:100%;max-width:640px;}



.news-area {min-height:170px;}
.news-area a {display:block;font-weight:normal;}
.news-area span {display:inline-block;}
.news-area .title-panel {display:-webkit-box;-webkit-box-pack:justify;-webkit-box-align:center;border-bottom:1px solid #e4e4e4;margin:0 15px 10px 15px;padding:20px 0 6px 0;}
.news-area .title-panel span {font-size:18px;color:#111 !important;letter-spacing:-1px;}
.news-area .title-panel a {display:block;padding-left:13px;height:15px;line-height:15px;font-size:12px;color:#999 !important;letter-spacing:-1px;background:#fff url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/ico_bbs_more.png) 0 center / 13px 13px no-repeat;}
.news-area .notice-list a {display:-webkit-box;-webkit-box-pack:justify;-webkit-box-align:center;margin:0 15px;padding:6px 0;font-size:15px;letter-spacing:-1px;}
.news-area .notice-list a > div:first-child {-webkit-box-flex:1;overflow:hidden;text-overflow:ellipsis;word-break:break-all;white-space:nowrap;}
.news-area .notice-list .content-category {color:#0061ff !important;margin-right:5px;}
.news-area .notice-list .content-title {-webkit-box-flex:1;color:#222 !important;-webkit-font-smoothing:antialiased;overflow:hidden;text-overflow:ellipsis;word-break:break-all;white-space:nowrap;}
.news-area .notice-list .content-title.content-new {padding-left:18px;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/ico_new.png) 0 center / 13px 13px  no-repeat;}
.news-area .notice-list .content-writedate {font-size:14px;color:#888 !important;letter-spacing:0;margin-left:10px;}

.banner {position:relative;display:-webkit-box;-webkit-box-pack:center;background:#716490;}
.banner .banner-container {position:relative;overflow:hidden;z-index:1;width:100%;max-width:640px;padding-bottom:35px;}
.banner .swiper-button-next {position:absolute;width:32px;height:32px;left:5px;bottom:50%;z-index:3;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/main_swiper-next.png) 0 0 / 100% 100% no-repeat;}
.banner .swiper-button-prev {position:absolute;width:32px;height:32px;right:5px;bottom:50%;z-index:3;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/main_swiper-prev.png) 0 0 / 100% 100% no-repeat;}
.banner .banner-all-view {position:absolute;display:block;width:64px;height:22px;bottom:7px;right:13px;z-index:3;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/bnt_all_view.png) 0 0 / 100% 100% no-repeat;}
.banner .swiper-slide {position:relative;}
.banner .swiper-slide > a {position:relative;display:-webkit-box;-webkit-box-pack:center;}
.banner img {display:block;width:100%;height:100%;max-width:640px;}
.banner .swiper-slide .content-image {position:relative;width:100%;height:100%;left:0;top:0;background:#f1f1f1 url(https://ssl.nx.com/s2/game/baram/2016/banner/2016web/160922_dnjsej.jpg) no-repeat center 0;background-size:auto 100%;}
.banner .swiper-pagination {position:absolute;width:100%;bottom:0;padding:6px 0 3px 0;text-align:center;-webkit-transition:300ms;-webkit-transform:translate3d(0, 0, 0);z-index:2;background-color:rgba(0,0,0,.65);}
.banner .swiper-pagination-bullet {display:inline-block;width:10px;height:10px;margin:5px 1px 3px 1px;background-color:#ccc;border:2px solid rgba(0,0,0,.75);border-radius:50%;}
.banner .swiper-pagination-clickable .swiper-pagination-bullet {cursor:pointer;}
.banner .swiper-pagination-bullet-active {background-color:#ff6600;}

.event-layer {position:fixed;display:-webkit-box;-webkit-box-pack:center;left:0;top:0;width:100%;height:100%;z-index:50;background-color:rgba(0,0,0,.75);overflow-y:auto !important;}
.event-layer .layer-header {position:fixed;width:100%;height:52px;left:0;top:0;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;background-color:#fff;z-index:60;font-size:17px;color:#4d49c9;letter-spacing:-1px;}
.event-layer .btn-layer-close {position:fixed;display:block;width:30px;height:30px;right:15px;top:11px;z-index:61;font-size:1px;text-indent:-10000px;overflow:hidden;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/btn_layer_close.png) 0 0 / 100% 100% no-repeat;}
.event-layer .btn-back-close {position:fixed;display:block;left:0;top:0;width:100%;height:100%;background-color:transparent;}
.event-layer .layer-panel {position:relative;width:100%;max-width:640px;margin-top:52px;}

.event-layer-list {position:relative;display:block;}
.event-layer-list div {width:100%;left:0;top:0;background:#f1f1f1 url(https://ssl.nx.com/s2/game/baram/2016/banner/2016web/160922_dnjsej.jpg) no-repeat center 0;background-size:auto 100%;}
.event-layer-list img {display:block;width:100%;}

.mov-layer {position:fixed;display:-webkit-box;-webkit-box-pack:center;left:0;top:0;width:100%;height:100%;z-index:50;background-color:rgba(0,0,0,.85);overflow-y:auto !important;}
.mov-layer .layer-header {position:fixed;width:100%;height:52px;left:0;top:0;display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;background-color:#fff;z-index:70;font-size:17px;color:#4d49c9;letter-spacing:-1px;}
.mov-layer .btn-layer-close {position:fixed;display:block;width:30px;height:30px;right:15px;top:11px;z-index:71;font-size:1px;text-indent:-10000px;overflow:hidden;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/btn_layer_close.png) 0 0 / 100% 100% no-repeat;}
.mov-layer .btn-back-close {position:fixed;display:block;left:0;top:0;width:100%;height:100%;background-color:transparent;}
.mov-layer .ytb-panel {position:relative;width:100%;max-width:450px;text-align:center;}
.mov-layer .ytb-panel > div:first-child {position:relative;max-width:640px;background-color:#444;}
.mov-layer .ytb-panel > div:last-child {color:#999;font-size:13px;letter-spacing:-1px;padding:30px 40px;word-break:break-word;}
.mov-layer .ytb-panel img {display:block;width:100%;max-width:640px;}
.mov-layer .ytb-panel iframe {position:absolute;left:0;top:0;width:100%;height:100%;}

.text-banner-area {padding-top:15px;}
.text-banner-area a {position:relative;display:-webkit-box;background-color:#f1f1f1;font-weight:normal;margin:10px 15px;}
.text-banner-area img {display:block;width:100%;}
.text-banner-area .content-thumb {width:88px;margin-right:10px;}
.text-banner-area .title-panel {-webkit-box-flex:1;font-size:12px;display:-webkit-box;-webkit-box-orient:vertical;}
.text-banner-area .content-category {color:#0061ff !important;margin-top:12px;}
.text-banner-area .content-category.blue {color:#0061ff !important;}
.text-banner-area .content-category.purple {color:#9243f3 !important;}
.text-banner-area .content-title {color:#222 !important;margin-top:4px;font-size:15px;-webkit-box-flex:1;overflow:hidden;text-overflow:ellipsis;word-break:break-all;white-space:nowrap;margin-right:10px;letter-spacing:-1px;}
.text-banner-area .content-date {color:#888 !important;margin-bottom:10px;}
.text-banner-area .add {display:none;}

.text-list-bottom.text-list-nomore .text-banner-more,
.text-list-bottom.text-list-nomore .strok-12 {display:none;}
.text-list-bottom.text-list-nomore {height:5px;}

.text-banner-more {display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;margin-bottom:20px;}
.text-banner-more a {width:45px;padding-left:18px;height:20px;line-height:20px;margin:5px 0;font-size:14px;overflow:hidden;color:#424242 !important;background:#fff url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/ico_more.png) 0 0 / 20px 40px no-repeat;}

.tales-story-area {min-height:370px;}
.tales-story-area a {display:block;font-weight:normal;}
.tales-story-area span {display:inline-block;}
.tales-story-area .title-panel {display:-webkit-box;-webkit-box-pack:justify;-webkit-box-align:center;margin:0 15px 10px 15px;padding:25px 0 6px 0;}
.tales-story-area .title-panel span {font-size:18px;color:#111 !important;letter-spacing:-1px;}
.tales-story-area .title-panel a {display:block;padding-left:13px;height:15px;line-height:15px;font-size:12px;color:#999 !important;letter-spacing:-1px;background:#fff url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/main/ico_bbs_more.png) 0 center / 13px 13px no-repeat;}

.story-container {overflow:hidden;margin-left:12px;}
.story-container a {position:relative;display:block;width:200px;height:280px;margin:0 5px;}
.story-container .swiper-slide:first-child a {margin-left:3px;}
.story-container .swiper-slide:last-child a {margin-right:15px;}
.story-container a img {display:block;width:100%;}
.story-container .cover {position:absolute;display:block;top:0;left:0;right:0;width:100%;height:100%;height:100%;background: url(https://ssl.nx.com/s2/game/tales/renewal_2018/main/bg_cover_story.png) 100% 100% no-repeat;}
.story-container .icon {background: url(https://ssl.nx.com/s2/game/tales/renewal_2018/main/spr_icon.png) no-repeat;}
.story-container .story4 .icon {position:absolute;display:block;bottom:0;right:8.57%;width:51px;height:51px;border:2px solid #fff;border-color:rgba(255,255,255,0.2);margin-bottom:8.57%}
.story-container .story4.gallery .icon {background-position:-222px -141px}
.story-container .story4.cartoon .icon {background-position:-285px -141px}
.story-container .story4.play .icon {background-position:-349px -141px}
.story-container .story4.music .icon {background-position:-158px -141px}
.story-container .title {position:absolute;left:15px;right:15px;top:71.84%}
.story-container .title span {display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-all;-webkit-line-clamp:2;}
.story-container .story1 {background:#f1f1f1;}
.story-container .story1 .title {color:#9e51ff !important;letter-spacing:-1px;font-weight:normal;}
.story-container .story1 .img {position:absolute;display:block;overflow:hidden;top:11%;left:50%;width:74.3%;height:53.3%;max-width:180px;margin-left:-37.14%;border-radius:50%;}
.story-container .story2 .img {position:relative;display:block;overflow:hidden;height:68%;}
.story-container .story2 .title {left:0;right:0;color:#222 !important;}
.story-container .story2 .title .subscript{margin-right:25px}
.story-container .story3 .headline {color:#fff !important;}
.story-container .headline {height:39px;font-size:15px;}
.story-container .subscript {height:26px;font-size:11px;line-height:1.25;font-weight:lighter;color:#999 !important;}

/*Footer*/
.footer {padding:15px 15px 30px 15px;background-color:#fff;border-top:1px solid #e4e4e4;}
.footer > div {display:-webkit-box;-webkit-box-pack:center;-webkit-box-align:center;height:20px;}
.footer .footer-global a {display:-webkit-box;-webkit-box-align:center;color:#555 !important;font-weight:normal;font-size:12px;}
.footer span {display:block;width:1px;height:8px;margin:0 8px;background-color:#bbb;font-size:0;text-indent:-100000px;overflow:hidden;}
.footer .copyright {display:-webkit-box;-webkit-box-align:center;height:15px;color:#888;font-weight:normal;font-size:10px;}

.footer .sns-group {display:-webkit-box;-webkit-box-pack:center;height:35px;margin-bottom:15px;}
.footer .sns-group a {display:block;overflow:hidden;font-size:1px;text-indent:-10000px;width:35px;height:35px;margin:0 5px;background:url(https://ssl.nx.com/S2/Game/Tales/renewal_2018/mobile/sub/ico_sns.png) 0 0 / 105px 35px no-repeat;}
.footer .kakaotalk {background-position-x:0px !important;margin-left:20px !important;}
.footer .facebook {background-position-x:-35px !important;}
.footer .twitter {background-position-x:-70px !important;}