/*fonts*/
@font-face{
	font-family: 'Proxima Nova';
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-LightWeb.eot');
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-LightWeb.eot?#iefix') format('embedded-opentype'),
	url('/js.ln/fonts/web/proxima_nova/ProximaNova-LightWeb.woff') format('woff');
	font-weight: 100;
}
@font-face{
	font-family: 'Proxima Nova';
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-RegWeb.eot');
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-RegWeb.eot?#iefix') format('embedded-opentype'),
	url('/js.ln/fonts/web/proxima_nova/ProximaNova-RegWeb.woff') format('woff');
	font-weight: normal;
}
@font-face{
	font-family: 'Proxima Nova';
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-SboldWeb.eot');
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-SboldWeb.eot?#iefix') format('embedded-opentype'),
	url('/js.ln/fonts/web/proxima_nova/ProximaNova-SboldWeb.woff') format('woff');
	font-weight: 500;
}
@font-face{
	font-family: 'Proxima Nova';
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-BoldWeb.eot');
	src: 	url('/js.ln/fonts/web/proxima_nova/ProximaNova-BoldWeb.eot?#iefix') format('embedded-opentype'),
	url('/js.ln/fonts/web/proxima_nova/ProximaNova-BoldWeb.woff') format('woff');
	font-weight: bold;
}



html, body
{
	padding: 0;
	margin: 0;
	
	background:
		/*본래값:
		#f2f3f5*/
		/*(2017-04-17 by 나건수)*/
		white
	;

	width:100%;
}



html {
	height: 100%;
}
body {
	min-height: 100%;
	xmin-width:700px;
	/*overflow-y:scroll;*/ /* scroll disabled due to jquery-ui/chrome bug */
	/*---see: http://blog.ricky-stevens.com/jquery-sortable-offset-bug/ */
}



/* special hack to stop google from interfering with the page */
body > iframe#ssIFrame_google {
	display:none;
}






a { text-decoration:none; }
a:hover,
a:focus{ text-decoration:none; }
:focus {outline:0 !important;}
strong,b,.strong,.text-bold { font-weight:bold; }
/* firefox feels focus on select elements isn't part of css spec */
select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; }
.text-semibold { font-weight:500; }
.text-light { font-weight:100; }

.page-width { max-width:980px; margin:0 auto; }





#sl-app-container {
	min-height: 100%;
}

#sl-app-content {
	position: relative;
	min-height: 100%;
	padding-top: 77px;
	padding-bottom:30px;
}



#sl-app-header
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 500;

	/*(2017-04-05 by 나건수)*/
	pointer-events: none;
}


#sl-app-footer {
	xposition: absolute;
	xbottom: 0;
	xleft: 0;
	xheight: 30px;
	xwidth: 100%;
	xz-index: 500;
    
	height: 30px;
	text-align: center;
}


#sl-app-footer > div {
	display:inline-block;
	background-color: rgba(255,255,255,0.8);
}


#header-frame
{
	position: relative;
	xheight: 77px;
	
	height:
		205px
		/*%%300px*/
	;

	width: 100%;
	border: 0;
	z-index: 1;
	display: block;
	overflow: hidden;
}



#header-frame.expand {
	height: 800px;
}

#wrapper {
	padding: 40px 0;
}

#wrapper > .page-width {
	background: rgba(0, 0, 0, 0.2);
	width: 100%;
	max-width: 1170px;
	xpadding: 30px 30px 0 30px;
	padding: 95px 30px 0 30px;
}

#wrapper #content {
	position: relative;
}

#wrapper #content.has-right-column {
	padding-right: 300px;
}

#wrapper #content > aside.right-column {
	position: absolute;
	top: 0;
	right: 0;
	width: 275px;
}

#wrapper {
	color: #444;
}

#wrapper h1,
#wrapper h2,
#wrapper h3,
#wrapper h4,
#wrapper h5 {
	font-family: Roboto, sans-serif;
}


@media (max-width: 1000px) {
	#sl-app-content {
		padding-top: 142px;
		padding-bottom:30px;
		width: 100%;
	}
    
	#wrapper {
		padding: 40px 0 40px 0;
	}
    
	#wrapper > .page-width {
		xmax-width: 980px;
		padding-top: 95px;
		padding-bottom: 5px;
	}

	#wrapper #content {
		min-height: 540px;
	}

	#wrapper #content.has-right-column {
		padding-right: 160px;
	}

	#wrapper #content > aside.right-column {
		width: 135px;
	}

	#sl-create-new-list {
		width: 135px;
	}

	#sl-create-new-list .element-meta {
		float: none;
		display: block;
		margin: 0 0 5px 0;
	}

	#header-frame {
		height: 270px;
	}

	#header-frame.expand {
		height: 800px;
	}
}


