@charset "UTF-8";
/* ====== button ======= */
.elr_cmap_3btn ul li:nth-child(2) {
  border: 2px solid #007A60;
}
.elr_cmap_3btn ul li:nth-child(2) a {
  background: #007A60;
}
.elr_cmap_3btn_tech ul li:nth-child(2) {
  border: 2px solid #007A60;
  color: #007A60;
}

.elr_cmap_3btn ul li:nth-child(3) {
  border: 2px solid #a257a2;
}
.elr_cmap_3btn ul li:nth-child(3) a {
  background: #a257a2;
}
.elr_cmap_3btn_dx ul li:nth-child(3) {
  border: 2px solid #a257a2;
  color: #a257a2;
}
/* ======///// button ======= */

#elr_cmap_mng{
	margin: 0;
	padding: 0;
}
/* ====== h3 title ======= */
.elr_cmap_title {
    margin: 0;
    padding: 0;
}

.elr_cmap_title h3{
    margin: 0 0 30px;
    padding: 0;
    background: #2266af;
    padding: 5px 5px 5px 20px;
    font-size: 18px;
    color: #fff;
    letter-spacing: 10px;
}


/* ======///// h3 title ======= */
/* ====== map table ======= */
.elr_cmap_body {
    margin: 0;
    padding: 0;
}

.elr_cmap_class {
    margin: 0;
    padding: 0 0 0 95px;
    overflow: hidden;
}
.elr_cmap_class h4 {
    margin: 0;
    padding: 0;
    display: block;
    text-align: center;
    width: 300px;
    float: left;
    color: #ff5e00;
    font-size: 16px;
    font-weight: bold;
}

.elr_cmap_data {
    margin: 0;
    padding: 0;
    position: relative;
}

.elr_cmap_table {
    margin: 0 0 40px;
    padding: 0;
    width: 100%;
    border-collapse: separate;
    position: relative;
    border-spacing: 0;
    border: 1px solid #c4cee6;
    z-index: 100;
    /* display: none; */
}

.elr_cmap_table_tr {
    margin: 0;
    padding: 0;
}
/* ================= color */
.elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_th {
    background: #006aab;
}
.elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_th {
    background: #5082bb;
}
.elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_td {
    background: #edf9fe;
}
.elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_td {
    background: #ffffff;
}

/* pc and lang */
#elr_cmap_pcskill .elr_cmap_title h3 {
	background: #fd4e01;
}
#elr_cmap_pcskill .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_th{
	background: #fd4e01;
}
#elr_cmap_pcskill .elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_th{
	background: #ff7b3d;
}
#elr_cmap_langskill .elr_cmap_title h3 {
	background: #fd4e01;
}
#elr_cmap_langskill .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_th{
	background: #fd4e01;
}
#elr_cmap_langskill .elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_th{
	background: #ff7b3d;
}
#elr_cmap_langskill .elr_cmap_table_th_sub{
	background: #ffc207;
}
#elr_cmap_pcskill .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_td,
#elr_cmap_langskill .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_td{
	background: #fffde3;
}

#elr_cmap_pcskill .elr_cmap_course_li,
#elr_cmap_langskill .elr_cmap_course_li{
	background: #fee6bb;
}

#elr_cmap_pcskill .elr_cmap_table,
#elr_cmap_langskill .elr_cmap_table{
    border: 1px solid #fddaa6;
}

#elr_cmap_pcskill .elr_cmap_table_td,
#elr_cmap_langskill .elr_cmap_table_td {
	border-bottom: 1px solid #fddaa6;
}
#elr_cmap_pcskill .elr_cmap_vline_set div,
#elr_cmap_langskill .elr_cmap_vline_set div{
	border-color: #fddaa6;
}

/* tech */
#elr_cmap_tech .elr_cmap_title h3 {
	background: #008060;
}
#elr_cmap_tech .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_th{
	background: #008060;
}
#elr_cmap_tech .elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_th{
	background: #15a68f;
}
#elr_cmap_tech .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_td{
	background: #eef7f5;
}

