@CHARSET "UTF-8";

body{
	font-family:나눔고딕, Tahoma, Geneva, sans-serif;
	font-size:13px;
	padding:0;
	margin:0;
	overflow:hidden;
	background: #def2f3;
	background-image: url(../images/bg.jpg);
	background-repeat: repeat-x;	
}

/* Header */
/* 헤더 */
.header{
	
}

/* 제목 Bar - 제목, 종료, 도움말 버튼 등 */
.TitleBar{height:45px; background-image:url(../images/top_bg.jpg); font-size:17px; color:#fff; font-weight:bold;}
.TitleBar .left label{float:left; padding:11px 0 0 3px;}
.TitleBar .left img{float:left; padding:13px 0 0 14px;}
.TitleBar .center{float:left; padding:14px 0 0 11px;}
.TitleBar .right{float:right; padding:12px 12px 0 0;}

/* 제목 Bar - 다른 결제수단으로 이동하는 메뉴 */
.chgMethod{
	z-index:9999; 
	left: 120px;
	margin: 2px 0px 0px;
	position: absolute;
	width: 150px;
	top:35px;
}
.chgMethod ul{
	background: white;
	border: 0px;
	border-top: 0px;
	margin: 0px;
	padding: 1px;
}
.chgMethod li{
	border: 0px;
	clear: both;
	display: block;
	float: none;
	margin: 0px;
	width: 100%;
	background:#3EA7DE;
}
.chgMethod li a{ 
	background-image: none !important;
	clear: both;
	display: block;
	filter: none;
	float: none;
	margin: 0px;
	padding: 0px !important;
	width: 100%;
}
.chgMethod li a span{
	border: 0px;
	color: #767676;
	display: block;
	font-weight: normal;
	height: auto;
	padding: 5px 20px;
}
.chgMethod li a:hover,
.chgMethod li a:active,
.chgMethod li a:focus{background:#266687;}

/* 메뉴 탭 */
.MenuTab{
	height:32px;
	background-color:#374c83;
}
.MenuTab ul{
	list-style:none;
	padding:0;
	margin:0;
}
.MenuTab ul li a{
	float:left;
	text-decoration:none !important; cursor:pointer; 
	width:106px; height:23px; padding-top:9px;
	background-image: url(../images/tab.jpg);
	background-position: left top;
	color:#404040;
	font-size:12px;
	font-weight:bold;
	text-align:center;
}
.MenuTab ul li a:hover,
.MenuTab ul li a:active,
.MenuTab ul li a:focus{   
	background-image: url(../images/tab.jpg);
	background-repeat: no-repeat;
	background-position: right top; 
	color:#FFFFFF;
}


/* Main Container */
/* 컨테이너 */
.container{
	padding:7px 15px;
}

/* 상품정보 */
.GoodsBar{
	height:16px;
	margin-bottom:7px;
	padding:9px 14px;
	position:relative;
	background:#374c83;
	border-radius:6px;
	-webkit-border-radius:6px;
	-moz-border-radius:6px;
	-o-border-radius:6px;
}
.GoodsBar div{
	width:33.3%;
	float:left;
	font-size:13px;
	color:#E5E5ED;
	text-align:center;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis; 
	-o-text-overflow:ellipsis; 	
	position:relative;
}

/* 흰박스 */
.main{
	padding:9px 8px;
	border:1px solid #ccc;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;	
	background:#fff;
}

/* 하단버튼 */
.btn{height:34px; padding-top:4px;}
.btn .left{float:left; padding-left:5px;}
.btn .right{float:right; padding-right:5px;}

/* 리스트에서 페이징 처리하는 클래스 */
.PagingBar {height:16px; padding:13px 0px 0px 0px; text-align:center; font-size:14px; font-weight:bold;}
.PagingBar a {padding:4px 8px; margin-top:7px; text-decoration:none; font-weight:bold; border:1px solid #8d98b5;}
.PagingBar a.number {border-color:#8d98b5;color:#000000;}
.PagingBar a.ON {background-color:#374c83;border-color:#374c83;color:#ffffff;}
.PagingBar a.go {border:none;}
.PagingBar a.go img {margin-top:-5px; margin-bottom:-8px;}

.scwHeadLeft {background-image:url(../images/btn_page_back.png);}
.scwHeadRight {background-image:url(../images/btn_page_next.png);}
.scwHeadClose {background-image:url(../images/btn_close.png);}

/* Footer */
/* 고객센터 및 로고 */
.footer{height:28px; margin-top:5px;}
.footer .left{float:left; margin-left:9px;}
.footer .right{float:right; margin-right:9px;}


/* Main Container 나머지 Components */
/* 목록 정보 - info / info2 는 배경색상만 다름 */
.info{
	padding:5px 10px;
	background:#fff;
}
.info2{
	padding:5px 10px;
	background:#dde9f4;
}
.info span, .info2 span{  
	width:30%;
	font-size:13px;
	padding: 5px 10px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis; 
	-o-text-overflow:ellipsis; 	
	resize:horizontal;
	position:relative;
}
.info div, .info2 div{
	width:33.3%;
	float:left;
	font-size:13px;
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis; 
	-o-text-overflow:ellipsis; 	
	position:relative;
}

/* 목록 중 선택하는 Bar */
.selectBar{
	padding:6px 3px;
}
.selectBar label{
	font-size:14px;
	padding:3px;
	color:#374c83;
	font-weight:bold;
}
.selectBar span{
	font-size:14px;
	padding:3px;
}
.selectBar input{
	font-family: 나눔고딕, Tahoma, Geneva, sans-serif;
	font-size:14px;
	padding:6px;
	margin:0px;
	text-align:left;
	border:1px solid #ccc;
	/* 테두리 곡선처리 관련 */
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	background:#EEEEEE;
	/* 그림자 */
	box-shadow:inset 0 0 5px #ccc; 
	-moz-box-shadow:inset 0 0 5px #ccc; 
	-webkit-box-shadow:inset 0 0 5px #ccc;
}
.selectBar .listInput{
	width:90px;
	text-align:left;
}
.selectBar img{
	float:right;
	padding:0;
	margin:0;
}

/* 펼쳐지고 접혀지는 목록 전체 : selectList */
.selectList ul{
	list-style:none;
	margin:0; 
	padding:0; 
}
.selectList .blank{
	
}

/* 접혀지는 리스트들 */
.cardDisplay, .cardInstmn, .cardType, .cpcoDisplay, .methodDisplay, .bankDisplay, .receiptDisplay, buttonList{	
	float:left;
	width:100%;
	margin-bottom:9px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	background:#dde9f4;
}

/* 버튼 모양의 리스트 */
.Card, .Instmn, .selMethod, .Cell{
	font-family: 나눔고딕, Tahoma, Geneva, sans-serif; 
	float:left;
	width:53px;
	background-image : url(../images/btn0.png);
	border:none;
	margin:5px;
	padding:2px;
	padding-top:8px;
	height:27px;
	font-size:12px;
	text-align:center;
	cursor:pointer;
	font-weight:bold;
}
.Receipt, .Bank{
	font-family: 나눔고딕, Tahoma, Geneva, sans-serif; 
	float:left;
	width:114px;
	background-image : url(../images/btn1.png);
	border:none;
	margin:5px;
	padding-top:4px;
	height:33px;
	font-size:12px;
	text-align:center;
	cursor:pointer;
	font-weight:bold;
}

/* 버튼안에 들어가는 작은 글씨 */
.small{font-size:11px;}

/* 환경설정 중 소개부분 박스 디자인 */
.helpBox{
	padding:5px 10px;
	margin-bottom:9px;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	background:#dde9f4;
}
.helpBox label{
	font-size:14px;
	padding:3px;
	color:#374c83;
	font-weight:bold;
}


/* a태그 관련 */
a			{text-decoration:none;}
a:link		{color:#000; cursor:pointer;} 
a:visited 	{color:#000; cursor:pointer;} 
a:hover		{color:#c8c8c8; cursor:pointer;} 
a:active	{color:#000; cursor:pointer;}