@charset "UTF-8";

.contWrap {
	position:absolute;
	max-width:1400px;
	width:100%;
	top:0;
	height:30px;
	left:50%;
	transform:translateX(-50%);
	margin:0 auto;
}
.contWrap .btnHome {
	position:absolute;
	top:16px;
	right:0;
	color:#666;
	font-family:"NotoSansKr", san-serif;
	font-size:14px;
	font-weight:400;
}
.contWrap .btnHome:hover {
	text-decoration:underline;
}
.popBtnBox {
	position:relative;
	max-width:1400px;
	width:100%;
	margin:0 auto -30px;
}
.fareInfoPop {
	position:absolute;
	top:-230px;
	right:0;
	font-size:14px;
	color:#222;
	width:470px;
	border:1px solid #dbdbdb;
	box-shadow:10px 10px 10px rgba(0,0,0,.1);
	z-index:99;
}
.fareInfoPop dl {
	display:flex;
	border-bottom:1px dashed #dbdbdb;
}
.fareInfoPop dl:first-child {
	position:relative;
}
.fareInfoPop dl:first-child:before {
	content:"";
	position:absolute;
	left:-16px;
	top:10px;
	width:0;
	height:0;
	border-left:none;
  	border-right:16px solid #dbdbdb;
	border-top:11px solid transparent;
	border-bottom:11px solid transparent;
	z-index:1;
	display:none;
}
.fareInfoPop dl:first-child:after {
	content:"";
	position:absolute;
	left:-15px;
	top:11px;
	width:0;
	height:0;
  	border-left:none;
  	border-right:15px solid #F2F6FD;
	border-top:10px solid transparent;
	border-bottom:10px solid transparent;
	z-index:11;
	display:none;
}
.fareInfoPop dl:last-child {
	border-bottom:none;
}
.fareInfoPop dl dt {
	width:80px;
	background:#F2F6FD;
	padding:15px 0;
	text-align:center;
}
.fareInfoPop dl dd {
	width:390px;
	background:#fff;
	padding:15px 0 15px 10px;
}
.fareTabBox {
	position:relative;
	max-width:450px;
	width:100%;
	background:#8d8d8d;
	border-radius:30px;
	margin:40px auto 70px;
	display:flex;
	box-shadow:0px 16px 20px rgb(0 0 0 / 16%);
}
.fareTabBox:after {
	content:"";
	position:absolute;
	width:1px;
	height:45px;
	top:125%;
	left:50%;
	background:rgba(0,0,0,.25);
}
.fareTabBox li {
	width:33.3%;
	font-size:16px;
	font-weight:bold;
	color:#fff;
	text-align:center;
	cursor:pointer;
}
.fareTabBox li a {
	color:#fff;
	width:100%;
	height:100%;
	display:block;
	padding:15px 0;
	box-sizing:border-box;
}
.fareTabBox li:first-child {
	background:#8d8d8d;
	border-radius:30px 0 0 30px;
}
.fareTabBox li:first-child.active {
	background:#1a45dd;
	border-radius:30px;
}
.fareTabBox li:nth-child(2) {
	background:#8d8d8d;
	border-radius:0;
}
.fareTabBox li:nth-child(2).active {
	background:#1a45dd;
	border-radius:30px;
}
.fareTabBox li:last-child {
	background:#8d8d8d;
	border-radius:0 30px 30px 0;
}
.fareTabBox li:last-child.active {
	background:#1a45dd;
	border-radius:30px;
}
/*모달창 수정*/
.modal-mask {
    backdrop-filter: blur(5px);
    z-index:9999 !important;
}
.flexBox {
	display:flex;
	align-items:center;
}
.allBusModal .btnSelect {
	width:30px;
	height:30px;
	background:#7391e9;
	font-size:15px;
	color:#fff;
	line-height:30px;
	cursor:pointer;
	font-weight:bold;
}
.allBusModal .modal-container {
	max-width:800px;
	width:fit-content !important;
	overflow:hidden;
}
.allBusModal .selectedWrap {
	margin-top:5px;
}
.allBusModal .selectedWrap > div {
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:100%;
}
.allBusModal .modal-body .scrollBox {
	max-height:255px;
	overflow:hidden;
	overflow-y:auto;
}
.allBusModal .modal-body .floatBox > table,
.allBusModal .modal-body .floatBox > .markBox {
	float:left;
	min-width:300px;
	width:100%;
}
.allBusModal .modal-body .floatBox > table {
	width:48%;
	padding-right:10px;
}
.allBusModal .modal-body .floatBox table th,
.allBusModal .modal-body .floatBox table td {
	padding:12px 10px !important;
}
.allBusModal .modal-body .floatBox table th {
	position:sticky;
	top:0;
}
.allBusModal .modal-body .floatBox > .fareTable th {
	background:#215eb1;
	color:#fff;
}
.allBusModal .modal-body .floatBox > .markBox {
	width:50%;
}
.allBusModal .modal-body .floatBox > .markBox p {
	background:transparent !important;
	width:auto !important;
	text-align:left !important;
	padding:0 !important;
}
.allBusModal .modal-body .floatBox > .markBox table tr:nth-child(odd) {
	background:#f3fdf2;
}
.allBusModal .modal-body .floatBox > .markBox table th {
	background:#37a559;
}
.allBusModal .modal-body .floatBox > .markBox table .btnMarkDelete {
	position:static;
	padding:0;
}
.allBusModal .selectedLocation {
	font-size:14px;
}
.allBusModal .selectedLocation > div {
	width:100%;
	height:30px;
	border:1px solid #7391e9;
	border-right:none;
	background:#fff;
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding-left:5px;
	box-sizing:border-box;
}
.allBusModal .modal-body .fareTable {
	min-width:300px;
	font-size:14px;
}
.allBusModal .modal-body .fareTable td:first-child {
	text-align:left;
}
.allBusModal .modal-footer {
	width:100%;
	text-align:center;
}
.allBusModal .modal-footer > button {
	margin-top:10px;
	display:inline-block;
}

