@charset "UTF-8";

/*
	***** 공통 스타일 *****
*/

* {margin:0; padding:0; border:0;}


/* 폰트색상 */
.fontBlack {color:#1a1a1a;}
.fontGrey {color:#777777;}
.fontGreenMain {color:#ffa5aa;}
.fontGreenSub {color:#ffa5aa;}

/* margin */
.marginLeftT {margin-left:5px;}
.marginLeftS {margin-left:10px;}
.marginLeftM {margin-left:30px;}
.marginLeftL {margin-left:50px;}
.marginLeftEL {margin-left:80px;}


/* 페이지 타이틀 */
.pageTitle {margin-bottom:70px; }
.pageTitle.centerAlign {text-align:center;}
.pageTitle.centerAlign .underBar {margin:0 auto;}
.pageTitle .title {font-size:60px; font-family: 'PretendardB'; color:#282828; margin-bottom:25px;}
.pageTitle .title .engTitle {font-family:Neothic;}
.pageTitle .title .smallThin {font-size:25px; font-family: 'PretendardL';}
.pageTitle .title .eng {font-size:20px; font-family:Neothic; color:#cccccc; margin-left:15px;}
.pageTitle .underBar {width:30px; height:3px; background-color:#ff1a6c;}
.pageTitle .underBar.height { width: 1px ; height: 50px; background-color: #808080;}
.pageTitle .subTitle { font-size: 13px; font-family:'MontL'; color: #282828; opacity: 0.5; margin-bottom: 15px; letter-spacing: 4px;}


/*테이블 타이틀*/
.tableTitle {font-size:25px; color:#ff1a6c; font-family: 'PretendardM'; margin-bottom:25px;}


/*섹션 타이틀*/
.sectionTitle {margin-bottom:30px;}
.sectionTitle .mainText {font-size:26px; font-family: 'PretendardB'; text-align:center;}
.sectionTitle .subText1 {font-size:14px; margin-top:10px; text-align:center;}
.sectionTitle .subText2 {font-size:16px; color:#777777; margin-top:10px; text-align:center;}
.sectionTitle .subText2 .bold {font-family: 'PretendardM'; color:#000000;}
.sectionTitle.withDotLine .mainText {display:flex; align-items: center;}
.sectionTitle.withDotLine .mainText span.dotLine {
	flex:1;
	height:1px;
	background-image: linear-gradient(to right, rgba(68,68,68,1) 25%, rgba(68,68,68,0) 0%);
	background-position: bottom;
	background-size: 4px 1px;
	background-repeat: repeat-x;
}
.sectionTitle.withDotLine .mainText span.text {padding-left:20px; padding-right:20px;}


/* 버튼 */
.button.default {
	display:inline-block;
	height:60px;
	line-height:58px;
	font-size:18px;
	font-family: 'PretendardL';
	text-align:center;
	vertical-align:middle;
	box-sizing:border-box;
	cursor:pointer;
}
.button.green {color:#ffffff; background-color:#ffa5aa;}
.button.black {color:#ffffff; background-color:#1a1a1a;}
.button.greenLine {color:#ffa5aa; border:solid 1px #ffa5aa; background-color:#ffffff;}
.button.blackLine {color:#1a1a1a; border:solid 1px #1a1a1a; background-color:#ffffff;}
.button.grayLine {color:#022222; border:solid 1px #e7e7e7; background-color:#ffffff;}

.button.round {border-radius:30px;}

.button.mini {font-size:12px; width:75px; height:25px; line-height:23px;}
.button.small {font-size:16px; width:130px; height:40px; line-height:38px;}
.button.medium {font-size:18px; width:230px; height:60px; line-height:58px;}
.button.large {font-size:18px; width:430px; height:60px; line-height:58px;}

.button.full {width:100% !important;}
.button.flexible {height:auto !important; width:auto !important; padding:7px 30px; line-height:normal;}

.button.fontS {font-size:12px !important;}
.button.fontM {font-size:16px !important;}
.button.fontL {font-size:18px !important;}

.halfFullButton {font-size:0;}
.halfFullButton .halfCell {display:inline-block; width:50%; box-sizing: border-box;}
.halfFullButton .halfCell:first-child {padding-right:5px;}
.halfFullButton .halfCell:last-child {padding-left:5px;}

.button.more {font-family: 'PretendardL'; width:540px; height:70px; line-height:68px; color:#777777; border:solid 1px #d6d9db;}


/* 페이지 위치 */
.pageLocation {font-size:12px; color:#888888; /*padding-top:15px;*/ margin-bottom:25px;}
.pageLocation img {vertical-align: middle; padding-bottom:3px;}
.pageLocation img.arrow {margin-left:5px; margin-right:5px; opacity:0.3;}


/* 폼 레이아웃 */
.formWrap {margin-bottom:30px;}
.formWrap .formTitle {font-size:20px; font-family: 'PretendardL'; color:#222222; padding-bottom:15px; border-bottom:solid 1px #e7e7e7;}
.formWrap .formRow {font-size:0; box-sizing: border-box; border-bottom:solid 1px #e7e7e7;}
.formWrap .formRow .formCol {display:inline-block; vertical-align: top; box-sizing: border-box;}
.formWrap .formRow .formCol.head {width:170px; font-size:16px; color:#333333; padding-top:17px; padding-left:28px;}
.formWrap .formRow .formCol.head.require {padding-left:15px;}
.formWrap .formRow .formCol.head.require::before {content:"* "; font-size:18px; color:#ffa5aa; vertical-align:middle;}
.formWrap .formRow .formCol.body {width:calc(100% - 170px); font-size:14px; color:#333333; padding-top:10px; padding-bottom:10px; padding-right:15px;}
.formWrap .formRow .formCol.body .betweenText {padding:0 5px;}
.formWrap .formRow .formCol.body .tailCheck {margin-left:10px; vertical-align: middle;}
.formWrap .formRow .formCol.body label.checkText {font-size:14px; color:#333333;}
.formWrap .formRow .formCol.body .bodyInnerCol {margin-bottom:10px;}
.formWrap .formRow .formCol.body .bodyInnerCol:last-child {margin-bottom:0;}

/* 폼 요소 */
textarea, input[type=text], input[type=number], select {outline:none;}


select.select::-ms-expand { display: none; } /* IE 10, 11의 네이티브 화살표 숨기기 */
.select.default {
	-webkit-appearance: none; /* 네이티브 외형 감추기 */
	-moz-appearance: none;
	appearance: none;
	background: url("../images/selectArrow.png") no-repeat 95% 50%; /* 화살표 모양의 이미지 */
	font-size:14px;
	color:#888888;
	padding:10px;
	padding-right:30px;
	box-sizing: border-box;
	border:solid 1px #dbdbdb;
	background-color:#ffffff;
	vertical-align: middle;
}
.select.mini {width:100px;}
.select.small {width:120px;}
.select.medium {width:200px;}
.select.large {width:340px;}
.select.full {width:100%;}



.input.default {
	font-size:18px;
	color:#1a1a1a;
	padding:11px;
	box-sizing: border-box;
	/*border:solid 1px #dbdbdb;*/
	background-color:#fafafa;
	vertical-align: middle;
}
.input.mini {width:100px;}
.input.small {width:120px;}
.input.medium {width:200px;}
.input.large {width:340px;}
.input.extraLarge {width:700px;}
.input.full {width:100%;}

.input.disabled {background-color:#f5f5f5;}

input::placeholder {color: #999999;}



label input[type=file] {
	position:absolute;
	width:0;
	height:0;
	overflow:hidden;
}



input[type=checkbox]:not(.uk-checkbox) {display:none !important;}
input[type=checkbox]:not(.uk-checkbox) + label {display: inline-block; height:24px; font-weight:normal; cursor: pointer; line-height: 24px; padding-left: 28px; background: url('/app/layout/web/images/chkOff1.png') left/24px no-repeat !important;}
input[type=checkbox]:checked + label { background-image: url('/app/layout/web/images/chkOn1.png') !important; }

input[type=checkbox]:not(.uk-checkbox) + label.checkStyle2 {display: inline-block; height:24px; font-weight:normal; cursor: pointer; line-height: 24px; padding-left: 22px; background: url('/app/layout/web/images/chkOff2.png') left/24px no-repeat !important;}
input[type=checkbox]:checked + label.checkStyle2 { background-image: url('/app/layout/web/images/chkOn2.png') !important; }



textarea {
	width:100%;
	height:380px;
	font-size:18px;
	color:#888888;
	font-family: 'PretendardL';
	padding:11px;
	box-sizing: border-box;
	border:solid 1px #dbdbdb;
	resize:none;
	background-color:#ffffff;
}
textarea::placeholder {color: #999999;}



/*라디오버튼 기본스타일*/
input[type="radio"]:not(.uk-radio) {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
input[type="radio"]:not(.uk-radio) + label {
	display: inline-block;
	position: relative;
	font-size:14px;
	color:#333333;
	padding-left: 25px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}
input[type="radio"]:not(.uk-radio) + label:before {
	content: '';
	position: absolute;
	left: 0;
	top: 1px;
	width: 19px;
	height: 19px;
	text-align: center;
	background: #ffffff;
	box-sizing: border-box;
	border: 1px solid #b8b8b8;
	border-radius: 100%;
}
input[type="radio"]:checked + label:after {
	content: '';
	position: absolute;
	top: 5px;
	left: 4px;
	width: 11px;
	height: 11px;
	background: #ffa5aa;
	border-radius: 100%;
}

/*라디오버튼 스타일2*/
input[type="radio"]:not(.uk-radio) + label.radioStyle2 {
	display: inline-block;
	position: relative;
	width:50%;
	height:50px;
	line-height:50px;
	font-size:14px;
	color:#888888;
	text-align:center;
	vertical-align: middle;
	padding-left:0;
	border:solid 1px #dbdbdb;
	cursor: pointer;
	box-sizing: border-box;
	background-color:#f5f5f5;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}
input[type="radio"]:not(.uk-radio) + label.radioStyle2:before {display:none;}
input[type="radio"]:not(.uk-radio) + label.radioStyle2:after {display:none;}
input[type="radio"]:checked + label.radioStyle2 {
	border:solid 1px #ffa5aa;
	background-color:#ffffff;
}

/* 페이지네이션 */
.pagination {margin-top:35px; text-align:center; font-size:0;}
.pagination a {display:inline-block; width:40px; height:40px; line-height:40px; font-size:18px; color:#666666; font-family:SCDream5; vertical-align: middle;}
.pagination a.on {color:#ffffff; pointer-events: none; background-color:#ffa5aa;}
.pagination a.num {margin-left:5px; margin-right:5px;}
.pagination .firstPage {letter-spacing: -10px;}
.pagination .lastPage {letter-spacing: -10px;}

/* 탭버튼 */
.tabButtonWrap.style1 {display:inline-block; width:100%; font-size:0; text-align:center; margin-bottom:70px;}
.tabButtonWrap.style1 .tab {
	display:inline-block;
	width:200px;
	height:40px;
	line-height:38px;
	font-size:16px;
	color:#222222;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border:solid 1px #dddddd;
	border-left:0;
	cursor:pointer;
	background-color:#ffffff;
}
.tabButtonWrap.style1 .tab:first-child {border-left:solid 1px #dddddd;}
.tabButtonWrap.style1 .tab.on {color:#ffffff; border:solid 1px #ffa5aa; background-color:#ffa5aa;}


.tabButtonWrap.style2 {display:inline-block; width:100%; font-size:0; text-align:center; margin-bottom:70px;}
.tabButtonWrap.style2 .tab {
	display:inline-block;
	width:20%;
	height:60px;
	line-height:58px;
	font-size:18px;
	color:#555555;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border:solid 1px #e6e5e3;
	border-left:0;
	cursor:pointer;
	background-color:#ffffff;
}
.tabButtonWrap.style2 .tab span {color:#ffa5aa; ffont-family: 'PretendardL';}
.tabButtonWrap.style2 .tab:first-child {border-left:solid 1px #e6e5e3;}
.tabButtonWrap.style2 .tab.on {font-family: 'PretendardL'; background-color:#e6e5e3;}


.tabButtonWrap.style3 {display:inline-block; width:100%; font-size:0; margin-bottom:70px; border-top:solid 1px #dddddd; border-left:solid 1px #dddddd; box-sizing: border-box;}
.tabButtonWrap.style3 .tab {
	display:inline-block;
	width:16.6666666%;
	height:40px;
	line-height:38px;
	font-size:16px;
	color:#222222;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border-bottom:solid 1px #dddddd;
	border-right:solid 1px #dddddd;
	cursor:pointer;
	background-color:#ffffff;
}
.tabButtonWrap.style3 .tab.on {color:#ffffff; border-color:#ffa5aa; background-color:#ffa5aa;}


.tabButtonWrap.style4 {display:inline-block; width:100%; font-size:0; border-bottom:solid 1px #e7e7e7; margin-bottom:30px;}
.tabButtonWrap.style4 .tab {
	display:inline-block;
	width:300px;
	height:50px;
	line-height:48px;
	font-size:15px;
	color:#333333;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border:solid 1px #f1f1f1;
	border-bottom:0;
	cursor:pointer;
	background-color:#f1f1f1;
}
.tabButtonWrap.style4 .tab.on {border:solid 1px #ffa5aa; border-bottom:0; background-color:#ffffff;}


.tabButtonWrap.style5 {display:inline-block; width:100%; font-size:0; border-bottom:solid 1px #e7e7e7; margin-bottom:30px;}
.tabButtonWrap.style5 .tab {
	display:inline-block;
	width:33.33333333%;
	height:50px;
	line-height:48px;
	font-size:15px;
	color:#333333;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border:solid 1px #f1f1f1;
	border-bottom:0;
	border-right:solid 1px #ffffff;
	cursor:pointer;
	background-color:#f1f1f1;
}
.tabButtonWrap.style5 .tab:last-child {border-right:0;}
.tabButtonWrap.style5 .tab.on {border:solid 1px #ffa5aa; border-bottom:0; background-color:#ffffff;}

.tabButtonWrap.style6 {width:1000px; font-size:0; margin:0 auto; margin-bottom:70px; /*border-top:solid 1px #dddddd;*/ border-left:solid 1px #dddddd; box-sizing: border-box;}
.tabButtonWrap.style6 .tab {
	display:inline-block;
	width:16.666%;
	height:40px;
	line-height:38px;
	font-size:16px;
	color:#222222;
	text-align:center;
	vertical-align: middle;
	box-sizing: border-box;
	border-bottom:solid 1px #dddddd;
	border-right:solid 1px #dddddd;
	cursor:pointer;
	background-color:#ffffff;
}
.tabButtonWrap.style6 .tab:nth-child(-n+8) {border-top:solid 1px #dddddd;}
.tabButtonWrap.style6 .tab.on {color:#ffffff; border-color:#ffa5aa; background-color:#ffa5aa;}



/*드롭다운*/
.dropdown.default {
	position:relative;
	display:inline-block;
	min-width:80px;
	font-size:14px;
	color:#808080;
	font-family: 'PretendardR';
	box-sizing: border-box;
	text-align:left;
	border:solid 1px #cccccc;
}
.dropdown.default .selectedText {padding:5px 10px; /*border:solid 1px #e0e0e0;*/ cursor:pointer; font-family: 'PretendardL';}
.dropdown.default .selectedText > span {display:inline-block; margin-right:15px; word-break: keep-all; font-family: 'PretendardL';}
.dropdown.default .selectedText > i {position:absolute; top:50%; right:5px; color:#808080;}
.dropdown.default .dropdownBox {
	display:none;
	position: absolute;
	min-width: 80px;
	border: solid 1px #e0e0e0;
	padding: 10px 0;
	box-sizing: border-box;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
	background-color: #ffffff;
	z-index:10;
}
.dropdown.default .dropdownBox .boxTip {position:absolute; width:100%; top:-8px; font-size:0; text-align:center;}
.dropdown.default .dropdownBox > div {padding:5px 10px; cursor:pointer; word-break: keep-all;}
.dropdown.default .dropdownBox > div:hover {background-color:#f5f5f5;}
.dropdown.default .dropdownBox > div.on {font-family: 'PretendardB'; color:#ffa5aa;}




/*팝업*/
.csPopup {position:fixed; display:none; top:0; left:0; width:100%; height:100%; justify-content: center; align-items: center; z-index:100; background-color:rgba(0,0,0,0.8);}
.csPopup .popupWin {position:relative; width:750px; padding:40px; padding-top:50px; background-color:#ffffff; max-height:90%; overflow-y:scroll; overflow-x:hidden;}
.csPopup .popupWin.small {width:400px !important; padding:25px !important;}
.csPopup .popupWin i.btnCloseCsPopup {position:absolute; top:20px; right:20px; color:#303030; font-size:32px; cursor:pointer;}
.csPopup .popupWin .popupTitle {font-size:26px; color:#222222; font-family: 'PretendardB'; text-align:center; margin-bottom:25px;}
.csPopup .popupWin .comment {display:block; font-size:14px; color:#666666; text-align:left; margin-bottom:5px;}
.csPopup .popupWin .bottomButtons {margin-top:20px;}







@media (max-width:768px){

	/* 페이지 타이틀 */
	.pageTitle {margin-bottom:35px; text-align:center;}
	.pageTitle .subTitle { font-size: 11px; margin-bottom: 10px; letter-spacing: 3px;}
	.pageTitle .title {font-size:18px; margin-bottom:10px;}
	.pageTitle .title .smallThin {font-size:16px; font-family: 'PretendardL';}
	.pageTitle .title .eng {display:block; font-size:13px; margin-left:0; margin-top:5px;}
	.pageTitle .underBar {width:20px; height:2px; margin:0 auto; background-color:#ffa5aa;}


	/*테이블 타이틀*/
	.tableTitle {font-size:16px; margin-bottom:15px;}


	/*인풋텍스트*/
	.input.default {
		font-size:14px;
	}


	/*textarea*/
	textarea {
		height:100px;
		font-size:14px;
		padding:6px;
	}


	/* 버튼 */
	.button.default {
		height:45px;
		line-height:43px;
		font-size:15px;
	}

	.button.round {border-radius:30px;}

	.button.mini {font-size:12px; width:60px; height:20px; line-height:18px;}
	.button.small {font-size:14px; width:100px; height:40px; line-height:38px;}
	.button.medium {font-size:15px; width:200px; height:45px; line-height:43px;}
	.button.large {font-size:16px; width:300px; height:50px; line-height:48px;}

	.button.flexible {padding:5px 10px;}

	.button.fontMini {font-size:11px !important;}
	.button.fontS {font-size:12px !important;}
	.button.fontM {font-size:15px !important;}
	.button.fontL {font-size:16px !important;}


	/*체크박스*/
	input[type=checkbox]:not(.uk-checkbox) + label {display: inline-block; height:18px; font-weight:normal; cursor: pointer; line-height: 18px; padding-left: 22px; background: url('/app/layout/web/images/chkOff1.png') left/18px no-repeat !important;}
	input[type=checkbox]:checked + label { background-image: url('/app/layout/web/images/chkOn1.png') !important; }

	input[type=checkbox]:not(.uk-checkbox) + label.checkStyle2 {display: inline-block; height:18px; font-weight:normal; cursor: pointer; line-height: 18px; padding-left: 22px; background: url('/app/layout/web/images/chkOff2.png') left/18px no-repeat !important;}
	input[type=checkbox]:checked + label.checkStyle2 { background-image: url('/app/layout/web/images/chkOn2.png') !important; }


	/*라디오버튼 기본스타일*/
	input[type="radio"]:not(.uk-radio) {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
	input[type="radio"]:not(.uk-radio) + label {
		display: inline-block;
		position: relative;
		font-size:14px;
		color:#333333;
		padding-left: 20px;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
	}
	input[type="radio"]:not(.uk-radio) + label:before {
		width: 15px;
		height: 15px;
	}
	input[type="radio"]:checked + label:after {
		content: '';
		position: absolute;
		top: 4px;
		left: 3px;
		width: 9px;
		height: 9px;
	}
	
	
	/* 페이지네이션 */
	.pagination {margin-top:30px;}
	.pagination a {width:25px; height:25px; line-height:25px; font-size:16px;}
	.pagination .firstPage {width:40px;}
	.pagination .lastPage {width:40px;}


	.pageTitle .underBar.height { height: 25px;;}

}