#elr_cmap_tech .elr_cmap_course_li{
	background: #caecde;
}

#elr_cmap_tech .elr_cmap_table{
    border: 1px solid #aed5ca;
}

#elr_cmap_tech .elr_cmap_table_td{
	border-bottom: 1px solid #aed5ca;
}
#elr_cmap_tech .elr_cmap_vline_set div{
	border-color: #aed5ca;
}

/* dx */
#elr_cmap_dx .elr_cmap_table {
	border-color: #cb5897;
}
#elr_cmap_dx .elr_cmap_title h3 {
    background: #a257a2;
}
#elr_cmap_dx .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_th {
    background: #a257a2;
}
#elr_cmap_dx .elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_th {
    background: #d690d6;
}
#elr_cmap_dx .elr_cmap_table_tr:nth-child(2n-1) .elr_cmap_table_td {
    background: #fdf7fd;
}
#elr_cmap_dx .elr_cmap_table_tr:nth-child(2n-0) .elr_cmap_table_td {
    background: #ffffff;
}
#elr_cmap_dx .elr_cmap_course_li {
    background: #ffdeff;
}
#elr_cmap_dx  .elr_cmap_table_td{
	border-color: #dccedc;
}


/* ================= ////// color */

.elr_cmap_table_th {
    margin: 0;
    padding: 0;
    background: #006aab;
    width: 100px;
    height: 100%;
    vertical-align: middle;
    border-bottom: 1px solid #ffffff;
}

.elr_cmap_table_th h5 {
    margin: 0;
    padding: 0 2px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    color: #fff;
    font-size: 13px;
    letter-spacing: 1px;
    display: block;
}


.elr_cmap_table_th.sub_th {
	margin: 0;
	padding: 0 8px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	color: #fff;
	font-size: 13px;
	letter-spacing: -0.1px;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 20px;
}
.elr_cmap_table_th.sub_th h5 {
	margin: 0;
	padding: 0;
	width: 12px;
	display: block;
	line-height: 19px;
	word-break: break-all;
	-webkit-writing-mode: horizontal-tb;
	-ms-writing-mode: horizontal-tb;
	writing-mode: horizontal-tb;
}
.elr_cmap_table_th_sub {
    margin: 0;
    padding: 0 8px;
    text-align: center;
    vertical-align: middle;
    font-weight: bold;
    color: #fff;
    font-size: 13px;
    letter-spacing: -0.1px;
    border-bottom: 1px solid;
    background: #7697c6;
}
.sub_th_sp{
	display: none;
}

.elr_cmap_class_sp {
    margin: 0;
    padding: 0;
    display: none;
}

.elr_cmap_table_td {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #c4cee6;
    position: relative;
    width: 900px;
}

.elr_cmap_course_ul {
	margin: 0;
	padding: 10px;
	position: relative;
	z-index: 300;
}

.elr_cmap_course_li {
    margin: 0 0 10px;
    padding: 0;
    background: #bfe9f8;
    vertical-align: middle;
    line-height: 30px;
    font-size: 14px;
    font-weight: bold;
    z-index: 100;
    border-radius: 4px;
    position: relative;
    letter-spacing: -0.1px;
    /* display: inline-block; */
}

.elr_cmap_course_li:last-child {
	margin-bottom: 0;
}

.elr_cmap_course_li a {
    margin: 0;
    padding: 5px;
    display: block;
}

.elr_cmap_course_li .elr_cmap_course_mobiles {
    margin: 0 0 0 1.5em;
    text-indent: -1.5em;
}

.elr_cmap_course_li a img {
    margin: 0;
    padding: 0;
    width: 17px;
    margin-right: 5px;
}

.elr_cmap_havec{
	margin-bottom: 0;
	border-bottom: 2px dashed #ffffff;
}


/* ===== icon set ===== */
.elr_cmap_course_icon1 {
    margin: 0 8px 0 0;
    padding: 4px 2px;
    width: auto;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #e4a572;
}

.elr_c_sd_iconNew {
    margin: 0 4px;
    padding: 4px 2px;
    width: 50px;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #e4828b;
}

