@charset "utf-8";
/* CSS Reset, Components, etc */

/* 나눔고딕 웹폰트 */
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(https://fonts.googleapis.com/css?family=Merriweather+Sans);

/* Reset
-----------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input, textarea {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	/* vertical-align: baseline; */
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

html {
	height:100%;
	overflow-y:scroll;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	-webkit-overflow-scrolling:touch;
}

ol, ul {
	list-style: none;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	/*border-collapse: collapse;
	border-spacing: 0;*/
}
a {text-decoration:none;}
img {vertical-align: top;}

/* iPhone text, input
-----------------------------*/
* {
	-webkit-text-size-adjust:none;
	-webkit-border-radius:0;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	word-break:keep-all;
}
::after, ::before {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
input[type="submit"] {-webkit-appearance:none;}
input[type="radio"] {
	border-radius:32px;
	border:1px solid #cccccc;
}
input[type="checkbox"] {
	border:1px solid #cccccc;
}
input[type="text"] {
	box-sizing: border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing: border-box;
}

::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	color:#dad9d9 !important;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:#dad9d9 !important;
	opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:#dad9d9 !important;
	opacity:1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color:#dad9d9 !important;
}
::-ms-input-placeholder { /* Microsoft Edge */
	color:#dad9d9 !important;
}

/* Common Components (font, button, etc)
-----------------------------*/
/*----- Button, Link -----*/
.txt-light-grey {
	color:#666;
}

.top-right a {
	color:#808080;
}

.top-right a:hover {
	color:#808080;
	text-decoration:underline;
}

.white-link a {
	padding:10px 46px 12px 46px;
	color:#272727;
}

.white-link a:hover {
	color:#272727;
	border-bottom:3px solid #b4b5b6;
}

.grey-link a {
	color:#333333;
}

.grey-link a:hover {
	color:#333333;
	text-decoration:underline;
}

button {
	cursor:pointer;
}

.txt-brown {
	color:#666;
}

.refresh-btn-pc, .refresh-btn-list {
	position:absolute;
	right:25px;
	top:187px;
}

.refresh-btn-pc button, .refresh-btn-list button {
	height:29px;
	display:inline-block;
	text-align:center;
	text-decoration:none;
	border:0 none;
	background:none;
	margin:0;
	padding:0;
	cursor:pointer;
	color:#666;
}

.refresh-btn-pc > button > span, .refresh-btn-list > button > span {
	font-size:14px;
	height:22px;
	line-height:22px;
	background:url('/images/refresh_icon.png') no-repeat left center;
	background-size:16px;
	padding-left:22px !important;
}

.refresh-btn-perform {
	display:none;
	position:absolute;
	right:30px;
	top:0px;
}

.refresh-btn-perform-layer {
	position:absolute;
	right:65px;
	top:6px;
}

.refresh-btn-perform button, .refresh-btn-perform-layer button {
	border:0 none;
	background:none;
	margin:0;
	cursor:pointer;
	color:#666;
	vertical-align:top;
}

.refresh-btn-perform > button > span, .refresh-btn-perform-layer > button > span {
	font-size:15px;
	background:url('/images/refresh_icon.png') no-repeat left center;
	background-size:16px;
	padding-left:22px !important;
}

.white-btn {
	padding:15px 80px;
	border:1px solid #999;
	/*border:1px solid #d9d9d9;*/
	font-weight:bold;
	font-size:15px;
	color:#333333;
	background-color:#ffffff;
	border-radius:5px;
}

.white-btn-pop {
	width:95%;
	height:50px;
	border:1px solid #413539;
	font-weight:bold;
	font-size:16px;
	color:#fff;
	background-color:#413539;
}

.white-btn-pop-n {
	width:48%;
	height:50px;
	border:1px solid #999;
	font-weight:bold;
	font-size:16px;
	color:#333333;
	background-color:#ffffff;
}

.white-btn-pop-y {
	width:48%;
	height:50px;
	border:1px solid #413539;
	font-weight:bold;
	font-size:16px;
	color:#fff;
	background-color:#413539;
}

.white-btn-refresh {
	display:none;
	padding:15px 80px;
	border:1px solid #999;
	/*border:1px solid #d9d9d9;*/
	font-weight:bold;
	font-size:15px;
	color:#333333;
	background-color:#ffffff;
	border-radius:5px;
}

.white-btn-refresh > span {
	background:url('/images/refresh_icon.png') no-repeat 2px 1px;
	padding-left:22px !important;
	background-size:16px;
}

.more-btn {
	width:100%;
	padding:15px 80px;
	border:1px solid #999;
	font-weight:bold;
	font-size:16px;
	color:#333333;
	background-color:#ffffff;
}

.white-btn:hover, .white-btn-refresh:hover, .more-btn:hover {
	-webkit-box-shadow:1px 1px 3px 1px rgba(0,0,0,.1);
	box-shadow:1px 1px 3px 1px rgba(0,0,0,.1);
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;  
	border-top: 5px solid #695b50;
	float:right;
	margin-top:5px;
}

.arrow-left {
	width: 0; 
	height: 0; 
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;  
	border-right:5px solid #695b50;
	float:right;
	margin:4px 3px 0 0;
}

.arrow-right {
	width: 0; 
	height: 0; 
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;  
	border-left:5px solid #695b50;
	float:right;
	margin:4px 3px 0 0;
}

.ellipsis {
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

.hide-text {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}

.hide-content {
	display:inline-block;
	text-indent:-9999%;
}

.w300 {
	width:300px;
}

.w225 {
	width:225px;
}

.w150 {
	width:150px !important;
}

.w100 {
	width:100px;
}

.w70 {
	width:70px;
}

.ht15 {
	height:15px !important;
	line-height:15px !important;
}

.ht10 {
	height:10px !important;
	line-height:10px !important;
}

.mt70 {
	margin-top:70px !important;
}

.mt20 {
	margin-top:20px !important;
}

.mt7 {
	margin-top:7px !important;
}

.ml22 {
	margin-left:22px !important;
}

.ml0 {
	margin-left:0px !important;
}

.pt120 {
	padding-top:120px !important;
}

.pt80 {
	padding-top:80px !important;
}

.pt70 {
	padding-top:70px !important;
}

.pt60 {
	padding-top:60px !important;
}

.pt40 {
	padding-top:40px !important;
}

.pt20 {
	padding-top:20px !important;
}

.pl10 {
	padding-left:10px !important;
}

.pl20 {
	padding-left:20px !important;
}

.pb120 {
	padding-bottom:120px !important;
}

.pb80 {
	padding-bottom:80px !important;
}

.pb70 {
	padding-bottom:70px !important;
}

.pb40 {
	padding-bottom:40px !important;
}

.pb20 {
	padding-bottom:20px !important;
}

.flt { 
	float:left;
}

.frt { 
	float:right;
}

.wdt20 {
	width:20% !important;
}

.wdt25 {
	width:25% !important;
}

.ft20 {
	font-size:20px !important;
}

.ft11 {
	font-size:11px !important;
}

.font-15 {
	font-size:15px !important;
}

.font-14 {
	font-size:14px !important;
}

.ft-weight {
	font-weight:bold;
}

.txt-left {
	text-align:left;
}

.txt-center {
	text-align:center;
}

.txt-right {
	text-align:right;
}

.title-right-txt {
	position:absolute;
	bottom:0px;
	right:0px;
}

.letter-spc-0 {
	letter-spacing:0
}

.pointer {
	cursor:pointer;
}

.pointer-default {
	cursor:default !important;
}

/*----- Select, Input, Textarea -----*/
input[type=radio] {
	vertical-align:middle;
}

.selectbox {
	position: relative;
	width: 31.9%;
	margin-right: 2%;
	border: 1px solid #999;
	z-index: 1;
}

#selectbox-right {
	float:right;
	margin-right:0.3%;
}

.selectbox:before {
	content: "";
	position: absolute;
	top: 50%;
	right: 15px;
	width: 0;
	height: 0;
	margin-top: -1px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #333;
}

.selectbox label {
	position: absolute;
	left: 5px;
	padding: .8em .5em .7em .5em;
	color: #666;
	z-index: -1;
	max-width:92%;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
}

.selectbox select {
	width: 100%;
	height: auto;
	line-height: normal;
	font-family: inherit;
	padding: .8em .5em;
	border: 0;
	opacity: 0;
	filter:alpha(opacity=0);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.selectbox-sub {
	float:right;
	position: relative;
	width: 35%;
	border: 1px solid #999;
	z-index: 1;
	background-color:#ffffff;
}

.selectbox-sub:before {
	content: "";
	position: absolute;
	top: 50%;
	right: 15px;
	width: 0;
	height: 0;
	margin-top: -1px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid #333;
}

.selectbox-sub label {
	position: absolute;
	/*top: 1px;*/
	left: 5px;
	padding: .5em .5em;
	color: #695b50;
	z-index: -1;
}

.selectbox-sub select {
	width: 100%;
	height: auto;
	line-height: normal;
	font-family: inherit;
	padding: .5em .5em;
	border: 0;
	opacity: 0;
	filter:alpha(opacity=0);
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

/* ie7에서 적용할 예정
.selectbox {
	position: relative;
	width: 200px;
	height: 40px;
	line-height: 40px;
	background: url(https://farm1.staticflickr.com/379/19928272501_4ef877c265_t.jpg)
	no-repeat 95% 50%;
	border: 1px solid #999;
	z-index: 1;
}

.selectbox label {
	position: absolute;
	top: 0px;
	left: 5px;
	height: 40px;
	line-height: 40px;
	color: #999;
	z-index: -1;
}

.selectbox select {
	width: 100%;
	height: 40px;
	line-height: 40px;
	font-family: inherit;
	border: 0;
	opacity: 0;
	filter:alpha(opacity=0);
	-webkit-appearance: none; 
	-moz-appearance: none; appearance: none; 
}
*/

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	filter:alpha(opacity=30);
	-moz-opacity:0.3;
	opacity : 0.3;
	background: url(/images/ajax-loader.gif) 50% 50% no-repeat rgb(0,0,0);
}

/*----- 팝업스타일 ------ */
.popup-st-small {
	width:450px;
	margin:0 auto;
	border:1px solid #695b50;
	background-color:#ffffff;
}

#popup-st {
	margin:0 auto;
	width:100%;
}

.pop-tlt {
	padding:30px 0;
	color:#111211;
	text-align:center;
	background: url(/images/Template_Cars/pop_alert.png) 50% 50% no-repeat;
	background-size:32px;
	/*background-color:#50515b;*/
}

.pop-cancel {
	cursor:pointer;
	float:right;
	margin:-16px 10px 0 0;
	background:url(/images/Template_Cars/pop_cancel.png) 100% 100% no-repeat;
	background-size:32px;
	height:32px;
	width:32px;
}

.pop-con {
	padding:30px 20px;
}

.pop-con p {
	text-align:center;
	color:#111211;
}

.pop-btn-area {
	background-color:#f7f7f7;
}

.pop-btn {
	padding:10px 0;
	text-align:center;
}

/*----- Numbering ------ */
.paginationArea {
	clear:both;
	text-align:center;
	width:100%;
	padding:0;
}

.paginationArea .pagination li {
	float:left;
	list-style-type: none;
	margin-right:4px;
}

.pagination-pc {
	display:block;
}

.pagination-mobile {
	display:none;
}

.pagination {
	display:inline-block;
	padding-left:0px;
	margin:20px 0;
}

.pagination>li{
	display:inline;
}

.pagination>li>a,.pagination>li>span{
	position:relative;
	float:left;
	padding:5px 12px;
	margin-left:-1px;
	line-height:1.42857143;
	color:#272727;
	text-decoration:none;
	background-color:#fff;
	border:1px solid #ddd;
}

.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover{
	color:#272727;
	background-color:#eee;
	border-color:#ddd;
}

.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover{
	z-index:2;color:#fff;
	cursor:default;
	background-color:#9d948d;
	border-color:#9d948d;
}

.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover{
	color:#272727;
	cursor:not-allowed;
}

/* Common Media Queries
------------------------------------------------------------------------*/
/*********************************************** Media Query 1024px START *********************************/
@media screen and (max-width:1024px) and (orientation : landscape) {
	.white-btn-refresh {
		display:block;
		float:left;
		width:20%;
		border-radius:0;
		padding:15px 0;
		border-right:none;
	}
	
	.white-btn {
		width:79.8%;
		border-radius:0;
		padding:15px 0;
		float:left;
	}

	.refresh-btn-pc {
		display:none;
	}

	.refresh-btn-list {
		position:relative;
		right:0;
		top:0 !important;
		text-align:right;
	}

	.refresh-btn-perform {
		right:22px;
		top:-2px;
	}

	.refresh-btn-perform-layer {
		right:10px;
		top:5px;
	}

	.refresh-btn-perform > button > span, .refresh-btn-perform-layer > button > span {
		font-size:12px;
		background-size:13px;
		padding-left:17px !important;
	}

	#selectbox-right {
		margin-right:0.2%;
	}

	.more-btn {
		padding:13px 80px;
		font-size:14px;
	}

	/*
	.loader {
		background: url(/images/ajax-loader-m.gif) 50% 50% no-repeat rgb(249,249,249);
	}
	*/
}