.typed-cursor{
	opacity: 1;
	-webkit-animation: blink 0.7s infinite;
	-moz-animation: blink 0.7s infinite;
	animation: blink 0.7s infinite;
}
@keyframes blink{
	0% { opacity:1; }
	50% { opacity:0; }
	100% { opacity:1; }
}
@-webkit-keyframes blink{
	0% { opacity:1; }
	50% { opacity:0; }
	100% { opacity:1; }
}
@-moz-keyframes blink{
	0% { opacity:1; }
	50% { opacity:0; }
	100% { opacity:1; }
}

#intro-overlay {
	xdisplay:none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20000;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,1);
	xmargin-top: -150px;

	-webkit-transition: opacity 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
	transition:         opacity 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
#intro-text-table {
	position: relative;
	width: 100%;
	height: 100%;
	display: table;
}
#intro-text-cell {
	display: table-cell;
	width: 100%;
	vertical-align: middle;
	text-align: center;
	padding-bottom: 10%;

	color: black;
	font-family: Roboto, serif;
	font-size: 40px;
}
#intro-logo {
	margin-bottom: 10px;
	opacity: 0;

	-webkit-transition: opacity 2000ms cubic-bezier(0.075, 0.82, 0.165, 1);
	transition:         opacity 2000ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
#intro-text {
}

#intro-dd-part1,
#intro-dd-part2 {
	opacity: 0;

	-webkit-transition: opacity 1500ms cubic-bezier(0.075, 0.82, 0.165, 1);
	transition:         opacity 1500ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
#intro-dd-part1 .fa {
	-webkit-transition: color 1000ms cubic-bezier(0.075, 0.82, 0.165, 1);
	transition:         color 1000ms cubic-bezier(0.075, 0.82, 0.165, 1);
}

#intro-dd-feedback {
	display:none;
}
#intro-dd-feedback .feedback-text {
	color: #444;
	font-family: Roboto, serif;
	font-size: 22px;
}



.question-element-heading { display: none; }




























.content-box,
.transparent-box {
	margin-bottom:20px;
}
.content-box:last-child,
.transparent-box:last-child {
	margin-bottom:0;
}

.content-box {
	background:#ffffff; box-shadow:0 1px 2px 0 rgba(40,60,70,0.1);
	/*border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;*/
}

.content-box-title { border-bottom: 1px solid #e8ecef; height:40px; position:relative; }
.content-box-title .inner { padding:0; color:#4F78A1; }
.content-box-body { padding:20px; font-size:14px; }

.right-column .content-box-body { padding:20px; }
.content-box-body section { margin-bottom:20px; }
.content-box-body section.app-section-buttons { margin-top:30px; margin-bottom:0; text-align:right; }
.content-box-body .content-box-heading { margin-bottom:10px; font-size:22px; xline-height:34px; font-family: Roboto, sans-serif; }
.content-box .instruction { color: #999999; }


.content-box .question-preview-text { font-size:14px; }


.content-box.content-box-narrow { }
.content-box.content-box-narrow .content-box-body { padding:10px; }





#sl-request-transition-wrap {
	position:fixed; bottom:-100px; left:50%; opacity:0; width:80px; height:50px; background:#283b46; border-radius: 6px;
	-webkit-transition: opacity 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
	transition:         opacity 600ms cubic-bezier(0.075, 0.82, 0.165, 1);
}
#sl-request-transition-wrap.visible {
	opacity: 1;
}
#sl-request-transition-wrap.relocate {
	bottom: 20px;
}
#sl-request-save-spinner { position:absolute; top:10px; left:24px; width:100%; }
#sl-request-save-complete-checkmark { display:none; position:absolute; width:100%; top:12px; left:0; color:#fff; text-align:center; }
#sl-request-save-complete-checkmark .glyphicons { font-size:24px; }


















/*========================================*/
/*glyphicons customization*/
/*========================================*/

.glyphicons { font-size:inherit; }
.btn .glyphicons { vertical-align:baseline; }


/*========================================*/
/*bootstrap customization*/
/*========================================*/

/*modal*/
.modal { padding-top:70px; }
.modal h4.modal-title { font-size:20px; }
.modal .modal-header { border-bottom:0; padding-bottom:5px; }
.modal .modal-footer { border-top:0; padding-top:5px; }
.modal-content { box-shadow: 0 0 6px rgba(0,0,0,0.2); }

/*popover*/
.popover .popover-content p:last-child { margin-bottom:0; }