.elr_c_sd_iconRev {
    margin: 0 4px;
    padding: 4px 2px;
    width: 50px;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #8acd75;
}

.elr_c_sd_iconPC {
    margin: 0 4px;
    padding: 4px 2px;
    width: 50px;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #6C6BA9;
}

.elr_c_sd_iconDev {
    margin: 0 4px;
    padding: 4px 2px;
    width: 50px;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #58a7d9;
}

.elr_c_sd_iconMultilingual {
    margin: 0 4px;
    padding: 4px 2px;
    width: auto;
    text-align: center;
    font-size: 12px;
    line-height: 1em;
    letter-spacing: 0.1em;
    color: #fff;
    background: #e4a572;
}
/* ===== icon set ===== */

.elr_cmap_vline_set {
    margin: 0;
    padding: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 200;
    top: 0;
    left: 0;
}

.elr_cmap_vline {
    margin: 0;
    padding: 0;
    border-left: 1px solid #c4cee6;
    height: 100%;
    display: inline-block;
    position: absolute;
}

.elr_cmap_vline1 {
    left: calc((100%) / 6 * 1);
    display: none;
}

.elr_cmap_vline2 {
    left: calc((100%) / 6 * 2);
}

.elr_cmap_vline3 {
    left: calc((100%) / 6 * 3);
    display: none;
}

.elr_cmap_vline4 {
    left: calc((100%) / 6 * 4);
}

.elr_cmap_vline5 {
    left: calc((100%) / 6 * 5);
    display: none;
}


/* ======////////// map table ======= */