/*모달창 수정 끝*/
.fareWrap {
	position:relative;
	max-width:1400px;
	width:100%;
	margin:40px auto;
	font-family:'NotosansKr', sans-serif;
	font-size:14px;
	color:#222;
}
.fareWrap:after {
	content:"";
	display:block;
	clear:both;
}
.fareWrap .tabBox {
	width:100%;
	display:flex;
	border-left:1px solid #dbdbdb;
}
.fareWrap .tabBox li {
	display:flex;
	flex-direction:column;
	align-items:center;
	width:25%;
	height:70px;
	color:#adb3b3;
	background-color:#f5f6f8;
	background-position:center 40%;
	background-repeat:no-repeat;
	padding:45px 10px 10px;
	border-top:1px solid #dbdbdb;
	border-right:1px solid #dbdbdb;
	border-bottom:1px solid #dbdbdb;
	box-sizing:border-box;
	cursor:pointer;
}
.fareWrap .tabBox li.active {
	background-color:#fff;
	background-position:center 40%;
	background-repeat:no-repeat;
	color:#7391e9;
	border-top:2px solid #7391e9;
	border-bottom:1px solid #fff;
}
.fareWrap .tabBox li:nth-child(1) {
	background-image:url(/images/sp/iconGosokOff.png);
}
.fareWrap .tabBox li:nth-child(1).active {
	background-image:url(/images/sp/iconGosokOn.png);
}
.fareWrap .tabBox li:nth-child(2) {
	background-image:url(/images/sp/iconSiwaeOff.png);
}
.fareWrap .tabBox li:nth-child(2).active {
	background-image:url(/images/sp/iconSiwaeOn.png);
}
.fareWrap .tabBox li:nth-child(3) {
	background-image:url(/images/sp/iconTrainOff.png);
}
.fareWrap .tabBox li:nth-child(3).active {
	background-image:url(/images/sp/iconTrainOn.png);
}
.fareWrap .tabBox li:nth-child(4) {
	background-image:url(/images/sp/iconCarOff.png);
}
.fareWrap .tabBox li:nth-child(4).active {
	background-image:url(/images/sp/iconCarOn.png);
}
.fareWrap .tabBox li.active img.active {
	display:block;
}
.fareWrap .tabBox li.active img.disabled {
	display:none;
}
.fareWrap .tabBox li img {
	margin-bottom:0.25rem;
}
.fareWrap .tabBox li img.active {
	display:none;
}
.fareWrap .selectWrap ul:nth-child(2), .fareWrap .selectWrap ul:nth-child(3)  {
	display:none;
}
.fareWrap .selectWrap {
	border-bottom:1px solid #dbdbdb;
}
.fareWrap .selectWrap .selectBox {
	display:none;
}
.fareWrap .selectWrap .selectBox:nth-child(1) {
	display:flex;
}
.fareWrap .selectBox li .placeName {
	position:absolute;
	left:15px;
	bottom:0;
	width:70%;
	color:#2555df;
	font-size:14px;
	background:#f1f3fa;
	cursor:pointer;
	z-index:1;
}
.fareWrap .selectBox.gosok > li:not(:nth-child(4)),
.fareWrap .selectBox.bus > li:not(:nth-child(4)),
.fareWrap .selectBox.train > li:not(:nth-child(4)) {
	width:22%;
} 
.fareWrap .selectBox.gosok > li .mx-datepicker, 
.fareWrap .selectBox.bus > li .mx-datepicker, 
.fareWrap .selectBox.train > li .mx-datepicker {
	width:100%;
}
.fareWrap .selectBox.gosok, .fareWrap .selectBox.bus, .fareWrap .selectBox.train {
	max-width:1400px;
	width:100%;
	margin:60px auto;
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
}
.fareWrap .selectBox.train {
	flex-wrap:wrap;
	justify-content:flex-start;
}
.fareWrap .selectBox.train > li {
	margin-right:calc(6% / 4);
}
.fareWrap .selectBox.train > li:nth-child(6) {
	margin-right:0;
}
.fareWrap .selectBox.train > li:nth-child(2) {
	margin-top:3rem;
}
.fareWrap .selectBox.train > li .btnRefresh {
	width:80px;
	height:30px;
	background:#adb3b3;
	font-weight:bold;
	color:#fff;
	border-radius:30px;
	cursor:pointer;
}
.fareWrap .selectBox.train {
	position:relative;
}
.fareWrap .selectBox.train .btnsearchNew {
	background-image:none;
	text-indent:0;
	text-align:center;
}
.fareWrap .selectBox.train li.insertWay {
	position:absolute;
	top:-15px;
}
.fareWrap .selectBox.bus li, .fareWrap .selectBox.gosok li, .fareWrap .selectBox.train li {
	position:relative;
	width:22%;
}
.fareWrap :is(.bus, .gosok, .train) li:last-child select {
	width:100% !important;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.fareWrap .selectBox.gosok li:nth-child(4), .fareWrap .selectBox.bus li:nth-child(4), .fareWrap .selectBox.train li:nth-child(5) {
	width:6%;
}
.fareWrap .selectBox.train li.wd100 {
	width:22%;
}
.fareWrap .selectBox.gosok li input[type=date], .fareWrap .selectBox.gosok li select, .fareWrap .selectBox.gosok li .busPlace, .fareWrap .selectBox.train li .busPlace {
	position:relative;
	width:100%;
	background:#f1f3fa;
	color:#666;
	height:30px;
	padding:0 15px;
	text-align:left;
	border:none;
	border-radius:20px;
	cursor:pointer;
	box-sizing:border-box;
} 
.fareWrap .selectBox.bus li input[type=date], .fareWrap .selectBox.bus li select, .fareWrap .selectBox.bus li .busPlace, .fareWrap .selectBox.train li .busPlace {
	position:relative;
	width:100%;
	background:#f1f3fa;
	color:#666;
	height:30px;
	padding:0 15px;
	text-align:left;
	border:none;
	border-radius:20px;
	cursor:pointer;
	box-sizing:border-box;
}
.fareWrap .selectBox.car {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	padding:15px 20px;
	display:none;
}
.fareWrap .selectBox.car > li:first-child {
	width:60%;
}
.fareWrap .selectBox.car > li > ul {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin-bottom:15px;
}
.fareWrap .selectBox.car > li > ul.carOthers {
	justify-content:flex-start;
}
.fareWrap .selectBox.car > li > ul:not(.carOthers) > li {
	margin-bottom:5px;
	justify-content:space-between;
}
.fareWrap .selectBox.car > li > ul > li.flexBox > div {
	width:48%;
}
.fareWrap .selectBox.car > li > ul > li.flexBox > div .mx-datepicker,
.fareWrap .selectBox.car > li > ul > li.flexBox > div select {
	width:100% !important;
}
.fareWrap .selectBox.car > li > ul > li > div.flexBox {
	justify-content:space-between;
}
.fareWrap .selectBox.car > li > ul > li > div.flexBox > div {
	width:48%;
}
.fareWrap .selectBox.car > li > ul > li > .flexBox > div select,
.fareWrap .selectBox.car > li > ul > li > .flexBox > div input[type=text] {
	width:100% !important;
}
.fareWrap .selectBox.car > li > ul > li > div.mx-datepicker,
.fareWrap .selectBox.car > li > ul > li > select,
.fareWrap .selectBox.car > li > ul > li input[type=text] {
	width:100%; 
}
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(3),
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(4),
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(5) {
	width:48%;
}
.fareWrap .selectBox.car > li:first-child > ul > li button.busPlace {
	position:relative;
	left:0 !important;
	text-align:left;
	max-width:410px;
	width:100% !important;
	font-weight:bold;
	height:30px;
	background:#f1f3fa;
	border-radius:20px;
	box-sizing:border-box;
	padding:0 25px 0 15px;
	overflow:hidden;
	text-overflow:ellipsis;
    white-space: nowrap;
	cursor:pointer;
}
.fareWrap .selectBox.car > li:first-child > ul > li button.busPlace+div {
	display:none;
	font-weight:100;
	padding:5px 0 0 15px;
	box-sizing:border-box;
	background:#fff;
	color:#222;
}
.fareWrap .selectBox.car > li:first-child > ul > li button.busPlace:hover+div {
	display:block;
	position:absolute;
}
.fareWrap .selectBox.car > li:nth-child(2) {
	position:relative;
	width:33%;
	margin-right:0%;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul {
	display:flex;
	flex-direction:column;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li:nth-child(2) {
	margin-top:10px;
	padding:10px;
	height:61px;
	background:#f5f5f5;
	border:1px solid #dbdbdb;
	border-radius:10px;
	text-align:center;
	box-sizing:border-box;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li:nth-child(3) {
	position:absolute;
	bottom:16px;
	right:0;
} 
.fareWrap .selectBox.car > li:nth-child(2) > ul > li:nth-child(3) select {
	width:250.8px;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li .btnDistance {
	width:120px;
	height:30px;
	padding:0 10px 0 25px;
	color:#fff;
	background:url(/images/sp/iconSearch.png) no-repeat 10% center / 12% #7391e9;
	border-radius:15px;
	font-weight:bold;
	cursor:pointer;
	vertical-align:middle;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li .btnCheckbox {
	width:120px;
	height:30px;
	background:none;
	display:inline-block;
	line-height:25px;
	padding:0 0 0 5px;
	color:#444;
	border:1px solid #888;
	border-radius:15px;
	cursor:pointer;
	transition:.5s;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li .btnCheckbox input[type=checkbox] {
	width:12px;
	min-width:12px;
	height:12px;
	cursor:pointer;
	vertical-align:middle;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li .btnCheckbox label {
	display:inline-block;
	margin:0;
	cursor:pointer;
	vertical-align:middle;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li.calcDistance p {
	color:#444;
	font-size:12px;
	margin-bottom:-8px;
}
.fareWrap .selectBox.car > li:nth-child(2) > ul > li.calcDistance label {
	font-size:18px;
	font-weight:bold;
	padding-top:5px;
}
.fareWrap .selectBox.car li input {
	width:100%;
}
.fareWrap .selectBox.car li select,
.fareWrap .selectBox.car li input[type=text] {
	width:200px;
}
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(1),
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(2),
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(3) {
	width:30.33%;
	margin-bottom:20px;
}
.fareWrap .selectBox.car > li:first-child > ul > li:is(:nth-child(1), :nth-child(2), :nth-child(3)) select,
.fareWrap .selectBox.car > li:first-child > ul > li:is(:nth-child(1), :nth-child(2), :nth-child(3)) input {
	min-width:unset; 
}
.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(1) input[type=text]::placeholder {
	font-size:12px;
}
.fareWrap .selectBox.car > li:nth-child(2) {
	padding-top:25px;
}
.fareWrap .carOthersWrap {
	position:relative;
	display:block;
	width:100%;
	border-top:1px dashed #dbdbdb;
	padding-top:1.55rem;
}
.fareWrap .carOthersWrap:before {
	content:"기타비용";
	position:absolute;
	top:12px;
	left:0;
	font-size:14px;
	white-space:nowrap;
}
.fareWrap .carOthersWrap .btnPlusLineP {
	position:absolute;
	top:8px;
	left:60px;
	width:28px;
	height:28px;
	color:#888;
	font-size:20px;
	line-height:26px;
	background:#fff;
	text-align:center;
	border:1px solid #999;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.fareWrap .carOthers {
	position:relative;
	width:100%;
	display:flex !important;
	box-sizing:border-box;
	margin-bottom:5px !important; 
}
.fareWrap .carOthers > li {
	width:15%;
	margin:0.5rem 1% 0.5rem 0;
	display:flex;
	align-items:center;
	
}
.fareWrap .carOthers > li select, .fareWrap .carOthers > li input {
	position:relative;
	max-width:200px;
	width:100% !important;
	background:#f1f3fa;
	color:#666;
	height:30px;
	padding:0 15px;
	text-align:left;
	border:none;
	border-radius:20px;
	box-sizing:border-box;
}
.fareWrap .selectBox.car .carOthers > li:nth-child(3), .fareWrap .selectBox.car .carOthers > li:nth-child(6) {
	margin-right:0;
}
.fareWrap .carOthers > li .btnPlusLine {
	margin-right:0.25rem;
}
.fareWrap .selectBox li .busPlace:after {
	content:"";
	position:absolute;
	top:calc(50% - 7px);
	right:16px;
	width:14px;
	height:14px;
	background:url(/images/sp/iconPopup.png) no-repeat;
	cursor:pointer;
	z-index:99;
}
.fareWrap .selectBox li label {
	display:block;
	margin-bottom:0.25rem;
}
.fareWrap .selectBox li span.radioBox {
	display:flex;
	justify-content:space-betweeen;
	align-items:center;
	margin-bottom:10px;
}
.fareWrap .selectBox li span.radioBox > label {
	width:48%;
	cursor:pointer;
}
.fareWrap .selectBox li span.radioBox input[type=radio] {
	appearance:none;
	min-width:14px;
	width:14px;
	height:14px;
	background:#fff;
	padding:0 !important;
	border:3px solid #ccc;
	border-radius:50%; 
}
.fareWrap .selectBox li span.radioBox input[type=radio]:checked {
	border:4px solid #0090f0;
}
.fareWrap .selectBox li input, .fareWrap .selectBox li select {
	position:relative;
	width:100%;
	min-width:155px;
	background:#f1f3fa;
	color:#666;
	height:30px;
	font-size:14px;
	padding:0 10px !important;
	border:none;
	border-radius:20px;
	box-sizing:border-box;
}
.fareWrap .selectBox li input:focus, .fareWrap .selectBox li select:focus {
	border:1px solid #bbc9f2;
}
.fareWrap .calcFare {
	position:relative;
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:18px;
	font-weight:bold;
	color:#222;
	padding:20px;
	text-align:center;
	border-bottom:1px solid #dbdbdb;
}
.fareWrap .calcFare .hidden {
	visibility: hidden;
}
.fareWrap .calcFare h3 {
	font-weight:bold;
	margin-right:0.5rem;
}
.fareWrap .calcFare .bookMarkBox {
	width:180px;
}
.fareWrap .calcFare .bookmarkcheck {
	position:absolute;
	top:50%;
	left:0;
	transform:translateY(-50%);
	display:flex;
	align-items:center;
}
.fareWrap .calcFare textarea {
	border-radius:15px;
	border:1px solid #bbc9f2;
	background:#fff;
	width:150px;
	height:30px;
	font-family:'NotoSansKr', sans-serif;
	font-size:18px;
	font-weight:bold;
	color:#222;
	padding:0 10px 0 0;
	text-align:right;
	vertical-align:middle;
	outline:none;
	resize:none;
}
.fareWrap .btnRight {
	float:right;
}
.fareWrap .btnRight button:last-child {
	margin-left:0.25rem;
}
.fareWrap .btnRight .btnPlus {
	width:28px;
	height:28px;
	color:#fff;
	font-size:20px;
	line-height:28px;
	background:#7391e9;
	text-align:center;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.fareWrap .btnRight .btnDelete {
	width:28px;
	height:28px;
	background:url(/images/sp/iconDelete.png) no-repeat center center / 47% #adb3b3;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnDelete {
	width:30px;
	height:30px;
	background:url(/images/sp/iconDelete.png) no-repeat center center / 47% #adb3b3;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnPlusLine {
	width:28px;
	height:28px;
	color:#888;
	font-size:20px;
	line-height:26px;
	background:#fff;
	text-align:center;
	border:1px solid #999;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnDeleteLine {
	width:28px;
	height:28px;
	color:#888;
	background:url(/images/sp/iconDeleteL.png) no-repeat center center / 55% #fff;
	border:1px solid #999;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnDown {
	width:28px;
	height:28px;
	background:url(/images/sp/iconDown.png) no-repeat center center / 55% #215eb1;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnUpload {
	width:28px !important;
	height:28px !important;
	background:url(/images/sp/iconUpload.png) no-repeat center center / 55% #00b97a;
	display:inline-block;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnFileRegist {
	width:40px;
	height:28px;
	color:#fff;
	background:#215eb1;
	border-radius:5px;
	vertical-align:middle;
	cursor:pointer;
}
.btnFileForm {
	width:28px !important;
	height:28px !important;
	background:url(/images/sp/iconForm.png) no-repeat center center / 60% #5e7fe1;
	display:inline-block;
	border:none;
	border-radius:50%;
	cursor:pointer;
	vertical-align:middle;
}
.btnRight {
	display:flex;
	justify-content:flex-end;
	align-items:center;
	margin:10px 0;
}
.fareResultWrap .btnRight button {
	color:#fff;
	padding:5px 10px 5px 27px;
	font-size:14px;
	font-weight:bold;
	margin-right:5px;
	border-radius:10px;
	cursor:pointer;
}
.btnRight button:last-child {
	margin-right:0;
}
.btnRight .btnRegist {
	background:url(/images/sp/iconRegist.png) no-repeat 8% center / 14% #215eb1;
}
.btnRight .btnList {
	background:url(/images/sp/iconList.png) no-repeat 20% center / 23% #5e7fe1;
}
.btnRight .btnModify {
	background:url(/images/sp/iconModify.png) no-repeat 12% center / 20% #e9c121;
}
.btnRight .btnDeleteC {
	background:url(/images/sp/iconDeleteC.png) no-repeat 20% center / 23% #888888;
}
.btnRight .btnPrint {
	background:url(/images/sp/iconPrint.png) no-repeat 20% center / 23% #00b97a;
}
.btnRight .btnPdf {
	background:url(/images/sp/iconPdf.png) no-repeat 10% center / 16% #e53556;
}
.btnSearch {
	width:30px;
	height:30px;
	background:url(/images/sp/iconSearch.png) no-repeat center center / 50% #7391e9;
	border-radius:50%;
	cursor:pointer;
}
.btnsearchNew {
	max-width:80px;
	width:100%;
	height:30px;
	background:url(/images/sp/iconSearch.png) no-repeat 13% center / 23% #7391e9;
	border-radius:30px;
	border:none;
	color:#fff;
	font-size:14px;
	font-weight:bold;
	text-indent:12px;
	cursor:pointer;
}
.btnBlueLine {
	width:60px;
	height:30px;
	background:transparent;
	border:1px solid #7391e9;
	color:#7391e9;
	font-size:14px;
	font-weight:bold;
	cursor:pointer;
}
.btnInfo {
	width:30px;
	height:30px;
	border:none;
	border-radius:50%;
	background:#adb3b3;
	color:#fff;
	font-size:18px;
	font-weight:bold;
	cursor:pointer;
}
.btnReturn {
	position:relative;
	width:60px;
	height:30px;
	background:#00b87c;
	color:#fff;
	border-radius:15px;
	vertical-align:middle;
	font-weight:bold;
	margin-right:0.25rem;
	cursor:pointer;
}
.btnReturn:before {
	content:"“왕복 노선의 거리는 차이가 있을 수 있습니다.” ";
	position:absolute;
	top:40px;
	left:0;
	padding:10px;
	color:#444;
	font-size:12px; 
	white-space:nowrap;
	background:#fff;
	border:1px solid #dbdbdb;
	box-shadow:0 3px 5px rgba(0,0,0,.15);
	opacity:0;
	transition:.3s;
}
.btnReturn:hover:before {
	opacity:1;
}
.btnSubmit {
	max-width:180px;
	width:100%;
	display:block;
	margin:30px auto 30px;
	color:#fff;
	font-size:18px;
	font-weight:bold;
	background:linear-gradient(90deg, rgba(26,69,221,1) 0%, rgba(84,153,235,1) 46%, rgba(57,189,223,1) 78%);
	padding:10px 25px;
	border:none;
	border-radius:50px;
	box-sizing:border-box;
	box-shadow: 0px 16px 20px rgb(0 0 0 / 16%);
	cursor:pointer;
}
.menualPop {
	width:60px;
	height:30px;
	background:#00b87c;
	color:#fff;
	border-radius:15px;
	vertical-align:middle;
	font-weight:bold;
	margin-right:0.25rem;
	cursor:pointer;
}
.menualPop:nth-child(2) {
	width: 70px;
	background: gold;
}
.btnUtil {
	max-width:800px;
	width:100%;
	margin:30px auto;
	display:flex;
	justify-content:flex-end;
}
.btnUtil .btnPrint {
	color:#fff;
	width:90px;
	height:30px;
	padding-left:25px;
	font-size:14px;
	font-weight:bold;
	border-radius:10px;
	cursor:pointer;
	background:url(/images/sp/iconPrint.png) no-repeat 26% center / 20% #00b97a;
}
.btnUtil .btnPdf {
	color:#fff;
	width:90px;
	height:30px;
	padding-left:25px;
	font-size:14px;
	font-weight:bold;
	border-radius:10px;
	cursor:pointer;
	margin-left:0.25rem;
	background:url(/images/sp/iconPdf.png) no-repeat 10% center / 15% #e53556;
}
.fareWrap select {
	background:url(/images/sp/iconDownArrow.png) no-repeat 90% center, #f1f3fa !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;        
}
.fareTable{
	text-align:center;
}
.fareTable thead {
	position:relative;
	box-shadow:0 4px 3px rgba(0,0,0,0.12);
}
/* .fareTable thead:before {
	content:"";
	position:absolute;
	top:0;
	left:-20px;
	width:20px;
	height:100%;
	background:#215eb1;
	border-radius:100px 0 0 100px;
}
.fareTable thead:after {
	content:"";
	position:absolute;
	top:0;
	right:-20px;
	width:20px;
	height:100%;
	background:#215eb1;
	border-radius:0 100px 100px 0;
} */
.fareTable thead tr {
	background:#215eb1;
}

.fareTable thead th {
	color:#fff;
	padding:15px 10px;
}
.fareTable tbody td {
	color:#222;
	padding:15px 10px;
	vertical-align:middle;
}
.fareTable tbody tr:nth-child(odd) {
	background:#f2f6fd;
}
.fareTable tbody td h4 {
	color:#fff;
	font-size:14px;
	background:linear-gradient(to bottom, #7391e9 50%, #5e7fe1 50%);
	padding:5px 10px;
	border-radius:20px;
}
.fareTable tbody td p {
	color:#222;
	font-weight:bold;
	padding-bottom:3px;
}
.fareTable tbody td span {
	display:block;
	color:#888;
	font-weight:100;
	font-size:12px;
}
.fareTable tfoot td {
	font-size:16px;
	font-weight:bold;
	color:#222;
	padding:20px 10px;
	border-top:1px solid #dbdbdb;
	border-bottom:1px solid #dbdbdb;
}
.fareTable tfoot td b {
	padding:2px 10px;
	border:2px solid #e53556;
}
.fareResultWrap {
	position:relative;
	max-width:1400px;
	width:100%;
	margin:40px auto;
	font-family:'NotosansKr', sans-serif;
	font-size:14px;
	color:#222;
}
.fareResultWrap .btnHome {
	position:absolute;
	top:-140px;
	right:0;
	color:#666;
}
.fareResultWrap .btnHome:hover {
	text-decoration:underline;
}
.fareResultWrap input, .fareResultWrap select {
	height:30px;
	border:1px solid #dbdbdb;
	border-radius:5px; 
}
.fareResultWrap .fileUploadBox {
	display:flex;
	align-items:center;
	padding-top:10px;
	margin-bottom:10px;
}.fareResultWrap > .resultTable > .fileUploadBox {
	justify-content:flex-end;
}
.fareResultWrap .fileUploadBox input {
	margin:0 5px;
}
.fareResultWrap h3 {
	font-size:24px;
	text-align:center;
}
.fareResultWrap h3:after {
	content:"";
	display:block;
	width:1px;
	height:40px;
	background:rgba(0,0,0,.4);
	margin:10px auto 10px;
}
.fareResultWrap table {
	max-width:1400px;
	width:100%;
	margin:0 auto;
}
.descTableWrap {
	max-width:800px;
	width:100%;
	margin:100px auto 0;
}
.descTableWrap .descTable {
	font-size:14px;
	text-align:left;
	border-top:1px solid #dbdbdb;
	border-bottom:1px solid #dbdbdb;
	background:#fafafa;
}
.descTableWrap .descTable tr {
	border-bottom:1px dashed #dbdbdb;
}
.descTableWrap .descTable th {
	padding:10px 15px;
	text-align:center;
	vertical-align:middle;
}
.descTableWrap .descTable th span{
	display:block;
	color:#888;
	font-weight:100;
	margin-top:5px;
}
.descTableWrap .descTable td {
	padding:10px 15px;
	font-weight:100;
	color:#999;
}
.descTableWrap .descTable td p {
	margin-bottom:5px;
}
.descTableWrap .descTable td p:before {
	content:"";
	display:inline-block;
	width:2px;
	height:2px;
	background:#666;
	margin:0 5px 4px 0;
}
#paging > div {
	display:flex;
	justify-content:center;
	align-items:center;
	margin:20px auto;
	width:min-content;
	background:#f5f5f5;
	border-radius:30px;
}
#paging strong {
	color:#fff;
	width:30px;
	height:30px;
	background:#215eb1;
	border-radius:50%;
	text-align:center;
	line-height:29px;
	display:block;
	z-index:999;
}
#paging a {
	width:30px;
	height:30px;
	color:#666;
	text-align:center;
	line-height:29px;
	display:block;
	cursor:pointer;
}
#paging a:hover {
	background:rgba(33,94,177,.1);
	border-radius:50%;
}
#paging .btnArrow {
	position:relative;
	transform:scaleX(0.6);
	font-size:18px;
	/* width:30px;
	height:30px;
	background:#fff;
	border:1px solid #666;
	border-radius:50%;
	line-height:26px; */
}
#paging .btnArrow:before {
	content:"";
	position:absolute;
	top:0;
	left:0;
	width:30px;
	height:30px;
	border:1px solid #888;
	border-radius:50%;
	transform:scaleX(1.6);
}
#paging .btnArrow:hover {
	background:transparent;
}
/*
#paging [class*=btnArrow] {
	position:relative;
	font-size:0;
}
#paging .btnFirst:before {
	content:"\226A";
	position:absolute;
	top:calc(50% - 12px);
	left:5px;
	transform:scaleX(0.6);
	font-size:20px;
}
#paging .btnNext:before {
	content:"\003E";
	position:absolute;
	top:calc(50% - 15px);
	left:7px;
	transform:scaleX(0.6);
	font-size:22px;
}
#paging .btnPrev:before {
	content:"\003C";
	position:absolute;
	top:calc(50% - 16px);
	left:6px;
	transform:scaleX(0.6);
	font-size:22px;
}
#paging .btnLast:before {
	content:"\226B";
	position:absolute;
	top:calc(50% - 13px);
	left:4px;
	transform:scaleX(0.6);
	font-size:20px;
} */
.selected {
	position:absolute;
	top:55%;
	left:10px;
	font-size:13.3px;
	font-weight:100;
	color:#666;
	
}
.modal-header .btnSearch {
  position:relative;
  z-index:9999;
}
/* --------------------- 관리자페이지 --------------------- */
.adminPage {
	/* background:#fafafa; */
	height:100%;
}
.adminPage input, .adminPage select {
	height:30px;
	border:1px solid #dbdbdb;
	border-radius:5px;
}
.adminBoxWrap {
	position:relative;
	max-width:1200px;
	width:100%;
	margin:0 auto;
	padding-top:40px;
}
.adminBoxWrap .btnHome {
	position:absolute;
	top:10px;
	right:0;
}
.adminBoxWrap .btnHome:hover {
	text-decoration:underline;
}
.adminBoxWrap h2 {
	position:relative;
	font-size:18px;
	font-weight:bold;
	color:#222;
	padding-bottom:10px;
	display:inline-block;
}
.adminBoxWrap h2:before {
	content:"";
	position:absolute;
	bottom:8px;
	width:100%;
	height:10px;
	background:#ffdc4f;
	z-index:-1;
}
.adminBoxWrap .noUpdate {
	width:100%;
	margin:20px auto;
	background:#fafafa;
	padding:15px;
	border-radius:15px;
}
.adminBoxWrap .noUpdate h3 {
	font-size:14px;
	font-weight:bold;
	color:#666;
	padding-bottom:10px;
}
.adminBoxWrap .noUpdate > .flexBox {
	flex-wrap:wrap;
	gap:6px 10px;
}
.adminBoxWrap .noUpdate > .flexBox ul li {
	font-size:14px;
	color:#888;
}
.adminBox {
	position:relative;
	background:#fff;
	padding:20px;
	border:1px solid #dbdbdb;
	border-radius:15px;
}

.adminBox .flexBetween {
	display:flex;
	justify-content:space-between;
}
.adminBox h3 {
	font-size:18px;
	font-weight:bold;
	color:#222;
	padding:10px 0 10px;
}
.adminBox h3:before {
	content:"";
    display:block;
    width:10px;
    height:10px;
    background:#215eb1;
    border-radius:50%;
    margin:0 0 0.35rem 0.35rem;
}
.adminBox .fileList {
	width:100%;
	text-align:center;
}
.adminBox .fileList thead th {
	background:#215eb1;
	color:#fff;
	padding:12px 0;
}
.adminBox .fileList tbody tr:nth-child(even) {
	background:#f2f6fd;

}
.adminBox .fileList tbody td {
	padding:12px 0;
	font-size:14px;
}
.adminBox input[type=file] {
	position:absolute;
	left:-9999px;
	font-size:0;
}
.adminBox .fileUploadBox {
	display:flex;
	align-items:center;
	gap:0 5px;
	padding-top:10px;
	margin-bottom:10px;
	border-top:1px solid #dbdbdb;
}
.adminBox .fileUploadBox .btnSearch {
	margin:0 5px;
}
.adminBox p.fileName {
	min-width:225px;
	font-size:14px;
	margin:0 10px 0 15px;
	padding:5px 10px;
	background:#f5f5f5;
	border-radius:5px;
}
.adminBox .fileForamBox {
	display:flex;
	align-items:center;
	gap:0 5px;
}
.adminBox .fileForamBox a {
	min-width:225px;
	font-size:14px;
	margin-left:15px;
	padding:5px 10px;
	background:#f5f5f5;
	border-radius:5px;
}
.adminBox .btnPlusLine {
	border:1px solid #fff;
	color:#215eb1;
	background:#fff;
}
.adminBox .btnModify {
	width:30px;
	height:30px;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    vertical-align: middle;
	background:url(/images/sp/iconModify.png) no-repeat center center / 50% #e9c121;
}
.adminBox .btnSave {
	width:50px;
	height:30px;
	color:#fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    vertical-align: middle;
	background:#00b97a;;
}

/*오류신고 관리자*/
.modal-body .adminBoxWrap {
	max-width:600px;
	width:100%;
}
.erroAdminDetail .adminBox {
	margin-top:30px;
	background:#fff;
	border:none;
}
.erroAdminDetail .flexBox {
	align-items:flex-start;
}
.erroAdminDetail .flexBox h3 {
	padding-top:0;
	width:220px;
}
.errorFareDetailBoxWrap.list {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;

}
.errorFareDetailBoxWrap.list .errorFareDetailBox {
	display:flex;
	align-items:center;
	margin-bottom:8px;
	width:48%;
	height:50px;
	background:#fff;
	padding:0 10px;
	border:1px solid #dbdbdb;
	border-radius:5px;
}
.errorFareDetailBoxWrap.list h4 {
	width:110px;
	font-size:14px;
	font-weight:bold;
	color:#666;
}
.errorFareDetailBoxWrap.list h4+div {
	font-size:14px;
	font-weight:bold;
	color:#222;
}
.errorFareDetail {
	width:100%;
	margin:0 auto;
}
.errorFareDetailBoxWrap.txt {
	margin-top:20px;
}
.errorFareDetailBoxWrap.txt textarea {
	width:100%;
	min-height:250px;
	padding:10px;
	outline:0;
	border:1px solid #dbdbdb;
	border-radius:10px;
	resize:none;
}

/* -------------------- 관리자페이지 끝 -------------------- */

/*로딩 스피너*/
.loading {
  position:fixed;
  top:calc(50% - 25px);
  left:calc(50% - 25px);
  display: inline-block;
  width: 50px;
  height: 50px;
  border: 3px solid rgba(255,255,255,.3);
  border-radius: 50%;
  border-top-color: #fff;
  animation: spin 1s ease-in-out infinite;
  -webkit-animation: spin 1s ease-in-out infinite;
  z-index:999999;
}
.mask {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: none;
  z-index: 99999; 
}
@keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
  to { -webkit-transform: rotate(360deg); }
}


@media only print {
  #btnRight {display:none;}
  html, body { height: auto; } /* 빈페이지 한장 더 출력되는 문제 */
}


/* 오류신고 모달 */
#errorModal .modal-container {
	max-width:800px;
	width: 100%;
	font-family:'NotoSansKr'
}
#errorModal .modal-container select {
	border-radius:5px;
	border:1px solid #ccc;
}
#errorModal .modal-header .categoryBox {
	width:100%;
}
#errorModal .modal-header .categoryBox .checkbox {
	height: 50px;
	margin-bottom: 10px;
}
#errorModal .modal-header .categoryBox .checkbox>input[type=checkbox] {
	width: 30px !important;
	margin-right: 10px;
}
#errorModal .modal-header .categoryBox .responseInfo .screen {
	height: 30px;
	margin-bottom: 10px;
}
#errorModal .modal-header .categoryBox .responseInfo .section1 {
	width: 34%;
	margin-right: 1%;
	float: left;
}
#errorModal .modal-header .categoryBox .responseInfo .section1 .label1 {
	width: 30%;
	float: left;
}
#errorModal .modal-header .categoryBox .responseInfo .section1 .input1 {
	width: 70%;
	float: left;
}
#errorModal .modal-header .categoryBox .responseInfo .section2 {
	width: 65%;
	float: left;
}
#errorModal .modal-header .categoryBox .responseInfo .section2 .label2 {
	width: 20%;
	float: left;
}
#errorModal .modal-header .categoryBox .responseInfo .section2 .input2 {
	width: 80%;
	float: left;
}
#errorModal .modal-header .categoryBox select {
	width:100%;
	border:none;
	border-bottom:1px solid #ccc;
	border-radius:0;
	padding:0;
}
#errorModal .modal-header .selectBoxErrorWrap {
	display:flex;
}
#errorModal .modal-header .selectBoxErrorWrap .selectBoxError {
	position:relative;
	display:flex;
	justify-content:flex-end;
	width:fit-content;
	white-space:pre;
	margin-left:35px;
}
#errorModal .modal-header .selectBoxErrorWrap .selectBoxError:before {
	content:"";
	position:absolute;
	top:50%;
	left:-10px;
	transform:translatey(-50%);
	width:5px;
	height:5px;
	border-radius:50%;
	background:#dbdbdb;
}
#errorModal .modal-header .selectBoxErrorWrap .selectBoxError .errorSpan span {
	font-size:14px;
	font-weight:bold;
	margin-right:5px;
}
#errorModal .modal-header .selectBoxErrorWrap .selectBoxError .errorSelect span {
	font-size:14px;
}
#errorModal .selectBoxError .selectBoxErrorWrap .errorSelect select {
	width: 100%;
	height: 30px;
	padding-left: 10px;
	border: 1px solid #ccc;
	background: url(/images/sp/iconDownArrow.png) no-repeat 97% center;
	appearance:none;
}
#errorModal .modal-body #content {
	width: 100%;
	height: 230px;
	margin: 0 auto;
}
#errorModal .modal-body #content textarea {
	width: 100%;
	height: 225px;
	padding:10px;
	outline:0;
	border:1px solid #ccc;
	resize:none;
	border-radius:5px;
}
#errorModal .modal-footer .errorBtn {
	width: 100%;
	height: 30px;
}
#errorModal .modal-footer .errorBtn .btnConfirm {
	height: 100%;
	float: left;
}
#errorDetailModal .modal-mask {
	width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
	position: fixed;
	top: 0;
    left: 0;
    z-index: 998;
    display: table;
    transition: opacity .3s ease;
}
#errorDetailModal .errorBtn .btnConfirm {
	height: 30px;
	margin: 10px auto 0;
	padding: 0 15px;
	border-radius: 20px;
	background: #7391e9;
	color: #fff;
	font-weight: bold;
	display: block;
	cursor: pointer;
}
.errorPop .checkbox input[type=checkbox],
#errorModal .modal-header .categoryBox .checkbox>input[type=checkbox] {
	width:14px !important;
	margin-right:0;
}
.errorPop .checkbox #errorReply {
	appearance:none;
	width:0;
	height:0;
	margin:0;
	padding:0;
}
.errorPop .checkbox label {
	position:relative;
	display:block;
	width:100%;
	margin-bottom:10px;
	padding-bottom:5px;
	font-size:14px;
	border-bottom:1px solid #dbdbdb;
	cursor:pointer;
}
.errorPop .checkbox label:before {
	content:"ON";
	position:absolute;
	right:50px;
	color:#cbcbcb;
	font-family:'GmarketSans';
	font-size:14px;
	font-weight:bold;
}
.errorPop .checkbox label:after {
	content:"OFF";
	position:absolute;
	right:0;
	color:#7391e9;
	font-family:'GmarketSans';
	font-size:14px;
	font-weight:bold;
}
.errorPop .checkbox #errorReply:checked+label:before {
	color:#7391e9;
}
.errorPop .checkbox #errorReply:checked+label:after {
	color:#cbcbcb;
}
.errorPop .responseInfo .screen,
.errorPop .responseInfo .screen+div {
	display:flex;
	align-items:center;
}
.errorPop .responseInfo div[class*=label] {
	font-size:14px;
	width:46px !important;
}
.errorPop .responseInfo div[class*=label]+div {
	width:calc(100% - 50px) !important;
}
.errorPop .responseInfo+select {
	margin-top:20px;
}
.errorPop .errorBtn.flexBox {
	justify-content:center;
	gap:0 5px;
}
.errorPop .errorBtn.flexBox button {
	margin:0 !important;
}
.errorPop .modal-container {
	max-width:500px;
	width:100%;
}
/*****************************************올담 대민 사이트용*****************************************/
/*최상단 배너*/
.maskPublic {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: none;
  z-index: 999;
}
.topBanner {
	max-width:720px;
	width:100%;
	height:180px;
	margin:40px auto;
	display:flex;
	gap:0 20px;
	justify-content:center
}
.topBanner > div:not(.popMedia) {
	width:50%;
}
.topBanner > .leftBanner {
	width:350px;
	height:180px;
	overflow:hidden;
}
.topBanner > .leftBanner > a {
	width:100%;
	height:100%;
	display:block;
}
.topBanner > .leftBanner > a img {
	width:350px;
	height:180px;
	transition:.5s;
}
.topBanner > .leftBanner:hover > a img {
	transform:scale(1.1);
}
.topBanner > .rightMedia {
	position:relative;
}
.topBanner > .rightMedia:before {
	content:"";
	position:absolute;
	top:calc(50% - 20px);
	left:calc(50% - 30px);
	width:60px;
	height:40px;
	background:rgba(0,0,0,.6);
	border-radius:10px;
	transition:.15s;
	cursor:pointer;
}
.topBanner > .rightMedia:after {
	content:"\2023";
	position:absolute;
	top:15%;
	left:46%;
	transform:scaleY(0.6);
	font-size:80px;
	color:#fff;
	cursor:pointer;
}
.topBanner > .rightMedia:hover:before {
	background:#d93025;
}
.topBanner > .rightMedia img {
	width:350px;
	height:180px;
	object-fit:cover;
	object-position:center top;
	cursor:pointer;
}
.popMedia {
	position:fixed;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:560px;
	height:315px;
	z-index:9999;
	display:none;
}
.popMedia .popCls {
	position:absolute;
	right:0;
	top:-66px;
	font-size:60px;
	font-weight:100;
	color:#fff;
	cursor:pointer;
}
.publicFareTabBox li {
	position:relative;
	z-index:1;
}
.publicFareTabBox li.active {
	background:#0090f0 !important;
	box-shadow:0 0 5px rgba(0,0,0,.3);
	z-index:99;
}
/* .publicFare .topAlign {
	padding-top:24px;
	margin-bottom:15px !important; 
} */
.publicFare.popBtnBox {
	display:flex;
	justify-content:space-between;
	align-items:center;
	margin-bottom:-40px;
}
.publicFare .menualPop {
	background:#005399;
}
.publicFare .menualPop:nth-child(2) {
	background:#adb3b3 !important;
}
.publicFare .sns {
	display:flex;
	gap:0 5px;
}
.publicFare .sns li a {
	display:inline-block;
	width:30px;
	height:30px;
	background:url(/images/sp/sns_facebook.svg) no-repeat center center / cover;
}
.publicFare .sns li.twitter a {
	background:url(/images/sp/sns_twitter.svg) no-repeat center center / cover;
}
.publicFare .sns li.band a {
	background:url(/images/sp/sns_band.svg) no-repeat center center / cover;
}
.publicFare .sns li.kakaotalk a {
	background:url(/images/sp/sns_kakao.svg) no-repeat center center / cover;
}
.publicFare .sns li.link a {
	background:url(/images/sp/iconLink.svg) no-repeat center center / cover;
}
.publicFare .sns a span {
	font-size:0;
	color:transparent;
}
.publicFare .btnInfo {
	background:#0090f0 !important;
}
.publicFare .btnRight .btnReturn {
	background:#005399 !important;
}
.publicFare .btnRight .btnPlus {
	background:#0090f0 !important;
}
.publicFare .car .flexBox {
	position:relative;
}
.publicFare .tabBox li:nth-child(2) {
	background-image:url(/images/sp/iconGosokOff.png);
}
.publicFare .tabBox li:nth-child(2).active {
	background-image:url(/images/sp/iconGosokOn.png);
}
.publicFare .tabBox li:nth-child(3) {
	background-image:url(/images/sp/iconSiwaeOff.png);
}
.publicFare .tabBox li:nth-child(3).active {
	background-image:url(/images/sp/iconSiwaeOn.png);
}
.publicFare .tabBox li:nth-child(4) {
	background-image:url(/images/sp/iconTrainOff.png);
}
.publicFare .tabBox li:nth-child(4).active {
	background-image:url(/images/sp/iconTrainOn.png);
}
.publicFare .tabBox li:nth-child(1) {
	background-image:url(/images/sp/iconCarOff.png);
}
.publicFare .tabBox li:nth-child(1).active {
	background-image:url(/images/sp/iconCarOn.png);
}
.publicFare .tabBox li a {
	color:#adb3b3;
}
.publicFare .tabBox li.active a {
	color:#7391e9;
}
.publicFare .selectBox.car, .publicFare .selectBox.gosok, .publicFare .selectBox.bus, .publicFare .selectBox.train {
	position:relative;
	margin-top:100px;
}
.publicFare .car:before {
	content:"\030E경로선택은 (1)추천경로 (2)최단시간 (3)최단경로를 선택할 수 있습니다. 1, 2번의 경우\A 현재 교통상황을 반영하여 최적거리로 계산되어 조회 시점에 따라 거리가 달라질 수 있습니다. \030E";
    position:absolute;
    top:-75px;
    left:50%;
    transform:translateX(-50%);
    font-size:13px;
    font-weight:100;
    text-align:center;
    color:#004085;
    background:#cce5ff;
    padding:5px 20px;
    border:1px solid #b8daff;
    border-radius:5px;
    white-space:pre;
}
.publicFare .gosok:before {
	content:"\030E국토교통부 API에서 조회 불가능한 노선(현장 예매 노선 등)은 정보가 없을 수 있습니다.\A요금 정보에 오류가 있는 경우는 오류신고 버튼으로 신고하여 주시기 바랍니다. \030E";
    position:absolute;
    top:-75px;
    left:50%;
    transform:translateX(-50%);
    font-size:13px;
    font-weight:100;
    text-align:center;
    color:#004085;
    background:#cce5ff;
    padding:5px 20px;
    border:1px solid #b8daff;
    border-radius:5px;
    white-space:pre;
}
.publicFare .bus:before {
	content:"\030E국토교통부 API에서 조회 불가능한 노선(현장 예매 노선 등)은 정보가 없을 수 있습니다.\A요금 정보에 오류가 있는 경우는 오류신고 버튼으로 신고하여 주시기 바랍니다. \030E";
    position:absolute;
    top:-75px;
    left:50%;
    transform:translateX(-50%);
    font-size:13px;
    font-weight:100;
    text-align:center;
    color:#004085;
    background:#cce5ff;
    padding:5px 20px;
    border:1px solid #b8daff;
    border-radius:5px;
    white-space:pre;
}
.publicFare .train:before {
	content:"\030E 역명으로 조회할 경우 철도 요금은 대중교통비로 대체하여 지급하는 용도로 열차 등급별 최저요금 기준으로 표출되므로 \A실제 영수증 금액과 다른 경우 금액 수정하여 활용 바랍니다. 승차권으로 조회할 경우 운임료를 직접 입력해 주시기 바랍니다.\030E";
    position:absolute;
    top:-75px;
    left:50%;
    transform:translateX(-50%);
    font-size:13px;
    font-weight:100;
    text-align:center;
    color:#004085;
    background:#cce5ff;
    padding:5px 20px;
    border:1px solid #b8daff;
    border-radius:5px;
    white-space:pre;
} 
.publicFare .car > li:first-child > ul > li {
	width:48% !important;
}
/* .publicFare .car > li:first-child > ul > li:is(:nth-child(1), :nth-child(2)) :is(.mx-datepicker, select, input) {
	width:95px !important;
} */
.publicFare .car > li:first-child > ul > li .mx-input-wrapper i {
	display:none;
}
.publicFare .car .flexBox > div:last-child {
	margin-left:10px;
}
.publicFare .car .flexBox > div > .carFuel {
	min-width:unset;
}
.publicFare .car .flexBox > div > .carFuel+span {
	position:absolute;
	top:59px;
	right:65px;
	font-size:12px;
	color:#666;
	letter-spacing:-0.05rem;
	opacity:0;
	transition:.3s;
}
.publicFare .car .flexBox > div > .carFuel:focus+span {
	opacity:1;
}
.publicFare .car .flexBox > div:last-child > .carFuel+p {
	position:absolute;
	top:55px;
	right:65px;
	font-size:12px;
	color:#666;
	letter-spacing:-0.05rem;
	opacity:1;
	transition:.6s;
}
.publicFare .car .flexBox > div:last-child > .carFuel:focus+p {
	opacity:1;
}
.publicFare .car .flexBox .fuelTip .btnInfo {
	position:absolute;
	top:1px;
	right:140px;
	width:18px;
	height:18px;
	font-size:14px;
	line-height:18px;
	text-indent:-1px;
}
.publicFare .car .flexBox .fuelTip span {
	position:absolute;
	top:59px;
	left:106px;
	width:330px;
	font-size:12px;
	background:#fff;
	border:1px solid #ddd;
	padding:10px;
	box-shadow:0 3px 5px rgba(0,0,0,.15);
	transition:.3s;
	opacity:1;
	z-index:99;
}
.publicFare .car .flexBox .fuelTip .btnInfo:hover+span {
	opacity:1;
}
.fareWrap .calcFare h3 {
	margin:0 0.5rem 0 0 !important;
	font-size:18px !important;
}
.fareWrap .calcFare h3:after {
	display:none !important;
}
.hiddenSbjt {
	position:absolute;
	left:-9999px;
	font-size:0;
	color:transparent;
}

