@import url("/jsp/system/css/ubs-custom-base.css");		/* setting */
@import url("/css/font.css");		/* font */

/***
COMPONENT STYLE GUIDE

-color: #297EEF, #196BD5, #0F4892
-font: 16px
-border: #d6d6d6
-content_wrapper: 1230px

***/

/* deco */

/* Layout Guide Style */
	#pageLayout{width:100%; height:100%;min-width: 1230px;}
	#layoutTable{height: 100%;}

	/* Header */
	.layoutTableHeader,	#contentHeader H1,.headerMenu{height:70px;}

	.layoutTableHeader{border-bottom: 1px solid #d6d6d6;vertical-align: top;background: #fff;}

	/* Left menu */
	#bodyleft,#contentHeader H1,#openedLeft{width: 260px;}
	#bodyleft{vertical-align: top; position: relative;background: #363A41;}
	#houseKeep{position: absolute;z-index: 3;top: 0;left: 0px;width: 100%;height: 44px;}
	#leftMenuArea{padding-top: 68px;}/* =#houseKeep:height */

	/* Body */
	#container {background: #EFF1F2;vertical-align: top;position: relative;padding: 40px;}

	#pageContentLayout {/*max-width: 1230px;overflow-x: auto;  background: #fff;*/}

	/* Footer */
	#contentFooter {}

	/* width */
	.content_wrapper {max-width: 1600px;position: relative;}

/* Templet Guide Style */

	/* Header */
	#contentHeader H1{float: left;text-indent: -999999em;
		background: url('../../home/images/common/header/header_logo.png') no-repeat center;}
	.header_wrapper{position: absolute;top: 0;right: 40px;}
	.header_wrapper .headerMenu{float: left;padding: 0 20px;height: 71px;line-height: 70px;font-size: 16px;font-weight: 700;}
	.header_wrapper .headerMenu:hover{border-bottom: 3px solid #196BD5;opacity: 1;}
	.headerMenu:before{content: '';display: inline-block;width: 30px;height: 30px;vertical-align: middle;background-image: url(../images/theme/sprite-header.png);background-repeat: no-repeat;}
	.header_wrapper [class*='-on']{color: #196BD5;border-bottom: 3px solid #196BD5;}
	.menuOff{border-style: solid;border-color: #d6d6d6;border-width: 0px 1px;color: #8E9093;}
	.menuOff + .menuOff{margin-left: -1px;}
	.menuOff:before{background-position-y: 0px;}
	.menuOff.f-top-menu-on:before{background-position-y: -30px;}
	#div_topmenu_item_home:before{background-position-x: -30px;}
	#div_topmenu_item_system:before{background-position-x: -60px;}
	#div_topmenu_item_mobile:before{background-position-x: 0;}

	/* Housekeep Btns */
	#houseKeep{background: #3a68b1;padding: 10px;}
	.f-user-wrap{position: relative;}
	.f-user-text-body{padding-right: 60px;}
	.f-user-text-body i{width: 22px;height: 22px;background-image: url('../images/theme/sprite-header.png');background-position: -80px -80px;vertical-align: middle;}
	.f-user-text-start{width: 40px;text-align: right;}
	.f-user-text-name{font-size: 12px;color: #fff;}
	.f-user-logout{position: absolute;top: 0;right: 0;}
	.f-btn-logout{width: 50px;height: 22px;border-width: 0;background-position: -30px -57px;background-image: url('../images/theme/sprite-header.png');}

	.white12B {FONT-SIZE: 12px; COLOR: #ffffff;  TEXT-DECORATION: none; FONT-WEIGHT: bold; }
	.gray12 {FONT-SIZE: 12px; COLOR: #cdcdcd;  TEXT-DECORATION: none;}

/* Left */
	#closedLeft,#todayArea{display: none;}

	/* Leftmenu */
	#leftMenu > li{position: relative;}
	.f-left-menu {display: block;padding: 7px 0 7px 23px;color:#fff;cursor: pointer;font-weight: 100;}
	.f-left-menu.existsubmenu{padding-left: 10px;}
	.f-left-menu:before{content: '';display: inline-block;width: 13px;height: 20px;background-image: url('../images/theme/sprite-header.png');background-position: -28px -90px;background-repeat: no-repeat;vertical-align: middle;}
	.f-left-menu.existsubmenu:before{background-position: -5px -90px;}
	.f-left-menu:hover,.f-left-menu-on {background: #464242;}
	.f-left-menu-on:after{content: '';display: inline-block;position: absolute;top: 0;right: 0;width: 3px;height: 100%;background: #EFF1F2;}
	.f-left-menu-over { background: #E9EDEE url(../images/theme/The_lay_leftBulletSet.gif) no-repeat 0px -21px; }
	#div_syscount_submenu_area{background: #465061;}

/* Contents */

	/* title */
	.f-module-title {padding-bottom: 30px;line-height: 1.7;}
	.f-title-SYS h1{color: #4f4f4f;font-size: 24px;}
	.f-title-SYS h1:before{content: '';display: inline-block;width: 3px;height: 20px;margin-right: 20px;background: #196bd5;}
	.f-title-SYS em{/* color: #6298DF; */color: #196bd5;font-size: 16px;}

	/* search */
	.f-search-area{margin-bottom: 15px;background-color: #f3f8ff;}
	.f-search-elements{padding: 0 10px 15px;}
	.f-search-elements > ul{display: table;}
	.f-search-elements > ul > li {display: table-cell;vertical-align: top;padding-top: 10px;padding-right: 10px;}
	.f-search-elements .title{display: block;font-size: 12px;}
	.f-search-elements .conts{display: block;margin-top: 5px;}
	.f-search-elements > ul > li.f-search-td-btn {vertical-align: bottom;}
	.f-btn-search{padding: 0 8px;background: #2196f3;border-color: #136ad6;color: #fff;font-size: .85em;}
	.search-table li{float: left;padding-right: 5px;font-size: 12px;color: #777;}
	.search-table li:last-child{padding-right: 0;}
	.search-table li label{font-weight: 700;}

	/* Information : Buttons */
	.f-page-info {position: relative;padding: 5px 0;margin-bottom: 10px;border-bottom: 1px solid #b9b9b9;}
	.f-page-info-text{color: #555;}
	.f-page-info-text:before{content: '';display: inline-block;width: 20px;height: 20px;background: url('../images/theme/sprite-grid.png') 0px 0px no-repeat;vertical-align: middle;}
	.f-page-info-button {position: absolute;top: 0;right: 0;}
	.f-page-info-button .button{height: 28px;padding: 0 15px;font-size: .85em;text-transform: capitalize;}
	.f-page-info-button .write{background: #FF9800;border-color: #FF9800;color: #fff;}
	.f-page-info-button .back{background: #196bd5;border-color: #0e53ad;color: #fff;}
	.f-page-info-button .green{background: #4caf50;border-color: #59c75e;color: #fff;}
	.f-page-info-button button:hover{opacity: .7;}

	/* list component */
	.box-list > li{float: left;}
	
	/* title */
	.f-grid3-title {position: relative;}
	.f-grid3-title-hd {font-size: 18px;line-height: 2.3;color: #315B95;padding-right: 240px;}
	.f-grid3-title-psize{position: absolute;top: 0;right: 0;margin-top: 10px;width: 240px;}
	.f-psize {width:50px;float: right;}
	.f-grid3-title-psize .box-list{float: right;}
	.f-grid3-title-psize .box-list > li{padding-left: 5px;}

	/* paging */
	.f-paging-area{margin-top: 1.5em;text-align: center;}
	.f-paging-area .v_milddle {display: inline-block;margin-left: -1px;border: 1px solid #e5e5e5;background: #fff}
	.f-paging-area [class*='txt']{color: #777;font-size: 12px;padding: 0 15px 0 10px;}
	.f-paging-area .txt-on{color: #196bd5;padding-right: 0;}

	/* DataGrid */
	.f-grid3-table{background: #fff;}
	.f-grid3-table tr > *,.sticky-thead tr > *{font-size: 12px;padding: 15px 0;}
	.f-grid3-header th{text-align:center;border-width: 1px 0px;border-style: solid;}
	.f-grid3-hd-row{background: #fff;}
	.f-grid3-hd-row th{border-width: 0;background: #7895c3;color: #ffffff;}
	.f-grid3-header tr:first-child [class*='grid-']{border-bottom-width: 1px;}
	.f-grid3-header tr:last-child [class*='grid-']{opacity: .65;}
	.f-grid3-row td {border-bottom: #d6d6d6 1px solid;padding-left: 5px;}
	.f-grid3-table tbody tr:hover td{background: #fffeed;}

	/* Data value theme*/
	.f-grid3-table .t_center{text-align: center;padding-left: 0;}
	.f-grid3-table .box{display: inline-block;padding: 0 7px;line-height: 1.7;font-size: .85em;font-weight: bold;}
	.f-grid3-table .box.buy{background: #ff4a4a;color: #fff;}
	.f-grid3-table .box.sell{background: #196BD5;color: #fff;}
	.f-grid3-table .symbol img{vertical-align: middle;width: 15px;}
	.f-grid3-table .userid{color: #196bd5;font-weight: 600;}
	.f-grid3-table .userid i{background: url('../../home/images/sub/sprite-basic.png') 0 -90px;width: 17px;height: 15px;vertical-align: middle;}
	.f-grid3-table .num{padding-right: 7;text-align: right;}
	.f-grid3-table .pp_val_total{color: #ff4a4a;}
	.f-grid3-table .fee{display: block;color: #196bd5;}
	.f-grid3-table .value{background: #fffeed;}
	.f-grid3-table .value .ty00/*waitin*/{color: #196BD5;}
	.f-grid3-table .value .ty01/*Request*/{color: #209825;}
	.f-grid3-table .value .ty02/*Deal*/{color: #ff4a4a;}
	.f-grid3-table .value .ty03/*Complete confirm*/{color: #ff5722;}
	.f-grid3-table .value .ty04/*Cancel*/{color: #a7a7a7;}
	.f-grid3-table .action{display: block;margin: auto;width: 70px;height: 24px;background: #fff;font-size: 11px;}
	.f-grid3-table .action + .action{margin-top: 3px;}
	.f-grid3-table .action.confirm{border-color: #196BD5;color: #196BD5;}
	.f-grid3-table .action.cancel{border-color: #ff4a4a;color: #ff4a4a;}
	.f-grid3-table .action.view{border-color: #209825;color: #209825;}
	.f-grid3-table .contents{vertical-align: top;}
	.f-grid3-hd-row .grid-buying{/* background: #ff9191; */}
	.f-grid3-hd-row .grid-selling{background: #5277a7;}
	.f-grid3-row .grid-buying{background: #fffbfb;}
	.f-grid3-row .grid-selling{background: #f5fbfd; }

	/* write */
	.f-cont-reg-table{border-top: 1px solid #d6d6d6;}
	.f-cont-reg-table th{width: 200px;padding-left: 18px;background-position: 7px !important;background-repeat: no-repeat;background-color: #7895c3;color: #fff;}
	.f-cont-reg-table td{padding: 6px;vertical-align: middle;}
	.f-cont-reg-table tr > *{border-bottom: 1px solid #d6d6d6;font-size: 12px;}
	.f-reg-cont td {background-color:#FFFFFF;}
	.f-cont-reg-table label{vertical-align: middle;}
	.f-cont-reg-table .f-search-elements{padding: 0;}
	.f-cont-reg-table .f-search-elements li{padding-top: 0;}
	.f-cont-reg-table .note_font img{vertical-align: middle;}
	
	/* Essential */
	.f-reg-cont-alt td {background-color:#f3f8ff;}
	.f-reg-required TH{background: #5375ab;}
	.f-reg-required TH:before{content: '* ';/* background-image: url(../images/theme/The_com_bullet01.gif); */}
	.f-reg-normal TH{/* background-image: url(../images/theme/The_com_bullet02.gif); */}
	
	/* contact */
	.BBSconts {padding: 5px;width: 80%;}
	.BBSconts .meta_info+.conts{margin-top: 10px;}
	.BBSconts .userid{font-weight: 600;}
	.BBSconts .userid i{background: url('../../home/images/sub/sprite-basic.png') 0 -90px;width: 17px;height: 15px;vertical-align: middle;}
	.BBSconts .meta_info .date {color: #9e9e9e;}
	.BBSconts .conts{clear: both;}
	.BBSconts TEXTAREA {border: 1px solid #dadada;min-height: 130px;width: 100%;}

	.f-btn-area {margin-top: 40px;text-align: center;}
	.f-btn-area button{width: 180px;height: auto;line-height: 2;font-size: 16px;}
	.f-btn-area .confirm{background-color: #196bd5;border-color: #196bd5;color: #fff;}
	.f-btn-area .cancel{color: #929292;border-color: #b9b9b9;}

/* popup */

	/* layout */
	.f-popup-layout{height:98%; padding: 3px 6px; margin: 0 0 -40px 0; }
	.f-popup-title{padding: 10px;margin: 0 0 3px 0;background: #6698bf; color:#FFFFFF;line-height: 26px}
	.f-popup-foot{margin: 10px 6px 0px 6px; padding: 3px; text-align: center; background: #f9f9f9;}
	
	/* table */
	.f-popup-layout .f-cont-reg-table tr > *{border-color: #b5c4d0;color: #555;font-size: 12px;}
	.f-popup-layout .f-cont-reg-table th{width: 24%;background-color: #dff1ff;padding: 7px;}
	.f-popup-layout .f-cont-reg-table .f-reg-required TH{background-image: none}
	.f-popup-layout .f-cont-reg-table.f-grid3-table tr > *{text-align: center;}
	.f-popup-layout .f-cont-reg-table.f-grid3-table th{background: #f5f5f5;}
	
	/* foot */
	.f-popup-foot .button{width: 85px;font-size: 12px;color: #fff;}
	.f-popup-foot .button.action{background-color: #337ecc;border-color: #337ecc;}
	.f-popup-foot .button.cancel{background-color: #7b7b7b;border-color: #7b7b7b;}
	
	/* Paging */
	.f-popup-paging-area {
		height: 25px; padding: 0px 0px 0px 0px; text-align: center; vertical-align: middle;
	}	
	
	.f-popup-layout input,.f-popup-layout select,.f-popup-layout button{font-size: 13px;}
	
/* MAIN */
.sys_main{text-align: center;margin-top: 7em;}
.sys_main .title{color: #fff;line-height: 2.3;font-size: 3.5em;font-style: italic;}
.sys_main .txt{color: #fff;font-size: 2em;}
.sys_main .txt_sub{margin: 2.3em auto 0;width: 60%;color: #9cb2d4;}
.sys_main .article{margin: 7em auto 0;min-width: 1160px;overflow: hidden;}
.sys_main .article .bx-wrapper{position: relative;margin: auto;}
.sys_main .bx-controls{margin-top: 3.15em;}
.sys_main .article .bx-pager .bx-pager-item{display: inline-block;padding: 5px;}
.sys_main .article .bx-pager .bx-pager-item a{display: inline-block;text-indent: -999em;background: #fff;border-radius: 50%;overflow: hidden;width: 15px;height: 15px;opacity: .43;}
.sys_main .article .bx-pager .bx-pager-item a.active{opacity: 1;}
.sys_main .article .bx-controls .bx-controls-direction{position: absolute;top: 25%;width: 100%}
.sys_main .article .bx-controls .bx-controls-direction a{position: absolute;display: inline-block;text-indent: -999em;width: 25px;height: 35px;background-image: url('/jsp/home/images/main/arrow.png');background-position: center 0;}
.sys_main .article .bx-controls .bx-controls-direction .bx-prev{left: -37px;}
.sys_main .article .bx-controls .bx-controls-direction .bx-next{right: -45px;
	transform: rotate(-180deg);
	-moz-transform: rotate(-180deg);
	-ms-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg)}	
.sys_main .market_list li{float: left;width: 200px;text-align: center;}
.sys_main .market_list li.no_list{width: 100%;clear: both;}
.sys_main .market_list li img{width: 5em;}
.sys_main .market_list .button{border: 1px solid #FF9800;background: #FF9800;margin-top: 3em;padding: 0 50px;line-height: 3.3;color: #fff;font-size: 1.075em;}
.sys_main .market_list .txt{margin-top: 10px;font-size: 16px;}