@charset "utf-8";
/* -----------------------------------------------
	* 사이트 전체 기본 스타일 정의
--------------------------------------------------
	- 최초 작성일 :2021.08.15
	- 최초 작성자 :아보카도
	- 최종 수정일 :
	- 최종 수정자 :
--------------------------------------------------*/


/*********************************
	기본 스타일
**********************************/

html,
body {height: 100%;}
body  {line-height: 1.5;}
caption {display:none;}
html.single:before {content:""; display:block; position:fixed; top:0; left:0; right:0; bottom:0; z-index:-1;}

::selection {
    background-color: #3038D6 !important;
    color: #FFFFFF !important;
}


/*********************************
	폼 요소 스타일
**********************************/
*::placeholder {color: gray;}

button.window_button {
    height: 23px;
    background-color: transparent;
    border: none;
    font-size: 12px;
    line-height: 1.5;
    box-shadow: inset -1px -1px #0A0A0A, inset 1px 1px #DFDFDF, inset -2px -2px grey, inset 2px 2px #FFFFFF;
}
button.window_button:active {box-shadow: inset -1px -1px #FFFFFF, inset 1px 1px #0A0A0A, inset -2px -2px #DFDFDF, inset 2px 2px #808080;}
button.disable:active {box-shadow: inset -1px -1px #0A0A0A, inset 1px 1px #DFDFDF, inset -2px -2px grey, inset 2px 2px #FFFFFF;}
button.window_button:focus,
input[type="submit"]:focus {
    outline: 1px dotted #333333;
    outline-offset: -4px;
}
button.disable {
    color: #5F5F5F;
    text-shadow: 1px 1px 0 #FFFFFF;
    box-shadow: inset -1px -1px #0A0A0A, inset 1px 1px #DFDFDF, inset -2px -2px grey, inset 2px 2px #FFFFFF;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/site_cursor.cur') 0 0, default;
}
a.disable,
span.disable {
    color: #5F5F5F;
    text-shadow: 1px 1px 0 #FFFFFF;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/site_cursor.cur') 0 0, default;
}
button.disable:focus,
a.disable:focus {outline: none;}

.form-input {display:block; line-height:30px !important;}
input[type="file"] {padding-left:0 !important;}

.form-input,
input[type="text"],
input[type="password"],
input[type="file"],
input[type="number"],
select {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 20px;
    padding: 0 5px;
    border: none;
    font-family: inherit;
    font-size: 12px;
    line-height: 2;
    box-shadow: inset -1px -1px #FFFFFF, inset 1px 1px grey, inset -2px -2px #DFDFDF, inset 2px 2px #0A0A0A;
    outline: none;
}
input[type="file"] {
    background-color: #FFFFFF;
    padding-left: 0 !important;
    line-height: 1.8;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/cf_11.cur') 0 0, pointer;
}
input[type="file"]::file-selector-button {
    position: relative;
    top: 0px;
    left: 2px;
    width: auto;
    height: 16px;
    margin: 0 5px 0 0;
    padding: 0 20px;
    border: none;
    line-height: 1;
    box-shadow: inset -1px -1px #0A0A0A, inset 1px 1px #DFDFDF, inset -2px -2px grey, inset 2px 2px #FFFFFF;
    box-sizing: border-box;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/cf_11.cur') 0 0, pointer;
}
select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url('/theme/windows98/img/select_button.svg');
    background-position: top 2px right 2px;
    background-repeat: no-repeat;
    line-height: 1.8;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/cf_11.cur') 0 0, pointer;
}
select:focus {
    background-color: #3038D6;
    background-image: url('/theme/windows98/img/select_button_focus.svg');
    color: #FFFFFF;
}
select:focus option {
    background-color: #FFFFFF;
    color: #000000;
}

.form-input,
input[type="text"].full,
input[type="password"].full,
input[type="file"].full,
select.full {width: 100%;}

textarea {
    position: relative;
    z-index: 2;
    width: 100%;
    min-height: 50px;
    padding: 5px;
    border: none;
    font-family: inherit;
    font-size: 12px;
    box-shadow: inset -1px -1px #FFFFFF, inset 1px 1px grey, inset -2px -2px #DFDFDF, inset 2px 2px #0A0A0A;
    resize: none;
    outline: none;
    scrollbar-width: none;
}

/* 라디오 */
input[type="radio"] {
    position: relative;
    top: 2px;
    width: 12px;
    height: 12px;
    background-image:  url('/theme/windows98/img/input_radio.svg');
    margin: 0 5px 0 0;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/cf_11.cur') 0 0, pointer;
    appearance: none;
}
input[type="radio"]:checked {background-image: url('/theme/windows98/img/input_radio_check.svg');}

/* 체크박스 */
input[type="checkbox"] {
    position: relative;
    top: 0;
    width: 12px;
    height: 12px;
    background-image:  url('/theme/windows98/img/input_checkbox.svg');
    margin: 0 5px 0 0;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/cf_11.cur') 0 0, pointer;
    appearance: none;
}
input[type="checkbox"]:checked {background-image: url('/theme/windows98/img/input_checkbox_check.svg');}


/* 커스텀 글쓰기 */
#write_container {
    width: 100%;
    padding: 30px 20px 20px;
}
#write_container iframe {
    position: relative;
    z-index: 2;
}
#write_content {
    position: relative;
    width: 100%;
    margin: 0 0 30px;
    padding: 20px 15px 15px;
    border-style: solid;
    border-width: 1px;
    border-color: #777777 #FFFFFF #FFFFFF #777777;
}
#write_content::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-style: solid;
    border-width: 1px;
    border-color: #FFFFFF #777777 #777777 #FFFFFF;
}
#write_content:last-child {margin: 0;}
#write_content .tag {
    position: absolute;
    top: -10px;
    left: 6px;
    z-index: 3;
    background-color: #D5D5D5;
    padding: 2px 5px;
}