/*230321_시외버스 서비스 에러 메시지*/
.errorComment {
	position:absolute;
	bottom:-235%;
	left:0;
	max-width:300px;
	width:100%;
	color:red;
	padding:35px 20px 15px 20px;
	background:linear-gradient(to bottom, #fdf0f0 24px, #fff 24px, #fff 100%);
	box-shadow:0 4px 15px rgba(0,0,0,.15);
	display:none;
	z-index:991;
}
.errorComment .btnCls {
	position:absolute;
	top:0px;
	right:0px;
	width:24px;
	height:24px;
	background:#fdf0f0;
	font-size:24px;
	color:#e93f3f;
	line-height:24px;
	cursor:pointer;
}
/*****************************************올담 비로그인 회원 맞춤*****************************************/
.publicFareTabBox.anonymous {
	background:transparent;
	box-shadow:none;
}
.publicFareTabBox li.active.anonymous {
	width:100%;
	background:transparent !important;
	box-shadow:none;
}
.publicFareTabBox li.active.anonymous a {
	position:relative;
	color:#222;
	font-size:38px;
	display:inline;
}
.publicFareTabBox li.active.anonymous a:before {
	content:"";
	position:absolute;
	bottom:16px;
	left:0;
	width:100%;
	height:10px;
	background:#1aa4ff;
	transform:skewX(-10deg);
	z-index:-1;
}
.modal-container.anonymous {
	width:348px !important;
}
.modal-container.anonymous .selectedLocation > div {
	border-right:1px solid #7391e9;
}
.modal-body #stationArrival.anonymous {
	width:100% !important;
}

