/*
.guide_content * { font-family: 'NanumSquare'; letter-spacing: -0.5px; font-size: 15px; font-smooth: always; }
.font_light { font-family: 'NanumSquareLight'; }
.font-bold { font-family: 'NanumSquareBold'; }
.font-extrabold { font-family: 'NanumSquareExtraBold'; }

.font_ulight { font-family: 'NanumBarunGothicUltraLight'; }
.font_light { font-family: 'NanumBarunGothicLight'; }
.font-bold { font-family: 'NanumBarunGothic'; }
.font-extrabold { font-family: 'NanumSquareExtraBold'; }
*/

.guide_content * { font-family: 'Noto Sans', sans-serif; font-weight: 400; letter-spacing: -0.5px; font-size: 15px; line-height: 24px; }
.font_light { font-weight: 300 !important; }
.font-bold { font-weight: 700 !important; }
.font-extrabold { font-weight: 900 !important; }

.font-14 { font-size: 14px; }
.font-15 { font-size: 15px; }
.font-16 { font-size: 16px; }
.font-17 { font-size: 17px; }
.font-18 { font-size: 18px; }
.font-19 { font-size: 19px; }
.font-20 { font-size: 20px; }

.mb-5 { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }
.mb-15 { margin-bottom: 15px; }
.mb-20 { margin-bottom: 20px; }
.mb-25 { margin-bottom: 25px; }
.mb-30 { margin-bottom: 30px; }
.mb-35 { margin-bottom: 35px; }
.mb-40 { margin-bottom: 40px; }

.font-green { color: #00a661; }
.font-blue { color: #4593fc; }
.font-white { color: #ffffff; }

.binder { width: 1300px; margin: 0 auto; }
.guide_content { margin: 100px 0px; padding: 0px; }
.guide_container { display: flex; width: 100%; justify-content: space-between; }

.display_flex { display: flex; }

#left_side,
#right_side {
	width: 630px;
	box-sizing: border-box;
}
#left_side {}
#right_side {
	padding-top: 80px;
}

.section_text p {
	margin-bottom: 5px;
}
.section_content {
	margin-top: 30px;
}
.section_content dd p {
	margin-bottom: 4px; 
}

section {
	position: relative;
}
.section_bar {
	position: absolute;
	width: 3px;
	height: 100%;
	background: #3182f6;
	top: 0px;
	left: -40px;
	display: none;
}

/* left_side */
#left_side section {}
#left_side .bar {
	width: 100%;
	height: 1px;
	background: #ddd;
	margin: 60px 0px;
}
#left_side .sub_title { font-size: 15px; }
#left_side h3 { margin-bottom: 30px; }
#left_side h3 span { 
	display: inline-block; 
	color: #3182f6;
	font-size: 16px; 
	width: 24px; 
	height: 24px; 
	line-height: 24px; 
	margin-right: 15px;
	text-align: center; 
	border-radius: 5px;
	background: #e5e8eb;
}

#section01 {}
#section01 h2 {
	font-size: 40px;
	margin: 65px 0px 50px;
}
#section01 .download_btn {
	width: 160px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	display: block;
	color: #fff;
	border-radius: 5px;
	background: #3182f6;
	margin: 20px 0px 45px;
}


#section02 {}
#section02 .specification {
	display: flex;
	padding-left: 20px;
}
#section02 .specification ul:first-child {
	margin-right: 45px;
}
#section02 .specification ul:first-child li {
	font-weight: 600;
}
#section02 .specification li {
	margin-bottom: 6px;
}




#section03 {}
#section03 .java_download {
	background: #e5e8eb;
	display: block;
	text-align: center;
	padding: 10px 0px;
	border-radius: 5px;
	margin: 20px 0px 55px;
}
#section03 #dir_tree_box {}
#section03 #dir_tree {
	padding: 12px 60px 12px 15px;
	margin-top: 5px;
	background: #efefef;
	font-weight: 600;
	cursor: pointer;
}
#section03 #dir_tree_dd {
	/* display: none; */
}
#section03 #dir_tree img {
	width: 12px;
	height: 12px;
	margin-left: 10px;
}
#section03 .display_flex {
	background: #efefef;
	border-radius: 0 0 5px 5px;
	border-top: 1px solid #e0e0e0;
	padding: 10px 20px 30px 20px;
}
#section03 .display_flex ul:first-child {
	margin-right: 50px;
}
#section03 .display_flex ul li {
	margin-top: 5px;
}



#section04 {}
#section04 #dir_tree_box_2 {
	margin: 5px 0px 40px;
}
#section04 #dir_tree_2 {
    padding: 12px 60px 12px 15px;
    margin-top: 5px;
    background: #efefef;
    font-weight: 600;
    cursor: pointer;
}
#section04 .param_descyption {
	width: 100%;
	background: #efefef;
	border-top: 1px solid #e0e0e0;
	padding: 10px 20px 30px 20px;
	margin: 0px 0px 40px 0px;
	border-radius: 0 0 5px 5px;
}
#section04 .param_descyption dl {}
#section04 .param_descyption dl dt {
	font-size: 16px;
	margin-top: 5px;
	font-weight: 600;
}
#section04 .param_descyption dl dd {
	margin-bottom: 20px;
}
#section04 .param_descyption dl dd ul {}
#section04 .param_descyption dl dd ul li {
	margin: 3px 0px;
	padding-left: 10px;
	font-weight: 300;
	letter-spacing: 0.5px;
}
#section04 .param_descyption.process_box {
	margin-top: 5px;
	padding: 20px;
	border: 0px;
	border-radius: 5px;
}



#section05 {}
#section06 {}
/* //left_side */



#code_box {
	width: 630px;
	background: #1e2f4a;
	padding-bottom: 400px;
	border-radius: 5px;
	margin: 0px auto;
	overflow: hidden;
}
.box_title {
	font-size: 12px;
	color: #ddd !important;
	display: inline-block;
	padding: 1px 20px;
	border-radius: 20px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 10px;
	cursor: pointer;
}
.box_title:hover {
	color: #fff !important;
}
.box_title.active {
	color: #222 !important;
	background: #fff;
}
.code_bar {
	width: 100%;
	height: 1px;
	background: #666;
	margin-bottom: 20px;
}
.code_container {
	width: 570px;
	margin: 0 auto;
	height: 770px;
	overflow-x: hidden;
	overflow-y: scroll;
}
.code_container::-webkit-scrollbar {
    width: 0px;  
}

#info_box p, #info_box span,
#process_box p, #process_box span {
	line-height: 24px;
}

#info_box {
	margin-bottom: 10px;
}


.code_guide_area {
	padding: 5px 10px;
}
.code_guide_area.active {
	background: #000;
	overflow: hidden;
}
.code_guide_area.active .font-white {
	background: #000;
	color: #ffb74d;
}

.blue_bar {
	position: absolute;
	left: -20px;
	top: 10px;
	width: 4px;
	background: #4593fc;
}

.blue_bar_id_pwd { height: 120px; }
.blue_bar_send_server { height: 610px; }
.blue_bar_db { height: 520px; }
.blue_bar_table { height: 400px; }
.blue_bar_kisa { height: 180px; }
.blue_bar_process { height: 255px;}
.blue_bar_sql { height: 400px; }