@media screen and (max-width:1024px) and (orientation : portrait) {
	.white-btn-refresh {
		display:block;
		float:left;
		width:20%;
		border-radius:0;
		padding:15px 0;
		border-right:none;
	}
	
	.white-btn {
		width:79.8%;
		border-radius:0;
		padding:15px 0;
		float:left;
	}

	.refresh-btn-pc {
		display:none;
	}

	.refresh-btn-list {
		position:relative;
		right:0;
		top:0 !important;
		text-align:right;
	}

	.refresh-btn-perform {
		right:22px;
		top:-2px;
	}

	.refresh-btn-perform-layer {
		right:10px;
		top:5px;
	}

	.refresh-btn-perform > button > span, .refresh-btn-perform-layer > button > span {
		font-size:12px;
		background-size:13px;
		padding-left:17px !important;
	}

	#selectbox-right {
		margin-right:0.2%;
	}

	.more-btn {
		padding:13px 80px;
		font-size:14px;
	}

	/*
	.loader {
		background: url(/images/ajax-loader-m.gif) 50% 50% no-repeat rgb(249,249,249);
	}
	*/
}
/*********************************************** Media Query 1024px END ***********************************/

/*********************************************** Media Query 768px START *********************************/
@media screen and (max-width:768px) and (orientation : landscape) {
	.selectbox-sub {
		width: 50%;
	}

	.pop-btn {
		padding:5px 0;
	}

	.white-btn-pop-n {
		height:40px;
	}

	.white-btn-pop-y {
		height:40px;
	}

	/*----- 팝업스타일 -----*/
	.popup-st-small {
		width:300px;
	}
}

