﻿/*common*/
ul, li, dl, dt, dd {list-style: none; padding: 0;}
a:link, a:visited, a:hover, a:focus, a:active {text-decoration: none;}
a:hover {cursor: pointer;}

.body_wrap {border: 1px solid #c5c5c5; z-index: 1100;}

/*top*/
.top_bg {height: 72px; color: white;}
.top_left_wrap {margin: 18px 0 10px 52px;}
.top_center_wrap {/*text-align: center; margin: 12px; width: 300px; position: relative; left:-80px;*/ }
.top_right_wrap {padding-top: 12px; margin: 8px 44px 16px 0; text-align: right;}
.top_big_title {margin-top: 0px;}
.subject_name {font-size: 16px; margin-top: 13px;}


/*----- 1단_submenu -----*/
.submenu_posin_wrap{display: block; position: fixed; z-index: 999;} 
.submenu_wrap {height: 36px; border-bottom :solid #bdbdec 1px; background: white; text-align: center;}
.submenu_wrap li {display: inline-block; }
.submenu_top ul li{position: relative; left: -200px; background-color: rgba(149, 128, 212, 1)}
.submenu_bottom ul li{position: relative; left: -110px;}
.submenu ul {float: center; height: 35px; padding: 0; margin: 0; background-color: #ffffff;}
.submenu ul li a {display: block; margin:0; padding: 8px 10px;}
.submenu ul li:hover, .submenu ul li a:hover {font-weight: bold; text-decoration: none;}

	/*menu_popup*/
	.modal-body .week {padding: 10px 0; border-bottom: 1px dotted #bebebe; font-weight: bold;}

		/*러닝맵*/
		.modal-body .week li, .modal-body .week dd {color:#555; font-weight:normal;}
		.modal-body .week li {margin-left: 40px;}
		.modal-body .current {display: inline-block; text-decoration: underline;}

		/*용어사전*/
		.modal-body .week dt, .modal-body .week dd {margin-left: 10px;}

		/*질문하기*/
		.m_iframe {
			width: 100%;
			height: 200px;
			padding: 2px 10px;
			margin: 15px 0px;
			line-height: 32px;
		}
		.modal-body .btn {float: right; margin-left: 5px;}

		/*메뉴설명*/
		.info_wrap {position: relative;}
		.info .close {
			color: white !important;
			font-weight: normal !important;
			filter: alpha(opacity=100) !important;
			opacity: 1 !important;
		}

		/*나의학습현황*/
		.pop_wrap {padding: 0; margin: 0; color: #333; font-family: 'Nanum Gothic', serif; font-size: 13px; line-height: 120%;}
		.pop_con li {list-style: square !important;}
		.pinktxt {color: #ed4186; font-weight: bold;}
		.pop_header {height: 37px; background-color: #358fc3;letter-spacing: -1px;}
			.pop_tit1 {float: left; width: 95px; padding: 10px 0 0 25px; color: #fff; font-size: 15px; font-weight: bold;}
			.pop_tit2 {float: left; width: 320px; padding: 10px 0 0 0; color: #bef6ff; font-size: 10pt; font-weight: bold;}
		.pop_con {margin: 15px 30px;}
			.pop_con ul {margin-left: 15px;}
			.pop_con tr {width: 345px;}
			.pop_con table {border-collapse: collapse;}
			.pop_con table td {padding: 3px; border: 1px solid #7a7a7a; text-align: center;}
			.pop_con .tgBg {background-color: #e6f3fb;}
				.fb {font-weight: bold;}
			.pop_tip {font-size: 12px; text-align: center;}
			.pop_bt {text-align: center;}
				.pop_bt_blue {
					display: inline-block;
					padding: 4px 25px 6px 25px;
					color: #fff;
					border: 1px solid #1c3460;
					background-color: #1a51a6;
					font-weight: bold;
				}
				.pop_bt_blue:hover {background-color: #183f7c;}


/*----- 2단_content -----*/

	/*footer*/
	.bottom_left_wrap {margin: 12px 20px 15px 20px;}
	.bottom_center_wrap {margin: 23px 0 13.5px -10px;}
	.line {float: left;}
	.serch_bt_mg {margin-left: -5px;}
	.w230 {float: left; width: 190px !important;}
	.bottom_right_wrap {float: right; margin: -68px -702px 10px 0px;}
		.num, .cur_pg, .all_pg, .left_arrow, .right_arrow {display: inline-block; position: relative;}
		.num {font-size: 40px;}
		.cur_pg {margin-left: 4px;}
		.all_pg {margin-right: 7px; color: #333;}
		a.left_arrow, a.right_arrow {width: 50px; height: 50px; top: 10px;}
	.bottom_xs {display: none; text-align: center;}
	.bottom .btn-group {padding: 23px 0px 15px 5px;}
	.step_bt button {border: 1px solid #aaa; background-color: #f1f1f1; color: #626262;}
	.step_bt button:hover {
		font-weight: bold;
		text-shadow: 1px 1px 2px rgba(0,0,0,0.2);
		box-shadow: inset 0px 1px 0px rgba(255,255,255,0.3), inset 0px -1px 0 rgba(0,0,0,0.2)
	}


/*-------------- 페이지별 contents -----------------*/
.pg1_bg, .pg2_bg, .pg3_bg, .pg5_bg, .pg7_bg, .pg8_bg {
	position: absolute;
	overflow: hidden;
	top: 0;
	z-index: -10;
}
.pg6_bg{
	position: absolute;
	overflow: hidden;
	top: 0;
}

/*pg1*/
.content1 .c_title {
	display: table;
	font-weight: bold;
}
.content1 .c_number, .content1 .c_list {float: left;}
.content1 .c_bt {display: block; clear: both;}
.bt_txt1 {}

/*pg2*/
.content2 .left {}
	.profile_mv {float: left; width: 100%;}
	.teName {
		display: inline-block;
		float: left;
		width: 100%;
		height: 23px;
		padding: 0 10px 2px 10px;
		margin: 3px 0;
		text-align: center;
		font-weight: bold;
	}
	.teName span {}
	.profile {float: left; overflow-y: auto;}
	.profile h5 {font-weight: bold;}
.content2 .right {}
	.study_goal, .study_con {float: left; overflow: hidden;}
	.study_goal {height: 173px;}
	.study_con {height: 247px; margin-top: 10px;}
	.content2 .c_title, .content2 .c_title2 {display: table; font-weight: bold;background-color:#ffffff;width:80px;text-align:center;}
	.content2 .c_list, .content2 .c_list2 {color: #555; float: left;}

/* pg3, pg5, pg6, pg7 common */
.content3 .c_title, .content5 .c_title, .content6 .c_title, .content7 .c_title {
	display: block;
	margin-bottom: 5px;
	font-size: 23px;
	font-weight: bold;
}
.content3 .c_list, .content5 .c_list {
	display: block;
	float: left;
    height: 45px;
	color: rgba(95, 57, 105, 1);
	font-size: 15px;
    overflow-y: auto;
}
.content3 .c_iframe, .content5 .c_iframe {
	width: 100%;
	height: 148px;
	padding: 0.3% 2%;
	margin: 18px 0px 22px 0px;
	background-color: #fff;
	line-height: 30px;
	font-size: 15px;
}
.content777 .c_iframe{
	width:83%;
}
.c_bt {display: block; clear: both; text-align: left;}
.pink_bt, .blue_bt {display: inline-block; font-size: 17px; line-height: 100%;}

/*pg3*/
.bt_save {width: 958px; height: 37px;}
/*pg4*/
/*.pg4_img {width: 958px; height: 37px; margin-top: -4px;}*/

/*pg5*/
.content5 .c_list{margin-top: -130px;}
.content5 .c_list_tip {
	display:block;
	float:left;
	width: 100%;
	margin-bottom: 1%;
	font-size: 13px;
	font-weight: bold;
    overflow-y: auto;
}

/*pg6*/
.content6 > div, .quiz1 > div, .quiz2 > div, .quiz3 > div, .result > div {float: left;}
	.quiz1, .quiz2, .quiz3 {}
	.content6_tit {width: 100%; border-bottom: 1px solid #98bccf;}
	.content6 .c_list_tip_t3 {margin-left: 1%;}
	.content6 .bullet {
		display: block;
		float: left;
		text-align: center;
	}
	.content6_q {width: 100%; height: 100%; float: left;}
	.q1 {display: block; margin: 3px 0 10px 20px; color: #555;}
	.q1_ex {height: 100%; margin: 10px 0; padding: 7px 10px; font-size: 14px;}
	.qna_a {
		display: block;
		float: left;
		padding: 5px 10px;
		color: #555;
		background-color: #fff;
		border: 1px solid #bcbcbc;
		border-radius: 3px;
		-webkit-transition: box-shadow .2s;
				transition: box-shadow .2s;
	}
	.green_bt {float: left;}
	.q1_ex {width: 100%; overflow-y: auto; color: #ffffff;}
	.content6_a {display: none; width: 100%;}
	.txt_a1 {margin-right: 2%; color: #ffffff; font-weight: bold; }
	.txt_a2 {display: block; font-weight: bold;}
	.content6 .c_list {
		display: block;
		padding: 5px 10px;
		margin: 10px 0;
		border: solid 1px #bcbcbc;
		background-color: #fafafa;
		color: #ffffff;
		overflow-y: auto;
	}
	.content6 .pink_bt, .content6 .blue_bt {float: right;}
	.content6 .blue_bt { margin-left: 4px;}

/* 결과확인
.result {width: 100%;}
.content6_m {width: 100%;}
	.m_title {
		display: block;
		width: 100%;
		color:#327ec0;
		font-weight:bold;
		text-align: center;
	}
	.txt_blue {color: #07497a;}
	.m_list {width: 100%; text-align: center;}
	.m_list .box {
		display: inline-block;
		border: 1px solid #98bccf;
		color: #ef4188;
		background-color: white;
		text-align: center;
	}
	.m_list .bullet {
		position: absolute;
		margin: -1% 0 0 -2%;
		background-position: center 0;
		background-image: url('../img/bullet.png');
	}
.content6_b {width: 100%; text-align: center;}
	.b_title {
		display: inline-block;
		width: 100%;
		color: #555;
		text-align: center;
	}
	.content6_b .green_bt2 {display: inline-block;}*/

/*pg6, pg7 common*/
.content6 .c_title, .content7 .c_title {float: left;}
.content7 .c_list_tip_t6, .content6 .c_list_tip_t3, .content7 .c_list_tip_t3 {
	padding: 0;
	margin-top: 15px;
	float:left;
	display:block;
}


.pg3_bg {}
@media (max-width: 240px) {
	.c_iframe_bg {top: 38px !important;}
}

.c_iframe {
	overflow-y: auto;
	float: left;
	height: 300px;
	padding: 0.5% 2%;
	margin: 10px 0 15px 0px;
	color: #555;
	line-height: 32px;
	opacity: 1;
	z-index: 0;
}
.c_iframe_bg {
	position: absolute;
	left: 0;
	overflow-y: auto;
	height: 302.5px;
	background-color: #fff;
	opacity: .5;
	z-index: -5;
}

/*pg7*/
.pg7_bg {}
@media (max-width: 240px) {
	.content7 .c_list_tip_t3 {display: none;  visibility: hidden;}
	.c_iframe2_bg {top: 38px !important;}
	.submenu_posin_wrap {display: none;  visibility: hidden;}
	.content2 .c_title, .content2 .c_title2 {display: table; font-weight: bold;background-color:#ffffff;width:80px;text-align:center;}
	 .content4{position:relative;top:0px;}
}

.c_iframe2 {
	overflow-y: auto;
	float: left;
	height: 230px;
	padding: 0.5% 2%;
	margin: -348px 0 15px 0px;
	color: #ffffff;
	line-height: 32px;
	opacity: 1;
	z-index: 0;
	width: 100%;
}
.c_iframe2_bg {
	position: absolute;
	left: 0;
	overflow-y: auto;
	height: 302.5px;
	background-color: #fff;
	opacity: .5;
	z-index: -5;
}

/*pg8*/
.content8 .c_title {display: table;}
.content8 .c_number {display: block; font-weight:bold;}
.content8 .c_list {display: block; font-weight: bold;}
.content_step {color: #777; -webkit-overflow-scrolling: touch;}
	.content_step .step_wrap {height: 100%;}
	.step_wrap .step, .step_num, .step_list {float: left;}
	.step_list .active {color: white !important;}
	.step_list .next {border-bottom: 1px solid #1653a2; color: #1653a2 !important;}


/*--------------- Responsive Web -----------------*/

/*--- ~xs size common ---*/
@media (max-width: 767px){
/*kkkkkkkkkk*/
	.content777 {padding: 0; margin-top: -267px;} 
	.content777 .c_iframe{
	width:88%;
}
    .content4{position:relative;top:0px;}
	#MY_VIDEO_1{width:100%;}
	.c_iframe2{}
	.b_iframe2{ width:100%; height:210px; color:rgba(76, 76, 124, 1); }
	.container {width: 100%;}
	.body_wrap {border: none !important;}
	.top_bg {height: 60px;}
	.top_left_wrap {margin: 9px 0 7px 15px;}
	.top_center_wrap {float:right; margin: -11px 22px 0 0;}
	.top_right_wrap {margin-right: 0;}
	.top_small_title {font-size: 12px;}
	.top_big_title {font-size: 15px;}
	.subject_name {font-size: 15px;}
	.submenu_posin_wrap{display: block; position: relative; z-index: 999;}
	.submenu_wrap {width: 100%; height: 100%; text-align: center;}
	.submenu_wrap li {display: block;}
	.submenu ul {width: 100%; height: 100%;}
	.submenu li {padding-left: 5px; font-size: 12px;}

	.submenu_top ul li{display: none;}
	.submenu_bottom ul li{display: none;}

	.z_box img{overflow: hidden; opacity: 0;}
	.z_box{
			background: url(img/03page_box_m.png) no-repeat;
		}

	.middle, .middle2 {height: auto;}
	.conent_wrap {margin-bottom: 0%;}
	.bottom {position: relative;}
	.form-control {height: 26px !important; font-size: 12px !important;}
	.modal {overflow-y: auto; -webkit-overflow-scrolling: touch;}
	.modal-title {font-size: 15px;}
	.modal-body {min-height: 320px; font-size: 13px;}
	.info_img {
		position: absolute;
		width: 250px; height: 340px;
		background-position: 0 0;
		background-image:url('../img/info_xs.png');
		background-repeat: no-repeat;
	}
	.info_close {
		position: absolute;
		width: 75px;
		height: 30px;
		padding-left: 10px !important;
		margin-top: 302px;
		z-index: 200;
		background-color: #333 !important;
		font-size: 15px !important;
	}
	.bottom_center_wrap2 {float: left; width: 240px;}
	.w230 {float: left; width: 250px !important;}
	.bottom_right_wrap2 {display: block; margin: 13px auto;}


		/*pg1*/
		.content1 {margin-top: 70px;}
		.content1 .c_title {margin-bottom: 15px; border-bottom: none !important; font-size: 27px; line-height: 120%;}
		.content1 .c_number {font-size: 15px;}
		.content1 .c_list {font-size: 12px;}
		.content1 .c_list .active {margin-bottom: 3px; font-size:15px;}
		.content1 .c_list ul {padding-left: 10px; line-height: 21px;}
		.content1 .c_bt {display: block; margin-top:200px; text-align: left;}
		.start_bt {display: inline-block; margin-bottom: 21%; font-size: 16px; line-height: 100%;}

		/*pg2*/
		.pg2_bg {}
		.content2 {padding: 0; margin-top: 20px;}
		.content2 .left {padding: 0 5%}
			.profile_mv {width: 100%;}
			.profile {width: 100%; height: 150px;}
			.profile p {font-size: 13px;}
		.content2 .right {margin-top: 10px; padding-right: 33px;}
			.study_goal, .study_con {
				float: left;
				width: 100%;
				height: 100%;
				padding: 10px 5% 0 5%;
				overflow-y: auto;
			}
			.content2 .c_title, .content2 .c_title2 {display: table; font-weight: bold;background-color:#ffffff;width:80px;text-align:center;}
			.content2 .c_list, .content2 .c_list2 {width: 100%; margin-top: 1%; padding: 7px 8px 0 8px; font-size: 13px; line-height: 20px; overflow-y: auto; border: 1px solid #bcbcbc; background-color: rgba(255, 255, 255, .6);}
			.content2 .c_list ul {height: 49px;}
			.content2 .c_list2 ul {height: 70px;}

		/*pg3, pg5, pg6, pg7 common*/
		.content3 .c_title, .content5 .c_title, .content6 .c_title, .content7 .c_title {font-size: 20px;}
		.content3 .c_list, .content6 .c_list, .content7 .c_list {font-size: 14px;}
		.content5 .c_list{font-size: 14px; position:relative; top:-233px; left: 60px}
		.content3 .c_iframe, .content5 .c_iframe, .content7 .c_iframe2 {
			width: 100%;
			font-size: 14px;
			line-height: 29px;
		}
		.content3 .c_iframe, .content5 .c_iframe {height: 190px; background-color: #fff;}
		.content7 .c_iframe2 {height: 270px;}

		/*pg3*/
		.content3 {padding: 0; margin-top: 4%;}
		.pg3_bg {
			width: 960px; height: 743px;
			/*background-image: url('img/pg3_bg_small.jpg');
			background-repeat: no-repeat;*/
		}

		/*pg5*/
		.content5 {padding: 0; margin-top: 4%;}
		.pg5_bg {
			width: 960px; height: 743px;
			/* background-image: url('img/pg5_bg_small.jpg');
			background-repeat: no-repeat; */
		}
		.content5 .c_list_tip {height: 42px;}
		.content5 .c_bt a {margin-bottom: 7px;}

		/*pg6*/
		.pg6_bg {}
		.content6 {padding: 0; margin-top: -10%;}
		.quiz1, .quiz2, .quiz3 {width: 100%; margin-left: -46px;}
			.content6_tit {height: 33px;}
			.content6 .bullet {width: 27px; height: 31px; font-size: 18px; background-size: 90%;}
			.content6_q {margin-top: 5%;}
			.q1 {margin: 3px 0 10px 25px; font-size: 14px;}
			.qna_a {
				width: 70%;
				height: 38px;
			}
			.content6_q .green_bt {margin-top: 1px;}
			.txt_a1 {font-size: 15px;}
			.txt_a2 {font-size: 18px;}
			.content6 .c_list {
				height: 150px; 
				padding: 7px 10px;
				margin: 10px 0;
				font-size: 14px;
				line-height: 23px;
			}
			.content6_a {margin-top: 3%;}
		.m_list .bullet {
			width: 23px; height: 27px;
			background-size: 100% auto;
			font-size: 15px;
		}
		.content6 .blue_bt {margin-bottom: 7px;}

		/*pg7*/
		.content7 {padding: 0; /*margin-top: 4%;*/}
		.pg7_bg {width: 960px; height: 743px;}
		.content7 .c_list_tip_t3 {font-size: 11px;}
		.c_iframe2_bg {left: 0px; width: 100.2%; height: 272px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {padding: 0; margin-top:-100px;}
		.content8 .c_title {
			margin-bottom: 10px;
			font-size: 15px;
		}
		.content8 .c_number {
			padding-left: 10px;
			margin-bottom: -5px;
			font-size: 15px;
		}
		.content8 .c_list {margin-top: 2px; padding-left: 10px; font-size: 27px;}
		.content8 .c_bt {margin: 25px 0 8px 0;}
		.close_bt {display: inline-block; margin-bottom: 2%; font-size: 16px; line-height: 100%;}

		.content_step {
			height: 230px;
			padding: 0px;
			margin: 8% 5% 0 5%;
			overflow-x: hidden;
			overflow-y: scroll;
			font-size: 12px;
			line-height: 20px;
		}
			.content_step .step_wrap {width: 100%; height: 100%;}
			.content_step .step {width: 100%; padding: 10px 0; border-bottom: 1px solid #e6e6e6;}
			.step_num {width: 100%; margin-bottom: 5px; font-size: 20px;}
}


/*--- xs: ~568px ---*/
@media (max-width: 568px) {
	
	.bottom_xs {display: block !important; width: 100%;}

 	.submenu_posin_wrap {display: none;  visibility: hidden;}


		/*pg1*/
		.pg1_bg {}

		/*pg3*/
		.pg3_bg {}

		.content4{position:relative;top:0px;}

		/*pg6*/
		.content6_m {margin-top:-20px;}
			.m_title {margin: 0; font-size: 15px;}
			.m_list .box {
				width: 55px; height: 55px;
				margin-left: 1%;
				font-size: 42px;
			}
			.m_list .bullet {}
		.content6_b {height: 100px;margin-top:40px;}
			.b_title { font-size: 14px;}
		.m_list .bullet {margin: -2.5% 0 0 -2%;}

		/*pg7*/
		.pg7_bg {}
		.content7 .c_title {margin-bottom: 0px !important;}
		.content7 .c_list_tip_t3 {width: 100%; margin-top: 0;}
		.c_iframe2_bg {top: 53px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {margin-top: 40px;}
		.content8 .c_bt {margin: 25px 0 8px 0;}
		.close_bt {font-size: 23px; line-height: 100%;}
}


/*--- xs: 569~767px ---*/
@media (min-width: 569px) and (max-width: 767px) {

		/*pg1*/
		.pg1_bg {}

		/*pg3*/
		.pg3_bg {}

		 .content4{margin-top:0px;}

		/*pg5*/
		.pg5_bg {}

		/*pg6*/
		.content6_q {}
		.content6_m {}
			.m_title {margin: 8% 0 5% 0; font-size: 18px;}
			.m_list .box {
				width: 60px; height: 60px;
				margin-left: 2%;
				
			}
			.m_list .bullet {}
		.content6_b {height: 100px;}
		.content6_b{margin-top:50px;margin-left:80px;}
			.b_title {margin: 20px 0;}

		/*pg7*/
		.pg7_bg {}
		.content7 .c_list_tip_t3 {margin-top: 10px; padding-left: 5px;}
		.c_iframe2_bg {top: 42px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {margin-top: 40px;}
		.content8 .c_bt {margin: 25px 0 8px 0;}
		.close_bt {font-size: 23px; line-height: 100%;}
}


/*--- sm size ---*/
@media (min-width: 768px) and (max-width: 991px) {
	.content777 {padding: 0 40px; margin-top: -186px;}
	.content777 .c_iframe{
	width:92%;
}
    .content4{margin-top:70px;}
	#MY_VIDEO_1{width:100%;}
	.z_box .img3{margin-left:-30px;}
	.c_iframe2{margin-top:-410px;left:-20px;}
	.content5 .c_list{position:relative;top:-245px;left:25px;}
	.content2.col-xs-12.col-sm-12.col-md-12{left:40px;}
	.container {width: 768px;}
	.top_small_title {font-size: 15px;}
	.submenu_posin_wrap {width: 766px;}
	.middle2 {height: 540px;}
	.info_img {width: 960px; height: 720px; background: url('../img/info_sm.png') no-repeat center 0;}

	.submenu_top ul li{position: relative; left: -100px; }
	.submenu_bottom ul li{position: relative; left: -10px;}

		.bottom_right_wrap{margin:-68px -300px 10px 0px;}

		/*common*/
		.content1 {margin-top: 120px;}
		.logo {width: 190px;}

		/*pg1*/
		.pg1_bg {}

		/*pg2*/
		.pg2_bg {}
		.content2 {padding: 0; margin-top: 60px;}
		.content2 .left {padding: 0 10px 0 20px;}
			.profile_mv {margin-left: 20px; width: 350px;}
			.teName {width: 300px; margin: 3px 0 3px 30px; }
			.profile {margin-left: 30px; width: 300px; height: 168px;}
			.profile p {font-size: 13px;}
		.content2 .right {}
			.study_goal {background: url('../img/study_goal01.png') no-repeat;}
			.study_con {background: url('../img/study_con01.png') no-repeat;}
			.study_goal, .study_con {width: 614px; height: 246px; margin: 0 0 0 -1.5%;}
			.content2 .c_title, .content2 .c_title2 {display:none;}
			.content2 .c_list, .content2 .c_list2 {font-size: 13px; width: 550px; position: relative; left:40px; top:-5px;}
			.content2 .c_list ul, .content2 .c_list2 ul {width: 650px; margin-top: 5px; padding: 5px 10px; line-height: 25px; overflow-y: auto; border: 1px solid #bcbcbc; background-color: rgba(255, 255, 255, .6);}
			.content2 .c_list ul {height: 88px;}
			.content2 .c_list2 ul {height: 138px;}

		/*pg3*/
		.pg3_bg {}
		.content3 {padding: 0; margin-top: 55px;}

		.b_iframe2{ width:100%; height:210px; color:rgba(76, 76, 124, 1);}

		/*pg5*/
		.pg5_bg {}
		.content5 {padding: 0; margin-top: 40px;}

		/*pg6*/
		.pg6_bg {}
		.quiz1, .quiz2, .quiz3 {width: 100%;}
		.qna_a {width: 500px;}
		.content6_b{margin-top:50px;margin-left:80px;}
		.m_list .box {
				width: 100px; height: 100px;
				margin-left: 35px;
				font-size: 100px;
			}
		/*pg7*/
		.pg7_bg {}
		.content7 {padding: 76px 0px 0px 38px; margin-top: 75px;}
		.c_iframe2_bg {top: 46px; left: 0px; width: 639px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {margin-top: 180px;}
		.content8 .c_bt {margin: 30px 0 8px 0;}
		.close_bt {font-size: 23px; line-height: 100%;}
		
}


/*--- md size ---*/
@media (min-width: 992px) {
	.content777 {padding: 0 40px; margin-top: -186px;width:100%;}
	.c_iframe2{margin-top:-410px;left:-20px;}
	.container {width: 960px;}
	.top_small_title {font-size: 15px;}
	.submenu_posin_wrap {width: 958px;}
	.middle2 {height: 646px;}
	.info_img {width: 960px; height: 720px; background: url('../img/info_md.png') no-repeat center 0;}

		/*common*/
		.logo {width: 190px;}

		/*pg1*/
		.pg1_bg {}
		.content1 {margin-top: 250px; margin-left: 80px;}

		/*pg2*/
		.pg2_bg {}
		.content2 {padding: 0; margin-top: 60px;}
		.content2 ol li{list-style-type:decimal; margin-left:15px;}
		.content2 ul li{list-style-type:disc; margin-left:15px;}
		.content2 .left {padding: 0 10px 0 20px;}
			.profile {margin: 0 10px 0 10px; width: 358px; height: 200px;}
			.profile p {font-size: 13px;}
		.content2 .right {padding-left: 5px;}
			.study_goal {width: 812px; height: 193px;}
			.study_con {width: 812px; height: 193px; margin-top: 10px;}
			.study_an {}
			.content2 .c_title, .content2 .c_title2 {display:none;}
			.content2 .c_list, .content2 .c_list2 {width: 710px; margin-top: 10px; margin-left: 62px; overflow-y: auto; font-size: 13px;}
			.content2 .c_list {height: 175px;}
			.content2 .c_list2 {height: 156px;}
			.content2 .c_list ul, .content2 .c_list2 ul {width: 100%; padding: 0 10px 0 32px; line-height: 30px;}

		/*pg3*/
		.pg3_bg {}
		.content3 {padding: 0 25px; margin-top: 55px;}
		.b_iframe2{ width:100%; height:210px; color:rgba(76, 76, 124, 1);}

		/*pg5*/
		.pg5_bg {}
		.content5 {padding: 0 40px; margin-top: -210px;}

		/*pg6*/
		.pg6_bg {}
		.q1 {width: 722px; }
		.qna_a {width: 600px;}
		.content6_b{padding-top:460px;}
		.m_list .box {
				width: 134px; height: 134px;
				margin-left: 35px;
				font-size: 100px;
			}
		
		 .content4{margin-top:70px;}
			

		/*pg7*/
		.pg7_bg {}
		.content7 {padding: 80px 90px 0px 29px; margin-top: 75px;}
		.content7 ul li{list-style-type:disc; margin-left:30px;}
		.c_iframe2_bg {top: 47px; left: 24px; width: 751px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {margin-top: 180px;}
		.content8 .c_bt {margin: 25px 0 8px 0;}
		.close_bt {font-size: 23px; line-height: 100%;}

}


/*--- sm & md size common ---*/
@media (min-width: 768px) {
	.top_center_wrap {}
	.middle {height: 646px;}
	.conent_wrap {}
	.submenu ul li {font-size: 13px;}
	.modal {padding-top: 150px !important;}
	.modal-body {height: 410px !important; overflow-y: auto;  -webkit-overflow-scrolling: touch;}
	.m_iframe {height: 300px;}
	.info_wrap {top: -130px; left: -105px; width: 750px; height: 720px;}
	.info_close {
		position: absolute;
		width: 70px;
		height: 35px;
		margin: 340px 0 0 445px;
		background-color: #333 !important;
		font-size: 17px !important;
	}


		/*pg1*/
		.content1 .c_title {margin-bottom: 20px; font-size: 40px;}
		.content1 .c_number {font-size:25px;}
		.content1 .c_list {font-size:18px;}
		.content1 .c_list .active {font-size: 25px;}
		.content1 .c_list ul {padding-left: 10px; line-height: 200%;}
		.content1 .c_bt {margin-top: 175px;}
		.start_bt {font-size: 25px; margin-left:-20px; margin-top: 10px; line-height: 100%;}

		/*pg3, pg5, pg7 common*/
		.content3 .c_title, .content5 .c_title, .content7 .c_title,
		.content3 .c_list, .content5 .c_list, .content7 .c_list, 
		.content5 .c_list_tip, .content7 .c_list_tip_t3 {padding: 0 5px;}
		.content3 .c_list, .content7 .c_list {font-size: 15px;}
		.content5 .c_list{font-size: 15px; position:relative;}
		.content3 .c_iframe, .content5 .c_iframe,{
			width: 100%;
			background-position: 0 0;
			background-repeat: no-repeat;
			font-size: 15px;
			line-height: 32px;
		}
		.c_world{
			position: relative;
			top: -350px;
			left:45px;
			line-height: 25px;
			color:rgba(76, 76, 124, 1);
		}

		/*pg5*/
		.content5 .c_list_tip {height: 45px;}
		.tip_arrow {
			position: fixed;
			width: 0;
			height: 0;
			margin-left: 15%;
			border-width: 9px;
			border-style: solid;
		}
		.save_tip {
			display: inline-block;
			padding: 5px 7px 7px;
			margin: 15px 0 0 -130px;
			font-size: 12px;
		}
		.c_box{
			position: relative;
			left:80px;
			top:80px;
		}
		.p_box{
			position: relative;
			top:72px;
			left:78px;
		}
		.z_box{
			position: relative;
			top:25px;
			left:-24px;
		}
	}	
		/*pg6*/
		.pg6_bg {}
		.content6 {padding: 0; margin-top: 44px 0px 0px 28px;}
		.quiz1, .quiz2, .quiz3 {}
			.content6_tit {height: 40px;}
			.content6 .bullet {font-size: 20px;}
			.content6_q {margin: -300px -94px 0px 45px;}
			.q1 {margin: 3px 0 10px 30px; font-size: 15px; overflow-y: auto; height: 45px; }
			.q1_ex {height: 157px; margin: 46px 0; padding: 7px 10px; font-size: 15px;}
			.qna_a {
				padding: 5px 10px;
				font-size: 15px;
			}
			.content6_a {margin-top: 20px;}
			.txt_a1 {float:left;font-size: 15px;}
			.txt_a2 {font-size: 16px; overflow-y: auto; height:40px;line-height:20px; }
			.content6 .c_list {
				height: 135px; 
				padding: 5px 10px;
				margin: 10px 0;
				font-size: 15px;
				line-height: 25px;
			}
		.content6_m {}
			.m_title {margin: 50px 0 35px 0; font-size:20px;}
			.m_list {height: 150px;}
			
		.m_list .bullet {
			width: 27px; height: 31px;
			background-size: 100% auto;
			font-size: 20px;
		}


		/*pg6, pg7 common*/
		.content6 .c_list_tip_t3, .content7 .c_list_tip_t3 {font-size: 12px;}

		/*pg8*/
		.pg8_bg {}
		.content8 {padding: 0; }
		.content8 .c_title {
			margin-bottom: 20px;
			font-size:25px;
		}
		.content8 .c_number {
			padding: 0 30px;
			font-size: 22px;
		}
		.content8 .c_list {
			margin: 0 30px;
			font-size: 35px;
		}
		/*
		.content8 .c_bt {margin-top: 60px;}
		.close_bt {font-size: 23px; line-height: 100%;}
		*/
		

		.content_step {
			height: 140px;
			padding: 20px 0px;
			margin: 60px 20px 30px 20px;
			overflow-y: hidden;
			overflow-x: scroll;
			font-size: 15px;
			line-height: 25px;
		}
			.content_step .step_wrap {width: 4130px; height: 100%;}
			.step {height: 80px;}
			.step_num {margin: 0 10px 0 15px; font-size: 25px;}
			.step_list ul {padding-right: 30px; border-right: 1px solid #e6e6e6;}
}

/*#MY_VIDEO_1 {width:100%;}
*/
/*		.audiojs { margin: 15px 0px 20px;background: transparent; box-shadow: none; }
		.audiojs div { display: none; }*/

		.content4 .p_box{
     
			position: relative;
			top:52px;
		
		}







		/*wsdsdsd0150607*/



		.content777 .c_iframe{
			overflow-y: auto;
			float: left;
			height: 148px;
			padding: 0.5% 2%;
			margin: 10px 0 15px 0px;
			color: #555;
			line-height: 32px;
			opacity: 1;
			z-index: 0;
		}

@media (max-width: 400px){

			.content5 .c_list{left:0px;border-bottom:2px solid red;margin-right:20px;height:50px;}
			.img4{opacity:0;}
			.glglgl{display:inline;}

			.c_iframe2{width:100%;height:300px;}/*페이지3모바일*/
			.content777 .c_iframe{margin-top:-15px;}
			 .content4{position:relative;top:0px;}
		}
		/*-------------------------------------------------------*/

		

		.content777{
			line-height: 30px;
			font-size: 15px;
			width:100%;

		}

		