/*익스플로러에서 깨짐*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.publicFare .sns > li:not(:last-child) {
		margin-right:5px;
	}
	.publicFare.popBtnBox {
		margin-bottom:-35px;
	}
	.publicFare.popBtnBox .btnRight {
		position:absolute;
		right:0;
		top:-10px;
	}
	.fareWrap select::-ms-expand {
		display:none;
	}
	.fareWrap select {
	    background:url(/images/sp/iconDownArrow.png) no-repeat center 90% / 10px;
	}
  	.fareWrap .selectBox.car > li:first-child > ul > li:nth-child(1),
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(2),
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(3) {	
    	width: 30.33%;
    	margin-bottom: 20px;
    }
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(1) input,
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(2) input,
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(3) input {
    	min-width:145px !important;
    	width:145px;
    }
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(1) select,
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(2) select,
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(3) select {
    	min-width:145px !important;
    	width:145px;
    }
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(4), 
    .fareWrap .selectBox.car > li:first-child > ul > li:nth-child(5) {
    	width:50%;
    }
}
/*****************************************대민여비 반응형*****************************************/
.max500 {
	display:none;
}
@media all and (max-width:1024px) {
	.fareWrap, .fareResult {
		padding-left:10px;
		padding-right:10px;
	}
}
@media all and (max-width:768px) {
	.topBanner > .leftBanner > a img,
	.topBanner > .rightMedia img {
		max-width:350px;
		width:100%;
	}
	.publicFare .car:before {
		content:"\030E경로선택은 (1)추천경로 (2)최단시간 (3)최단경로를 선택할 수 있습니다. 1, 2번의 경우 현재 교통상황을 반영하여 최적거리로 계산되어 조회 시점에 따라 거리가 달라질 수 있습니다. \030E";
		max-width:85vw;
		width:100%;
		white-space:unset; 
		font-size:12px;
	}
	.publicFare .gosok:before {
		content:"\030E국토교통부 API에서 조회 불가능한 노선(현장 예매 노선 등)은 정보가 없을 수 있습니다.\A요금 정보에 오류가 있는 경우는 오류신고 버튼으로 신고하여 주시기 바랍니다. \030E";
		max-width:85vw;
		width:100%;
		white-space:unset; 
		font-size:12px;
	}
	.publicFare .bus:before {
		content:"\030E국토교통부 API에서 조회 불가능한 노선(현장 예매 노선 등)은 정보가 없을 수 있습니다.\A요금 정보에 오류가 있는 경우는 오류신고 버튼으로 신고하여 주시기 바랍니다. \030E";
		max-width:85vw;
		width:100%;
		white-space:unset; 
		font-size:12px;
	}
	.publicFare .train:before {
		content:"\030E철도 요금은 대중교통비로 대체하여 지급하는 용도로 열차 등급별 최저요금 기준으로 표출되므로 \A실제 영수증 금액과 다른 경우 금액 수정하여 활용 바랍니다. \030E";
		max-width:85vw;
		width:100%;
		white-space:unset;
		font-size:12px;
	}
	.fareWrap .selectWrap .selectBox:nth-child(1) {
		display:block;
	}
	.fareWrap .selectBox.car > li:first-child {
		width:100%;
	}
	.publicFare .car > li:first-child > ul > li > div:not(.flexBox) {
		width:50%;
	}
	.publicFare .car > li:first-child > ul > li:is(:nth-child(1), :nth-child(2)) :is(.mx-datepicker, select, input) {
	 width:100% !important;
	}
	.publicFare .car > li:first-child > ul > li {
		width:100% !important;
	}
	.fareWrap .selectBox.car > li > ul {
		flex-direction:column;
	}
	.publicFare .car > li:first-child > ul > li > div.flexBox {
		width:100%;
	}	 
	.publicFare .car > li:first-child > ul > li > div.flexBox > div {
		width:50%;
	}
	.publicFare .car .flexBox .fuelTip .btnInfo {
		top:2px;
		right:unset;
		left:calc(50% + 35px);
	}
	.fareWrap .selectBox.car > li:first-child > ul > li button.busPlace {
		max-width:100%;
	}
	.fareWrap .selectBox.car > li:nth-child(2) {
		width:100%;
	}
	.fareWrap .selectBox.car > li:nth-child(2) > ul li.topAlign {
		display:flex;
		justify-content:space-between;
		width:100%; 
	}
	.fareWrap .selectBox.car > li:nth-child(2) > ul li.topAlign :is(span.btnCheckbox, .btnDistance) {
		width:48%;
	}
	.fareWrap .selectBox.car > li:nth-child(2) > ul > li .btnDistance {
		background:url(/images/sp/iconSearch.png) no-repeat 10% center / 8% #7391e9;
	}
	.fareWrap .selectBox.car > li > ul.carOthers {
		flex-direction:row;
		gap:0 10px;
		flex-wrap:nowrap;
	}
	.fareWrap .selectBox.car > li > ul.carOthers > li {
		display:flex;
		align-items:center;
		width:calc(50% - 55px);
	}
	.fareWrap .selectBox.car > li > ul.carOthers > li:last-child {
		width:80px;
	}
	.fareWrap .calcFare {
		flex-direction:column;
		align-items:flex-end;
	}
	.fareWrap .calcFare .bookmarkcheck {
		bottom:30px;
		top:unset;
		left:15px;
		transform:unset;
	} 
	.fareWrap .calcFare .bookmarkcheck span {
		font-size:14px;
		font-weight:normal;
	}
	.fareWrap .selectBox.bus, .fareWrap .selectBox.gosok, .fareWrap .selectBox.train {
		padding:15px 20px;
	}
	.fareWrap .selectBox.bus li, .fareWrap .selectBox.gosok li, .fareWrap .selectBox.train li {
		width:100% !important;
		margin-bottom:20px;
	}
	.fareWrap .selectBox.gosok li input[type=date], 
	.fareWrap .selectBox.gosok li select, 
	.fareWrap .selectBox.gosok li .busPlace,
	.fareWrap .selectBox.bus li select, 
	.fareWrap .selectBox.bus li .busPlace, 
	.fareWrap .selectBox.train li .busPlace {
		width:100%;
	}
	:is(.selectBox.gosok, .selectBox.bus, .selectBox.train) li .mx-datepicker {
		width:100%;
	}
	.fareWrap .selectBox li input, .fareWrap .selectBox li select {
		width:100%;
	}
	.fareWrap .selectBox.gosok li:nth-child(4), 
	.fareWrap .selectBox.bus li:nth-child(4), 
	.fareWrap .selectBox.train li:nth-child(4) {
		width:100%;
		text-align:center;
	}
	.btnsearchNew {
		max-width:120px;
		min-width:60px;
		margin:0 auto;
		background:url(/images/sp/iconSearch.png) no-repeat 33% center / 12% #7391e9;
	}
	.btnReturn:before {
		left:unset;
		right:0;
	}
	.mapPop .modal-container {
		max-width:600px;
		width:100vw !important;
	}
	.mapPop .modal-container #map {
		height:300px !important;
	}
	.allBusModal .btnsearchNew {
		max-width:90px;
	}
	.mapPop .selectedLocation > span {
		width:100%;
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}
	.fareInfoPop {
		max-width:470px;
		width:100%;
		left:50%;
		transform:translateX(-50%);
	}
}
@media all and (max-width:500px) {
	.max500 {
		display:block;
	}
	.publicFare .car .flexBox .fuelTip span {
		max-width:200px;
		width:100%;
	}
	.fareWrap .selectBox li input, .fareWrap .selectBox li select {
		min-width:unset;
	}
	.btnReturn:before {
		right:-50px;
	}
	.fareInfoList td .btnsearchNew {
		background:url(/images/sp/iconSearch.png) no-repeat 18% center / 20% #7391e9;
	}
	.fareTable tfoot td b {
		white-space:nowrap;
	}
	.resultTable .btnRight {
		flex-wrap:wrap;
		gap:5px 0;
	}
	.mapPop .bookMark {
		display:flex !important;
		align-items:flex-end;
	}
	.mapPop .bookMark > label {
		width:100%;
	}
	.mapPop .bookMark span:nth-child(2) {
		white-space:nowrap;
	}
	.mapPop .bookMark button {
		position:static;
	}
	.mapPop .selectedLocation .selectedSpot {
		white-space:nowrap;
	}
}