@media screen and (max-width:768px) and (orientation : portrait) {
	.selectbox-sub {
		width: 50%;
	}

	.pop-btn {
		padding:5px 0;
	}

	.white-btn-pop-n {
		height:40px;
	}

	.white-btn-pop-y {
		height:40px;
	}

	/*----- 팝업스타일 -----*/
	.popup-st-small {
		width:300px;
	}
}
/*********************************************** Media Query 768px END *********************************/

/*********************************************** Media Query 630px START *********************************/
@media screen and (max-width:630px) and (orientation : landscape) {
	.pagination-pc {
		display:none;
	}

	.pagination-mobile {
		display:block;
	}
}

@media screen and (max-width:630px) and (orientation : portrait) {
	.pagination-pc {
		display:none;
	}

	.pagination-mobile {
		display:block;
	}
}
/*********************************************** Media Query 630px END *********************************/

/*********************************************** Media Query 587px START *******************************/
@media screen and (max-width:587px) and (orientation : landscape) {
	.white-btn-refresh {
		width:30%;
	}
	
	.white-btn {
		width:69.5%;
	}

	.selectbox-sub {
		width: 65%;
	}

	.selectbox-sub label {
		padding: .4em .5em;
	}

	#selectbox-right {
		margin-right:0.5%;
	}

	.more-btn {
		padding:11px 80px;
		font-size:13px;
	}
}

@media screen and (max-width:587px) and (orientation : portrait) {
	.white-btn-refresh {
		width:30%;
	}
	
	.white-btn {
		width:69.5%;
	}

	.selectbox-sub {
		width: 65%;
	}

	.selectbox-sub label {
		padding: .4em .5em;
	}

	#selectbox-right {
		margin-right:0.5%;
	}

	.more-btn {
		padding:11px 80px;
		font-size:13px;
	}
}

@media screen and (max-width:422px) and (orientation : landscape) {
	.selectbox-sub {
		width: 70%;
	}
}

@media screen and (max-width:422px) and (orientation : portrait) {
	.selectbox-sub {
		width: 70%;
	}
}
/*********************************************** Media Query 587px END *********************************/