/* ====== map table width ======= */
.elr_cmap_w1-2 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
.elr_cmap_w1-3 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 2 - 20px);
}
.elr_cmap_w1-4 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 3 - 20px);
}
.elr_cmap_w1-5 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 4 - 20px);
}
.elr_cmap_w1-6 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 5 - 20px);
}
.elr_cmap_w1-7 {
    margin-left: calc((100% + 20px) / 6 * 0);
    width: calc((100% + 20px) / 6 * 6 - 20px);
}
.elr_cmap_w2-3 {
    margin-left: calc((100% + 20px) / 6 * 1);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
.elr_cmap_w2-4 {
    margin-left: calc((100% + 20px) / 6 * 1);
    width: calc((100% + 20px) / 6 * 2 - 20px);
}
.elr_cmap_w2-5 {
    margin-left: calc((100% + 20px) / 6 * 1);
    width: calc((100% + 20px) / 6 * 3 - 20px);
}
.elr_cmap_w2-6 {
    margin-left: calc((100% + 20px) / 6 * 1);
    width: calc((100% + 20px) / 6 * 4 - 20px);
}
.elr_cmap_w2-7 {
    margin-left: calc((100% + 20px) / 6 * 1);
    width: calc((100% + 20px) / 6 * 5 - 20px);
}
.elr_cmap_w3-4 {
    margin-left: calc((100% + 20px) / 6 * 2);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
.elr_cmap_w3-5 {
    margin-left: calc((100% + 20px) / 6 * 2);
    width: calc((100% + 20px) / 6 * 2 - 20px);
}
.elr_cmap_w3-6 {
    margin-left: calc((100% + 20px) / 6 * 2);
    width: calc((100% + 20px) / 6 * 3 - 20px);
}
.elr_cmap_w3-7 {
    margin-left: calc((100% + 20px) / 6 * 2);
    width: calc((100% + 20px) / 6 * 4 - 20px);
}
.elr_cmap_w4-5 {
    margin-left: calc((100% + 20px) / 6 * 3);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
.elr_cmap_w4-6 {
    margin-left: calc((100% + 20px) / 6 * 3);
    width: calc((100% + 20px) / 6 * 2 - 20px);
}
.elr_cmap_w4-7 {
    margin-left: calc((100% + 20px) / 6 * 3);
    width: calc((100% + 20px) / 6 * 3 - 20px);
}
.elr_cmap_w5-6 {
    margin-left: calc((100% + 20px) / 6 * 4);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
.elr_cmap_w5-7 {
    margin-left: calc((100% + 20px) / 6 * 4);
    width: calc((100% + 20px) / 6 * 2 - 20px);
}
.elr_cmap_w6-7 {
    margin-left: calc((100% + 20px) / 6 * 5);
    width: calc((100% + 20px) / 6 * 1 - 20px);
}
/* ======////////// map table width ======= */


/* ====== media query ======= */
@media (max-width: 640px){
	.elr_cmap_title h3 {
		text-align: center;
	}
	.elr_cmap_table_th h5, .elr_cmap_table_th.sub_th h5,.elr_cmap_table_th_sub h6 {
		height: 40px;
		vertical-align: middle;
		line-height: 40px;
		width: 100%;
	}
	
	.elr_cmap_class {
		display: none;
	}
	.elr_cmap_data {
		margin: 0 auto;
		width: 320px;
	}
	.elr_cmap_table_th,.elr_cmap_table_th.sub_th {
		width: 100%;
		display: block;
		padding: 0;
		margin: 0;
		border-right: none;
	}
	.elr_cmap_table_tr {
        display: block;
        margin: 0 0 30px;
        border: 1px solid #c4cee6;
	}
	.elr_cmap_table_td {
		display: block;
		width: 100%;
	}
    .elr_cmap_table_th_sub {
		width: 100%;
		display: block;
		padding: 0;
		margin: 0;
    }
	.sub_th_sp{
		display: block;
	}
    .elr_cmap_table {
		border: none;
    }
	.elr_cmap_class_sp {
		display: block;
		overflow: hidden;
		background: #ffffff;
	}
	.elr_cmap_class_sp li {
		color: #ff5e00;
		font-weight: bold;
		display: block;
		text-align: center;
		border-right: 1px solid #b4b6b6;
		border-bottom: 1px solid #b4b6b6;
		width: calc(100% / 3);
		float: left;
	}
	
	.elr_cmap_class_sp li:last-child{
		border-right: none;
	}
	.elr_cmap_course_li {
	    line-height: 15px;
	    font-size: 11px;
	}
	.elr_cmap_course_li a img {
	    width: 10px;
	}
	.elr_cmap_course_li a span {
	    font-size: 10px;
	    padding: 2px;
	}

	.elr_cmap_course_ul {
		padding: 5px;
	}
	
	.elr_cmap_w1-2,
	.elr_cmap_w1-3,
	.elr_cmap_w2-3 {
	    margin-left: calc((100% + 10px) / 6 * 0);
		width: calc((100% + 10px) / 6 * 2 - 10px);
	}
	
	.elr_cmap_w1-4,
	.elr_cmap_w1-5,
	.elr_cmap_w2-4,
	.elr_cmap_w2-5 {
	    margin-left: calc((100% + 10px) / 6 * 0);
		width: calc((100% + 10px) / 6 * 4 - 10px);
	}
	
	.elr_cmap_w1-6,
	.elr_cmap_w1-7,
	.elr_cmap_w2-6,
	.elr_cmap_w2-7 {
	    margin-left: calc((100% + 10px) / 6 * 0);
		width: calc((100% + 10px) / 6 * 6 - 10px);
	}
	
	.elr_cmap_w3-4,
	.elr_cmap_w3-5,
	.elr_cmap_w4-5 {
	    margin-left: calc((100% + 10px) / 6 * 2);
		width: calc((100% + 10px) / 6 * 2 - 10px);
	}
	
	.elr_cmap_w3-6,
	.elr_cmap_w3-7,
	.elr_cmap_w4-6,
	.elr_cmap_w4-7 {
	    margin-left: calc((100% + 10px) / 6 * 2);
		width: calc((100% + 10px) / 6 * 4 - 10px);
	}
	
	.elr_cmap_w5-6,
	.elr_cmap_w5-7,
	.elr_cmap_w6-7 {
	    margin-left: calc((100% + 10px) / 6 * 4);
		width: calc((100% + 10px) / 6 * 2 - 10px);
	}
}