
#body[menu-size="tm"] .mobile-iframe-srcoll-x {overflow-x:scroll;overflow-y:hidden;-webkit-overflow-scrolling:touch;}
#body[menu-size="tm"] .mobile-iframe-srcoll-y {overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch;}

#body[menu-size="tm"] #bottom_box_wrapper {position:absolute;left:0px;bottom:0px;width:100%;height:2.5rem;z-index:100;}
#body[menu-size="tm"] #bottom_box {width:100%;height:100%;}

.bottom {background-color:#2f2f2f;}

#body[menu-size="tm"] .bottom {width:100%;overflow:hidden;}
#body[menu-size="tm"] .paging {color:#2f2f2f;text-align:center;cursor:default;background-color:#ffffff;border:none;user-select:none;-ms-user-select:none;}
#body[menu-size="tm"] .btn {opacity:1;cursor:pointer;}
#body[menu-size="tm"] .btn:active {opacity:0.30;}

#body[menu-size="tm"] .disabled {opacity:0.3;cursor:default;}
#body[menu-size="tm"] .btn.disabled:active {opacity:0.3;}

/* paging */
#body[menu-size="tm"] #bottom_box_wrapper .btn {width:2.5rem;height:2.5rem;background-size:contain;background-repeat:no-repeat;background-position:center;}
#body[menu-size="tm"] .btn.page-index {position:absolute;top:0px;left:0.2rem;background-image:url("../imgs/mobile/list_icon.png");}
#body[menu-size="tm"] .btn.page-prev {background-image:url("../imgs/mobile/prev.svg");}
#body[menu-size="tm"] .paging {width:6rem;height:1.6rem;line-height:1.6rem;border-radius:0.1rem;}
#body[menu-size="tm"] .btn.page-next {background-image:url("../imgs/mobile/next.svg");}
#body[menu-size="tm"] .btn.kakao {position:absolute;top:0px;right:2.7rem;background-image:url("../imgs/mobile/kakao.svg");}
#body[menu-size="tm"] .btn.facebook {position:absolute;top:0px;right:0.2rem;background-image:url("../imgs/mobile/facebook.svg");}

#body[menu-size="tm"] .popup-frame {border-radius:0px;}
#body[menu-size="tm"] .popup-head {height:2.5rem;border-radius:0px;}
#body[menu-size="tm"] .popup-head > .icon {float:left;height:100%;}
#body[menu-size="tm"] .popup-head > .title {float:left;margin-left:0.5rem;height:100%;font-size:1.2rem;line-height:2.5rem;color:#ffffff;}
#body[menu-size="tm"] .popup-head > .close {float:right;width:2.5rem;height:2.5rem;background-image:url("../imgs/mobile/close.svg");background-size:contain;background-repeat:no-repeat;background-position:center;cursor:pointer;}

/*#body[menu-size="tm"] .popup-body {border-radius:0px 0px 8px 8px;}*/
#body[menu-size="tm"] .popup-body * {font-size:1rem;}
#body[menu-size="tm"] .popup-body .menu-name {margin-left:11px;}
#body[menu-size="tm"] .popup-body div[data-type="dropdown"] {margin-right:11px;}
#body[menu-size="tm"] .popup-body ul li {height:2.5rem;}
#body[menu-size="tm"] .popup-body ul li > span {line-height:2.5rem;}
#body[menu-size="tm"] div[data-type="dropdown"] {top:13px;width:7px;height:8px;background:url("../imgs/t0/dropdown_open.png") no-repeat center;}
#body[menu-size="tm"] .popup-body li[data-state="show"] div[data-type="dropdown"] {-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg);transform: rotate(90deg);transition:transform 0.2s;}
#body[menu-size="tm"] .popup-body li[data-state="hide"] div[data-type="dropdown"] {-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);transition:transform 0.2s;}

input[type="range"] {-webkit-appearance:none;width:100%;}
input[type="range"]:focus {outline:none;}
input[type="range"]::-webkit-slider-runnable-track {height:4px;}
input[type="range"]::-webkit-slider-thumb {margin-top:-8px;width:20px;height:20px;-webkit-appearance:none;border-radius:50%;background:#e7e7e7;cursor:pointer;}
input[type="range"]::-moz-range-thumb {border-radius:50%;background:#e7e7e7;cursor:pointer;}
input[type="range"]::-moz-range-progress {background:#ffae00;border-radius:10px;height:5px;}
input[type="range"]::-moz-range-track {height:5px;background:#ffffff;border-radius:10px;}
#body[menu-size="tm"] .size-range {position:absolute;top:1rem;right:5px;width:100px;border-radius:2px;}

/**/
/*#body[menu-size="tm"] .popup-body {font-size:1.2rem;}*/
/*#body[menu-size="tm"] .popup-body .menu-name {margin-left:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}*/
/*#body[menu-size="tm"] .popup-body div[data-type="dropdown"] {display:none;}*/
/*#body[menu-size="tm"] .popup-body ul li {padding:1px;line-height:2.5rem;}*/
/*#body[menu-size="tm"] .popup-body #sub_menu li {padding-left:2rem;padding-right:1rem;}*/
/*#body[menu-size="tm"] .popup-body ul > li > ul > li:first-child {border-top:solid 2px #c0c0c0;}*/
/*#body[menu-size="tm"] .popup-body ul > li > ul > li:last-child {border-bottom:solid 2px #c0c0c0;}*/

#body[menu-size="tm"] .paging-body {padding-top:1rem;overflow-x:hidden;overflow-y:auto;overflow-scrolling:touch;-webkit-overflow-scrolling:touch;box-sizing:border-box;}
#body[menu-size="tm"] .page-icon {float:left;margin:1rem;width:4rem;height:4rem;line-height:4rem;color:#2f2f2f;text-align:center;background-position:center;background-repeat:no-repeat;background-size:contain;}
#body[menu-size="tm"] .page-icon span {font-size:1.2rem;}
#body[menu-size="tm"] .page-icon.selected {background-color:#e6e6e6;}
#body[menu-size="tm"] .page-icon:active {opacity:0.30;}
#body[menu-size="tm"] .page-icon.page-first {background-image:url("../imgs/mobile/page_front.svg");}
#body[menu-size="tm"] .page-icon.page-last {background-image:url("../imgs/mobile/page_end.svg");}
#body[menu-size="tm"] .page-icon.page-count {background-image:url("../imgs/mobile/page_empty.svg");}

/* popup header */
.popup-head-fix {background-color:#2f2f2f;border-radius:11px 11px 0px 0px;}
#body[data-mobile="yes"] .popup-head-fix {position:relative;width:100%;height:45px;color:#ffffff;}
#body[data-mobile="yes"] .popup-head-fix * {font-size:16px;}
#body[data-mobile="yes"] .popup-head-fix > .icon-fix {float:left;width:45px;height:45px;}
#body[data-mobile="yes"] .popup-head-fix > .title-fix {float:left;height:100%;line-height:45px;}
#body[data-mobile="yes"] .popup-head-fix > .close {float:right;margin-right:15px;margin-top:14px;width:17px;height:17px;background:url("../imgs/t1/popup_close_nor.png") no-repeat center;cursor:pointer;}
#body[data-mobile="yes"] .popup-head-fix > .reload {float:right;margin-right:10px;margin-top:14px;width:21px;height:17px;background:url("../imgs/t1/popup_reload_nor.png") no-repeat center;cursor:pointer;}

#body[data-mobile="yes"] .full-popup-head {position:absolute;top:0px;left:0px;width:100%;height:2.5rem;background-color:#ffffff;box-shadow:0px 0px 5px 0px rgba(0,0,0,0.4);overflow:hidden;}
.mobile-btn-wrapper {position:relative;float:right;margin-top:0.25rem;width:2rem;height:2rem}
.mobile-btn-bg-color {position:absolute;top:1px;left:1px;width:23px;height:23px;background-color:#2f2f2f;}
#body[data-mobile="yes"] .full-popup-head .full-btn {position:absolute;top:0px;left:0px;margin:0px;padding:0px;width:2rem;height:2rem;cursor:pointer;background-position:center;background-repeat:no-repeat;background-size:contain;background-color:transparent;}
#body[data-mobile="yes"] .full-popup-head .full-btn:hover {opacity:1;}
#body[data-mobile="yes"] .full-popup-head .full-btn:active {opacity:1;}
#body[data-mobile="yes"] .full-popup-head .full-btn.close {background-image:url("../imgs/ui/popup/bookpage_close.png");}
#body[data-mobile="yes"] .full-popup-head .full-btn.refresh {background-image:url("../imgs/ui/popup/bookpage_retry.png");}
#body[data-mobile="yes"] .full-popup-head .full-btn.bookmark {}
#body[data-mobile="yes"] .full-popup-head .full-btn.bookmark.on {background-image:url("../imgs/ui/popup/bookmark_on.png");}
#body[data-mobile="yes"] .full-popup-head .full-btn.bookmark.off {background-image:url("../imgs/ui/popup/bookmark_off.png");}
#body[data-mobile="yes"] .full-popup-head .full-btn.bookmark .exist-bookmark {display:none;position:absolute;left:2px;top:4px;width:18px;height:18px;font-size:13px;line-height:18px;background-color:red;border-radius:50%;color:#ffffff;text-align:center;font-weight:bold;}
#body[data-mobile="yes"] .full-popup-head .full-btn.home {background-image:url("../imgs/ui/popup/bookpage_home.png");}

#body[data-mobile="yes"] .full-title {float:left;margin:0px 0px 0px 2rem;width:auto;height:2.5rem;font-size:1.5rem;text-align:left;line-height:1.5rem;box-sizing:border-box;} 
#body[data-mobile="yes"] .full-title > .icon-fix {float:left;width:2.5rem;height:2.5rem;background-repeat:no-repeat;background-position:center;background-size:contain;}
#body[data-mobile="yes"] .full-title > .title-fix {float:left;height:100%;}
#body[data-mobile="yes"] .book-content-top {float:left;margin:0.25rem 0px 0px 1rem;width:150px;height:2rem;font-size:1rem;color:#ffffff;text-align:left;line-height:2rem;background-color:#2f2f2f;box-sizing:border-box;cursor:pointer;}
#body[data-mobile="yes"] .book-content-top > div {padding:0px 5px 0px 7px;}
#body[data-mobile="yes"] .book-content-top > div:hover {background-color:rgba(255,255,255);}
#body[data-mobile="yes"] .book-content-top > div:active {background-color:rgba(255,255,255);}
#body[data-mobile="yes"] .book-content-top span {display:inline-block;max-width:135px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#body[data-mobile="yes"] .book-content-top .drop-down {float:right;margin-top:0.7rem;width:11px;height:11px;background:url('../imgs/ui/popup/group_open.png') no-repeat center;}
#body[data-mobile="yes"] .book-content-top .drop-down[data-op="show"] {-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg);transform: rotate(90deg);transition:transform 0.2s;}
#body[data-mobile="yes"] .book-content-top .drop-down[data-op="hide"] {-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);transition:transform 0.2s;}
#body[data-mobile="yes"] .book-content-top-next {float:left;margin:0.25rem 0px 0px 0.25rem;padding:0px 8px 0px 8px;width:200px;height:2rem;font-size:1rem;color:#2f2f2f;text-align:left;line-height:2rem;background-color:#ffffff;border:solid 1px #2f2f2f;box-sizing:border-box;}

#body[data-mobile="yes"] .book-content-navi {float:left;margin:0.25rem 0px 0px 1rem;width:auto;height:2rem;box-sizing:border-box;}
.mobile-navi-btn-wrapper {position:relative;float:left;margin-top:5px;width:10px;height:17px;}
.mobile-navi-btn-wrapper.l {float:left;}
.mobile-navi-btn-wrapper.r {margin-left:5px;}
.mobile-navi-btn-bg-color {position:absolute;top:1px;left:1px;width:8px;height:15px;background-color:#2f2f2f;}
.book-content-navi .mobile-navi-btn-wrapper .navi-btn {position:absolute;top:0px;left:0px;margin:0px;padding:0px;width:10px;height:17px;background-repeat:no-repeat;background-position:center;cursor:pointer;background-color:transparent;background-size:10px 17px;}
.book-content-navi .mobile-navi-btn-wrapper .navi-btn.left {background-image:url("../imgs/ui/popup/page_left.png");}
.book-content-navi .mobile-navi-btn-wrapper .navi-btn.right {background-image:url("../imgs/ui/popup/page_right.png");}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="left-end"] {opacity:0.3;cursor:default;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="left"] {opacity:1;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="left"]:hover {opacity:0.6;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="left"]:active {opacity:0.4;}
#body[data-mobile="yes"] .book-content-navi div.book-paging {float:left;margin-left:5px;width:60px;height:2rem;color:#2f2f2f;text-align:center;line-height:2rem;font-size:1rem;background-color:#ffffff;border:solid 1px #2f2f2f;box-sizing:border-box;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="right-end"] {opacity:0.3;cursor:default;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="right"] {opacity:1;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="right"]:hover {opacity:0.6;}
.book-content-navi .mobile-navi-btn-wrapper div[data-op="right"]:active {opacity:0.4;}

#body[data-mobile="yes"] .book-content-page {float:left;margin:0.25rem 0px 0px 1rem;width:80px;height:2rem;box-sizing:border-box;font-size:1rem;color:#2f2f2f;text-align:center;line-height:2rem;border:solid 1px #2f2f2f;}
#body[data-mobile="yes"] .book-content-head-btns {position:absolute;padding:0px;margin:0px;right:1rem;top:0px;width:75px;height:100%;}

#body[data-mobile="yes"] .book-content-body {position:absolute;padding:0px 0px 0px 0px;left:1rem;width:260px;font-size:1rem;overflow-x:hidden;overflow-y:visible;border-radius:3px;background-color:#ffffff;box-sizing:border-box;box-shadow:0px 0px 5px 0px rgba(0,0,0,0.4);transition:top 0.3s;-webkit-transition:top 0.3s;}
#body[data-mobile="yes"] .book-content-body ul {font-size:inherit;}
#body[data-mobile="yes"] .book-content-body li {height:2rem;font-size:inherit;color:#2f2f2f;text-align:left;background-color:#ffffff;box-sizing:border-box;cursor:pointer;}
#body[data-mobile="yes"] .book-content-body li.over {background-color:rgba(255,255,255,0.2);}
#body[data-mobile="yes"] .book-content-body li.down {background-color:rgba(255,255,255,0.4);}
#body[data-mobile="yes"] .book-content-body li.selected {background-color:rgba(255,255,255,0.4);}
#body[data-mobile="yes"] .book-content-body li span {display:inline-block;margin-left:5px;max-width:180px;overflow:hidden;line-height:2rem;text-overflow:ellipsis;white-space:nowrap;}
#body[data-mobile="yes"] .book-content-body li .drop-down {float:right;margin-right:5px;margin-top:0.7rem;width:11px;height:11px;background:url('../imgs/ui/popup/group_open_b.png') no-repeat center contain;}
#body[data-mobile="yes"] .book-content-body li[data-op="group_show"] .drop-down {-ms-transform: rotate(90deg);-webkit-transform: rotate(90deg);transform: rotate(90deg);transition:transform 0.2s;}
#body[data-mobile="yes"] .book-content-body li[data-op="group_hide"] .drop-down {-ms-transform: rotate(0deg);-webkit-transform: rotate(0deg);transform: rotate(0deg);transition:transform 0.2s;}
#body[data-mobile="yes"] .book-content-body ul > li > ul > li > span {margin-left:10px;max-width:200px;}
#body[data-mobile="yes"] .book-content-body li[data-root] {transition:height 0.3s;-webkit-transition:height 0.3s;}
#body[data-mobile="yes"] .book-content-body ul[data-pidx] {border-top:solid 1px #a3aeaf;border-bottom:solid 1px #a3aeaf;}
#body[data-mobile="yes"] .book-content-body ul[data-pidx][data-state="hide"] {border-top:none;border-bottom:none;}
#body[data-mobile="yes"] .book-content-body ul[data-pidx][data-state="show"] {border-top:solid 1px #a3aeaf;border-bottom:solid 1px #a3aeaf;}

#body[data-mobile="yes"] .full-popup-frame .title {position:absolute;top:10px;left:10px;cursor:pointer;line-height:45px;font-size:16px;color:#313131;}

#body[data-mobile="yes"] .full-popup-body {position:absolute;left:0px;margin:0px;padding:0px;width:100%;background-color:transparent;border:none;}


/* LEFT BOX - mobile은 submenu가 없다. */
#left_box {position:absolute;bottom:2.5rem;height:auto;box-sizing:border-box;box-shadow:0px 0px 5px 0px rgba(0,0,0,0.3);background-color:#ffffff;border-top-right-radius:0.5rem;border-bottom-right-radius:0.5rem;transition:left 0.3s, opacity 0.5s;transition-timing-function:ease-in-out;z-index:130;}
#left_box .menu-name {position:absolute;top:0px;}
#left_box > ul > li:last-child {border-bottom-right-radius:0.5rem;}
#left_box[menu-hide="n"] {left:0rem;opacity:1;}
#left_box[menu-hide="y"] {left:-12.5rem;opacity:0;}

/*******************************************************************************/
/* RIGHT BOX CSS START
/*******************************************************************************/
#body[menu-size="tm"] #left_box .top-menu {border-top-right-radius:0.5rem;}
#body[menu-size="tm"] #left_box ul {font-size:1rem;}
#body[menu-size="tm"] #left_box li {width:12rem;height:2.5rem;}
#body[menu-size="tm"] #left_box li:first-child {border-top-right-radius:0.5rem;}
#body[menu-size="tm"] #left_box .menu-name {height:2.5rem;line-height:2.5rem;}
#body[menu-size="tm"] .icon {width:2.5rem;height:2.5rem;background-size:contain;}
#body[menu-size="tm"] .icon.top {background-image:url("../imgs/t0/menu_open_nor.png");}
#body[menu-size="tm"] .icon.top:hover {background-image:url("../imgs/t0/menu_open_hover.png");}
#body[menu-size="tm"] .icon.top:active {background-image:url("../imgs/t0/menu_open_press.png");}
/* open state*/
#body[menu-size="tm"] #left_box[menu-hide="n"] .icon.top {background-image:url("../imgs/t0/menu_close_nor.png");}
#body[menu-size="tm"] #left_box[menu-hide="n"] .icon.top:hover {background-image:url("../imgs/t0/menu_close_hover.png");}
#body[menu-size="tm"] #left_box[menu-hide="n"] .icon.top:active {background-image:url("../imgs/t0/menu_close_press.png");}
/* content count */
#body[menu-size="tm"] .content-count {left:2px;top:3px;width:1rem;height:1rem;font-size:0.7rem;line-height:1rem;}
/*******************************************************************************/

#body[menu-size="tm"] .book-page-navi.img-middle.left {background-image:url('../../../book/img/book.pageNavi.middle/left.png');}
#body[menu-size="tm"] .book-page-navi.img-middle.left[data-op]:hover {background-image:url('../../../book/img/book.pageNavi.middle/left.png');}
#body[menu-size="tm"] .book-page-navi.img-middle.left.touch-start[data-op] {background-image:url('../../../book/img/book.pageNavi.middle/left_hover.png');}

#body[menu-size="tm"] .book-page-navi.img-middle.right {background-image:url('../../../book/img/book.pageNavi.middle/right.png');}
#body[menu-size="tm"] .book-page-navi.img-middle.right[data-op]:hover {background-image:url('../../../book/img/book.pageNavi.middle/right.png');}
#body[menu-size="tm"] .book-page-navi.img-middle.right.touch-start[data-op] {background-image:url('../../../book/img/book.pageNavi.middle/right_hover.png');}

#body[menu-size="tm"] .book-page-navi.img-bottom.left[data-op]:hover {background-image:url('../../../book/img/book.pageNavi.bottom/left.png');}
#body[menu-size="tm"] .book-page-navi.img-bottom.left.touch-start[data-op] {background-image:url('../../../book/img/book.pageNavi.bottom/left_hover.png');}

#body[menu-size="tm"] .book-page-navi.img-bottom.right[data-op]:hover {background-image:url('../../../book/img/book.pageNavi.bottom/right.png');}
#body[menu-size="tm"] .book-page-navi.img-bottom.right.touch-start[data-op] {background-image:url('../../../book/img/book.pageNavi.bottom/right_hover.png');}

/* URL COPY */
.popup-body.url-copy {padding:20px 12px 0px 20px;overflow:hidden;box-sizing:border-box;color:#2f2f2f;border-radius:0px 0px 11px 11px;}
.url-copy .wrapper {margin-top:7px;width:100%;height:30px;line-height:30px;background-color:#ffffff;}
.url-copy .wrapper .url-info {float:left;padding:0px 5px 0px 5px;width:506px;height:30px;border-radius:5px;border:solid 1px #d0d0d0;font-size:14px;}
.url-copy .wrapper .btn-url-copy {float:left;margin-left:10px;width:50px;height:30px;text-align:center;border:solid 1px #2f2f2f;font-size:17px;border-radius:4px;}
.url-copy .footer {margin:7px auto 0px auto;width:180px;height:24px;line-height:24px;text-align:center;border-radius:5px;background-color:#f0f0f0;}

/* dialog popup */
#body[menu-size="tm"] .dialog-frame .wrapper {padding:2rem 1.5rem 2rem 1.5rem;}
#body[menu-size="tm"] .dialog-frame .header {height:2rem;width:100%;}
#body[menu-size="tm"] .dialog-frame .header.info {background-image:url("../imgs/ui/popup/deco_alert.png");background-size:auto 2rem;background-position:center;background-repeat:no-repeat;}
#body[menu-size="tm"] .dialog-frame .header.error {background-image:url("../imgs/ui/popup/deco_alert.png");background-size:auto 2rem;background-position:center;background-repeat:no-repeat;}
#body[menu-size="tm"] .dialog-frame .header.warning {background-image:url("../imgs/ui/popup/deco_alert.png");background-size:auto 2rem;background-position:center;background-repeat:no-repeat;}
#body[menu-size="tm"] .dialog-frame .header.success {background-image:url("../imgs/ui/popup/deco_alert.png");background-size:auto 2rem;background-position:center;background-repeat:no-repeat;}

#body[menu-size="tm"] .dialog-frame .body {padding:1.5rem 0px 1.5rem 0px;font-size:1em;line-height:1.4em;}
#body[menu-size="tm"] .dialog-frame .body > table {width:100%;height:auto;word-wrap:break-word;word-break:break-all;white-space:pre-wrap;font-size:1em;line-height:1.4em;text-align:center;}
#body[menu-size="tm"] .dialog-frame .body > table tr td {margin:0px;padding:0px;border:none;}

#body[menu-size="tm"] .dialog-frame .footer {margin:0px auto 0px auto;height:2rem;box-sizing:border-box;}
#body[menu-size="tm"] .dialog-frame .footer .popup-btn {float:left;margin-left:auto;margin-right:auto;width:100%;height:100%;}