/* 드래그 표시 */
#drag-box {
    position: fixed;
    z-index: 4;
    border-style: dotted;
    border-width: 1px;
    border-color: #000000;
    background-color: rgba(0,0,0,0.1);
    display: none;
    pointer-events: none;
}

/*********************************
	Ajax 검색 리스트
**********************************/

.ajax-list-box {height:100px; overflow-y:auto; margin-top:10px; padding:5px;}
.ajax-list-box ul,
.ajax-list-box li {display:block; margin:0; padding:0; position:relative;}
.ajax-list-box li {margin-bottom:5px;}
.ajax-list-box li a {display:block; position:relative; padding:10px; border-radius:3px; text-decoration:none; font-size:12px;}
.ajax-list-box li a .ui-thumb {position:absolute; top:10px; left:10px; width:30px; height:30px; line-height:30px; overflow:hidden; text-align:center;}
.ajax-list-box li a .ui-thumb img {max-width:100%;}
.ajax-list-box li a .ui-info {margin-left:40px;}
.ajax-list-box .no-data {line-height:50px; text-align:center; margin-top:10px;}


/*********************************
	기본 라인 스타일
**********************************/

hr.line {display:block; position:relative; clear:both; margin:10px 0; border:none; padding:0; height:1px;}
hr.padding {display:block; clear:both; margin:0; padding:0; border:none; height:30px;}
hr.padding.small {height:5px;}

#bo_v_img img {height:auto !important;}


/**************************************************************
	버튼
***************************************************************/