.control-label-tip .glyphicons { top:2px; color:#BEC9D5; cursor:default; }

label.radio, label.checkbox { font-weight:normal; cursor:pointer; }

.form-control { box-shadow: none; transition:none; }
.form-control:focus {
	border-color: #4F78A1; transition:none;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 2px rgba(83, 121, 148, 0.6);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 1px rgba(83, 121, 148, 0.6);
}
.form-control:active { }
select.form-control option > span:after { content: "  "; }
textarea.form-control { min-height: 100px; resize: vertical; }

.form-horizontal .control-label, .form-horizontal .radio, .form-horizontal .checkbox {
	padding-bottom:7px;
}

.sl-form .sl-rich-text .btn-toolbar { margin-bottom:10px; }
.sl-form .sl-rich-text textarea.form-control { min-height:70px; }

.sl-form-group { margin-bottom:15px; margin-left:180px; }
.sl-form-group .control-label { width:180px; float:left; margin-left:-180px; text-align: left; color: #7D848C; font-weight:normal; }
.sl-form-group input.form-control.inline { display:inline-block; }
.sl-form-group select.form-control { width:auto; display:inline-block; background-color:#ffffff; xpadding-right:7px; }
.sl-form-group select.form-control.full { width:100%; }
.sl-form-group select.form-control option { vertical-align:middle; }
.sl-form-group textarea.form-control { min-height:100px; resize: vertical; }

.sl-form-group-narrow { margin-bottom:10px; margin-left:120px; }
.sl-form-group-narrow .control-label { width:120px; float:left; margin-left:-120px; text-align: left; color: #7D848C; font-weight:normal; }

.sl-form-group.full { margin-left: 0; }
.sl-form-group.full .control-label { width:auto; float:none; margin-left:0; }

.sl-field-wrap > * { vertical-align:middle; }
.sl-field-wrap .btn .glyphicons { top:2px; margin-right:5px; }


.sl-form input[type="radio"],
.sl-form input[type="checkbox"] { margin-top:3px; }

textarea.form-control.list-view { min-height:150px; }
textarea.form-control.rich-text { min-height:200px; }


/* i'm not sure if this is actually doing anything since adding the fancy selectbox stuff */
select.form-control {
	-webkit-appearance: none; /* To gain control over the appearance on WebKit */
	-moz-appearance: none; /* To gain control over the appearance on Gecko */
	/* To gain control over the appearance on Presto (Opera) and Trident (IE)
		Note that it also work on Gecko and has partial effects on WebKit */
	background:#ffffff;
}
select.form-control { padding: 6px 26px 6px 6px; }

/* firefox, webkit */
select[size].form-control,select[multiple].form-control,select[multiple][size].form-control{
	background-image:none;
	padding-right:3px
}
select.form-control,select[size="0"].form-control,select[size="1"].form-control{
	/*background-image:url(data:image/png;base64,R0lGODlhDQAEAIAAAAAAAP8A/yH5BAEHAAEALAAAAAANAAQAAAILhA+hG5jMDpxvhgIAOw==);*/
	background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAECAYAAACHtL/sAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjExR/NCNwAAADJJREFUKFNjAIL/uPB/IIUVgmSgGCyArhGEwQpxQXQDQJBozSCIzQAQJEozCMIN+M8AAP4ne4UHS6XlAAAAAElFTkSuQmCC);
	background-repeat:no-repeat;
	background-position:right center;
	padding-right:20px
}

/* ie10 */
select.form-control::-ms-expand{
	display:none;
}


.form-control.form-searchbox-left,
.form-control.form-searchbox-right {
	background-image: url(/admin/image/search-icon.png);
	background-repeat: no-repeat;
}
.form-control.form-searchbox-right {
	background-position: 10px center;
	padding-left: 34px;
}

label.fancy-select-box-look { margin:0; font-weight:normal; }



/* this is a hack because controlling select box appearance is mess in webkit */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
	.form-horizontal .control-label {
		letter-spacing:0;
	}
	::-webkit-validation-bubble-message{
		-webkit-box-shadow:none;
		box-shadow:none;
		background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #666), color-stop(1, #000));
		border:0;
		color:#fff;
		font:13px/17px "Lucida Grande",Arial,"Liberation Sans",FreeSans,sans-serif;
		overflow:hidden;
		padding:15px 15px 17px;
		text-shadow:#000 0 0 1px;
		min-height:16px
	}
	::-webkit-validation-bubble-arrow,::-webkit-validation-bubble-top-outer-arrow,::-webkit-validation-bubble-top-inner-arrow{
		-webkit-box-shadow:none;
		box-shadow:none;
		background:#666;
		border-color:#666
	}
}


div.rich-text-inline h1,
div.rich-text-inline h2,
div.rich-text-inline h3,
div.rich-text-inline h4,
div.rich-text-inline h5,
div.rich-text-inline h6 { margin-top:0; }
div.rich-text-inline > p:last-child { margin-bottom:0; }




.btn-link:hover,
.btn-link:focus {
	text-decoration:none;
}

.btn-file {
	position: relative;
	overflow: hidden;
}
.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 999px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	outline: none;
	background: white;
	cursor: inherit;
	display: block;
}

.sl-question-checkbox-changer { margin-top: 20px; padding-left:34px; }
.sl-answers-option { margin-top: 15px; }