.btn_confirm {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
}
.ui-btn {
    width: 80px;
    height: 23px;
    border: none;
    display: inline-block;
    font-size: 12px;
    box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #dfdfdf, inset -2px -2px grey, inset 2px 2px #fff;
}
.ui-btn:active {box-shadow: inset -1px -1px #ffffff, inset 1px 1px #0a0a0a, inset -2px -2px #dfdfdf, inset 2px 2px #808080;}
.ui-btn:focus {
    outline: 1px dotted #333333;
    outline-offset: -4px;
}
a.ui-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.ui-btn.point {box-shadow: inset -2px -2px #0a0a0a, inset 1px 1px #0a0a0a, inset 2px 2px #fff, inset -3px -3px grey, inset 3px 3px #dfdfdf;}
.ui-btn.point:active {box-shadow: inset -1px -1px #ffffff, inset 1px 1px #0a0a0a, inset -2px -2px #dfdfdf, inset 2px 2px #808080;}
.ui-btn.admin {background:#8c1e1e; color:#fff; border-color:#691010;}
.ui-btn.disable {
    color: gray;
    text-shadow: 1px 1px 0 #FFFFFF;
    box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #dfdfdf, inset -2px -2px grey, inset 2px 2px #fff;
    cursor: url('https://bbland.dothome.co.kr:443/data/site/site_cursor.cur') 0 0, default;
}

.ui-btn.ico {width:15px; height:15px; text-align:left; line-height:15px; padding:0; font-size:11px; overflow:hidden; text-indent:-999px;}
.ui-btn.ico.default {width:28px; height:28px; line-height:28px;}
.ui-btn.ico:before {display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-align:center; text-indent:0; font-family:'icon';}
.ui-btn.ico.big {width:40px; height:40px; line-height:40px; font-size:18px;}
.ui-btn.ico.circle {border-radius:9.0em;}

.ui-btn.ico.del {background:#a40000; color:#fff; border:none; border-radius:2px; margin-left:5px;}
.ui-btn.ico.del:before {content:"\e9ac";}
.ui-btn.ico.camera:before {content:"\e90f";}
.ui-btn.ico.search:before {content:"\e986";}
.ui-btn.ico.exp:before {content:"\e923";}
.ui-btn.ico.search:before {content:"\e986";}


/**************************************************************
	기본박스
***************************************************************/

.theme-box {display:block; position:relative; padding:10px; box-sizing:border-box;}


/**************************************************************
	테이블
***************************************************************/

table {width:100%; padding:0; border-spacing:0px; border:0; border-collapse:collapse; table-layout:fixed;}
th {
    font-size: 12px;
    font-weight: 400;
    text-align: left;
}
th, td {border:none;}

.theme-form { }
.theme-form td {padding:5px; height:30px;}
.theme-form th {padding:5px 10px;}
.theme-form .frm_info {display:block; font-size:12px; padding:0 0 8px 0;}

.theme-list {table-layout:fixed;}
.theme-list thead th {height:30px;}
.theme-list td {padding:5px; height:30px;}
.theme-list td.no-data {padding:5px; text-align:center; line-height:200px;}


/**************************************************************
	도움말 정보
**************************************************************/

.frm_info {display:block; font-size:12px; padding:0 0 8px 0; opacity:.7;}
.status-bar .frm_info {padding:0;}


/**************************************************************
	Status Bar
***************************************************************/

.status-bar {display:block;}
.status-bar dl,
.status-bar dd,
.status-bar dt {margin:0; padding:0;}
.status-bar dl {display:block; position:relative; margin:1px 0; padding-left:100px; line-height:28px;}
.status-bar dt {position:absolute; top:0; left:0;}
.status-bar dd p {position:relative;}
.status-bar dd p span {display:block; position:absolute; top:0; left:0; bottom:0; z-index:0;}
.status-bar dd p sup {display:block; position:absolute; top:0; left:0; bottom:0; z-index:0;}
.status-bar dd p i {display:block; position:relative; padding-left:5px; font-size:11px; z-index:1;}

/** Bar Control 추가 **/
.status-bar dl.ui-control {padding-right:60px;}
.status-bar dl dd.control {display:block; position:absolute; top:0; bottom:0; right:0; width:60px;}
.status-bar dl dd.control a {display:block; position:relative; width:50%; float:left; margin:0; padding:0; text-indent:-999px; overflow:hidden;}
.status-bar dl dd.control a:before  {content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; text-indent:0; text-align:center; font-family:'icon';}
.status-bar dl dd.control a + a {border-left-width:0;}
.status-bar dl dd.control a[data-function="plus"]:before {content:'\ea0a';}
.status-bar dl dd.control a[data-function="minus"]:before {content:'\ea0b';}


/**************************************************************
	배경음악 이퀄라이저 효과
***************************************************************/

html.single .bgm-player {display:none !important;}

.bgm-player {text-align:center;}
.bgm-player .title {display:inline-block; vertical-align:middle; line-height:30px; font-size:13px;}
.bgm-player ul {display:inline-block; vertical-align:middle; margin-left:10px;}
.bar-equalizer {display:inline-block; vertical-align:middle; position:relative; width:90px; height:25px; margin:0 auto; overflow:hidden; text-align:center; box-sizing:border-box; margin-left:15px;}
.bar-equalizer i {display:block; float:left; width:1px; margin-right:2px; border-radius:5px; margin-top:15px; transform:translateY(-50%); transition:height 0.3s linear; -webkit-transition:height 0.3s linear;}


/*******************************************
	헤더 레이아웃
********************************************/

/** 디자인 설정 안할 시 */
#no_design_gnb {padding:20px 0; text-align:center; line-height:1.5em;}
#no_design_gnb li {display:block; margin-bottom:20px;}

.close-header #header {width:0px !important;}
.close-header #body {margin-left:0 !important;}
.close-header body {min-width:0;}

@media all and (max-width:1000px)  {
	.close-header #header {width:auto !important;}
}

#header .fix-layout {padding:0;}
#logo img {max-width:225px;}

/** 모바일 헤더 레이아웃 */
@media all and (max-width:1024px)  {
	body {width:100%;}
	#logo {padding:0; z-index:0; top:auto; left:auto; transform:translateX(0) translateY(0); position:relative; text-align:center;}
	#body {margin-left:0px;}
	
	/* 헤더 위치 */
	#header .fix-layout {padding:0;}
	#header {position:fixed; top:0; left:0; right:0; bottom:auto; z-index:999; width:auto; height:50px; overflow:visible;}

	/* 메인메뉴 */
	#gnb {position:fixed; top:0; right:-280px; bottom:0; width:280px; z-index:999; overflow-y:auto;}
	#gnb_control_box {position:absolute; top:50%; margin-top:-20px; right:10px; width:40px; height:40px; border-radius:100%; text-align:center;}
	#gnb_control_box:before {content:""; display:inline-block; width:0; height:100%; vertical-align:middle;}
	#gnb_control_box img {display:inline-block; max-width:50%; max-height:50%; vertical-align:middle; margin-left:-12%; opacity:1;}

	/* 메뉴 열고 닫기 */
	#gnb_control_box,
	#gnb_control_box *  {transition:all 0s ease; -webkit-transition:all 0s ease; -ms-transition:all 0s ease;}

	/* 메뉴 열렸을 시 */
	.open-gnb #gnb {right:0;}
	.open-gnb #gnb_control_box {position:fixed; top:0; left:0; right:0; bottom:0; z-index:99; background:rgba(0, 0, 0, 0.5); border-radius:0; width:auto; height:auto;}
	.open-gnb #gnb_control_box img {opacity:0;}
}


/**************************************************************
	탭 설정
***************************************************************/

#tab_list {display:block; position:relative; overflow:hidden; border-bottom-width:2px; border-bottom-style:solid;}
#tab_list li {display:block; position:relative; float:left;}
#tab_list li a {display:block; position:relative; border-bottom-width:0;}
#tab_list li + li a {border-left-width:0px;}


/**************************************************************
	페이지 설정
***************************************************************/

.pg_wrap {
    position: relative;
    padding: 20px 0;
    display: block;
    text-align: center;
}
.pg_wrap .pg {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.pg_wrap .pg_page {
    position: relative;
    width: 20px;
    height: 20px;
    display: inline-block;
}
.pg_wrap .pg_control {
    overflow: hidden;
    text-align: left;
    text-indent: -999px;
}
.pg_wrap .pg_control:before {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    display: block;
}
.pg_wrap .pg_start,
.pg_wrap .pg_end {display: none;}
.pg_wrap .pg_prev:before,
.pg_wrap .pg_next:before {
    content: "";
    background-position: center;
    background-repeat: no-repeat;
}
.pg_wrap .pg_prev:before {background-image: url('/theme/windows98/img/caret_left.svg');}
.pg_wrap .pg_next:before {background-image: url('/theme/windows98/img/caret_right.svg');}


/****************************************************
	Search Box
****************************************************/

.searc-sub-box {position:relative; clear:both; padding:30px 0px;}
.ui-search-box {position:relative; padding-left:100px; padding-right:80px; margin-top:5px;}
.ui-search-box .sch_category {position:absolute; top:0; left:0; width:95px; line-height:30px;}
.ui-search-box .sch_button {position:absolute; top:0; right:0; width:75px;}
.ui-search-box span {display:block; padding:0 15px;}
.ui-search-box select,
.ui-search-box input[type="text"],
.ui-search-box button {display:block; width:100%;}


/****************************************************
	인벤토리 팝업 뷰
****************************************************/

.inven-popup-viewer,
.inven-popup-viewer * {-webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; font-family:'Dotum';}
.inven-popup-viewer .ajax-list-box {height:auto; padding:5px; font-size:11px; word-break:keep-all; line-height:1.5;}
.inven-popup-viewer {display:none; position:fixed; top:50%; left:50%; width:300px; height:370px; margin-left:-150px; margin-top:-185px;z-index:9000; padding:25px 40px; box-sizing:border-box;}
.inven-item-box {position:relative; margin-right:25px; padding-left:25px;  border-right-width:0px;}
.inven_popup_viewer_close {display:none;}
.inven-popup-on .inven_popup_viewer_close {display:block; position:fixed; top:0; left:0; right:0; bottom:0; z-index:8900; -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);}
.inven_popup_viewer_close a {display:block; position:absolute; top:0; left:0; right:0; bottom:0; OVERFLOW:hidden; text-indent:-999px;}

.inven-popup-viewer.default-form .inner-content {position:relative; height:100%;}
.inven-popup-viewer.default-form .inner-content .error  {position:absolute; top:left:0; right:0;  text-align:center; line-height:100px; font-family:'Nanum Gothic';}
.inven-popup-viewer.default-form .inner-content a {}

.inven-popup-viewer.default-form .info {position:relative; text-align:center; padding:15px 0;}
.inven-popup-viewer.default-form .info .ui-thumb {}
.inven-popup-viewer.default-form .info .ui-thumb img {width:50px; height:50px;}

.inven-popup-viewer.default-form .text {position:relative; }
.inven-popup-viewer.default-form .text .title {font-size:14px; text-align:center; margin-bottom:10px; padding-bottom:10px;}
.inven-popup-viewer.default-form .text .title span {display:none;}

.inven-popup-viewer.default-form .text .item-content-box {height:170px; overflow-y:auto;}
.inven-popup-viewer.default-form .text .item-content-box div {line-height:1.4em; text-align:center;}
.inven-popup-viewer.default-form .text div.default {}
.inven-popup-viewer.default-form .text div.effect { padding-top:15px;}
.inven-popup-viewer.default-form .text div.memo { padding-top:15px;}

.inven-popup-viewer.default-form .control-box {clear:both; position:relative; padding:10px 0 0; text-align:center;}
.inven-popup-viewer.default-form .control-box li {display:inline-block;}
.inven-popup-viewer.default-form .control-box li a {display:block; }

.inven-popup-viewer.default-form .add-item-form {position:relative; height:30%; margin-top:10px;}
.inven-popup-viewer.default-form .add-item-form .item-info {position:relative; margin-bottom:5px;}
.inven-popup-viewer.default-form .add-item-form .item-info label {display:none;}
.inven-popup-viewer.default-form .add-item-form .item-info span {display:block; font-size:11px; padding-top:8px;}
.inven-popup-viewer.default-form .add-item-form input {width:100%; box-sizing:border-box;}
.inven-popup-viewer.default-form .add-item-form .item-input {position:relative; margin-bottom:5px;}
.inven-popup-viewer.default-form .add-item-form .ui-style-btn.type4 {position:absolute; right:87px; bottom:-44px; height:25px; line-height:25px;}

.inven-popup-viewer.default-form .send-item-form	 {position:relative; height:30%;}
.inven-popup-viewer.default-form .send-item-form input,
.inven-popup-viewer.default-form .send-item-form select {width:100%; box-sizing:border-box;}
.inven-popup-viewer.default-form .send-item-form input {padding:0 10px;}
.inven-popup-viewer.default-form .send-item-form .item-input {position:relative; margin-bottom:5px;}
.inven-popup-viewer.default-form .send-item-form .ui-style-btn.type4 {position:absolute; right:87px; bottom:-44px; height:25px; line-height:25px;}


/****************************************************
	Top 버튼
****************************************************/

#goto_top {position:fixed; right:0; bottom:0; z-index:50;}
@media all and (max-width:580px)  {#goto_top  {width:50px;}}


/****************************************************
	서브메뉴 레이아웃
****************************************************/

#submenu {display:block; position:relative; text-align:center;}
#submenu li {display:inline-block; vertical-align:middle; font-size:13px; font-weight:600; padding:8px 10px;}
#subpage {margin-top:20px;}
#subpage section {padding-bottom:50px;}

@media all and (max-width:1024px)  {
	#submenu {margin:0 -10px;}
	#submenu li {padding:5px; font-size:12px;}
	#subpage {margin-left:0;}
}


/****************************************************
	페이지 타이틀
****************************************************/

.page-title {font-size:18px; padding:10px 0 20px;}
.page-title span {font-size:14px; opacity:.8; font-weight:400;}

.sub-title {font-size:14px; padding:0 0 10px;}
.sub-title:before {content:"\e906"; display:inline-block; vertical-align:middle; font-family:'icon'; margin-right:8px;}


/****************************************************
	알람 팝업
****************************************************/

.ui-memo-alram-box,
.ui-call-alram-box {display:none; position:fixed; top:0; left:0; right:0; z-index:999; text-align:center;}


/****************************************************
	커스텀 스크롤
****************************************************/
*::-webkit-scrollbar {
    width: 16px;
    height: 16px;
}
*::-webkit-scrollbar-thumb {
    background-color: #D5D5D5;
    border-style: solid;
    border-width: 2px;
    border-color: #FFFFFF #444444 #444444 #FFFFFF;
    border-radius: 0px;
    -webkit-box-shadow: none;
}
*::-webkit-scrollbar-track {
    background-color: #FFFFFF;
    background-image: url("data:image/gif;base64,R0lGODlhAgACAJEAAAAAAP///8zMzP///yH5BAEAAAMALAAAAAACAAIAAAID1CYFADs=");
    -webkit-box-shadow: none;
}
*::-webkit-scrollbar-track:horizontal {}
::-webkit-scrollbar-corner {background-color: #D5D5D5;}
*::-webkit-scrollbar-button:start,
*::-webkit-scrollbar-button:end {
    width: 16px;
    height: 16px;
    background-color: #D5D5D5;
    border-style: solid;
    border-width: 2px;
    border-color: #FFFFFF #444444 #444444 #FFFFFF;
    background-repeat: no-repeat;
    background-position: center;
}
*::-webkit-scrollbar-button:vertical:start {background-image: url('/theme/windows98/img/caret_up.svg');}
*::-webkit-scrollbar-button:vertical:end {background-image: url("/theme/windows98/img/caret_down.svg");}
*::-webkit-scrollbar-button:horizontal:start {background-image: url("/theme/windows98/img/caret_left.svg");}
*::-webkit-scrollbar-button:horizontal:end {background-image: url("/theme/windows98/img/caret_right.svg");}
*::-webkit-scrollbar-button:start:active,
*::-webkit-scrollbar-button:end:active {border-color: #444444 #FFFFFF #FFFFFF #444444;}


/****************************************************
	마퀴 (우 ▶ 좌) 흐름
****************************************************/

.marquee span {display:block; position:relative; overflow:hidden;}
.marquee span i:after {content:""; white-space:nowrap; padding-right:50px;}
 .marquee span i {margin:0; padding-left:100%; display:inline-block; white-space:nowrap;
	-webkit-animation-name:marquee;
	-webkit-animation-timing-function:linear;
	-webkit-animation-duration:10s;
	-webkit-animation-iteration-count:infinite;
	-moz-animation-name:marquee;
	-moz-animation-timing-function:linear;
	-moz-animation-duration:10s;
	-moz-animation-iteration-count:infinite;
	-ms-animation-name:marquee;
	-ms-animation-timing-function:linear;
	-ms-animation-duration:10s;
	-ms-animation-iteration-count:infinite;
	-o-animation-name:marquee;
	-o-animation-timing-function:linear;
	-o-animation-duration:10s;
	-o-animation-iteration-count:infinite;
	animation-name:marquee;
	animation-timing-function:linear;
	animation-duration:10s;
	animation-iteration-count:infinite;
}
@-webkit-keyframes marquee  {
	from    {-webkit-transform:translate(0%);}
	99%,to  {-webkit-transform:translate(-100%);}
}
@-moz-keyframes marquee  {
	from    {-moz-transform:translate(0%);}
	99%,to  {-moz-transform:translate(-100%);}
}
@-ms-keyframes marquee  {
	from    {-ms-transform:translate(0%);}
	99%,to  {-ms-transform:translate(-100%);}
}
@-o-keyframes marquee  {
	from    {-o-transform:translate(0%);}
	99%,to  {-o-transform:translate(-100%);}
}
@keyframes marquee  {
	from    {transform:translate(0%);}
	99%,to  {transform:translate(-100%);}
}