@charset "utf-8";

/* 공통 */

/* *
   * CSS Reset - Layout Type [F]
   * Site 기준	 : 클라우드전공 (Base: type A)
   * Make	 : 2025-05-08
   * Last Modify : 2025-06-23
*/

/*#wrap					{color:#ffffff; background:#4c4f62}*/


/* ============================== [01] Common .Start ============================== */
#wrap.type_F						{background:#ffffff}
#wrap.type_F #GNB					{background:#ffffff; border-bottom:#efefef 1px solid; box-sizing:border-box}
#wrap.type_F #GNB .innerWrap				{background:#ffffff}
#wrap.type_F #GNB ul li					{color:#000000}
#wrap.type_F #GNB ul li:after				{background:#000000}

#wrap.type_F #LNB					{border-bottom:#efefef 1px solid; box-sizing:border-box}
/*#wrap.type_F #*/


/*
#wrap .stepBoxWrap									{position: relative; width: 100%; padding: 5px 0; box-sizing: border-box}
#wrap .stepBoxWrap li								{position: relative; width: 100%; background: transparent; border: #0c1019 1px solid; padding: 10px; margin-bottom: 30px; box-sizing: border-box}
#wrap .stepBoxWrap li:after							{position: absolute; display: block; content: ""; width: 0; height: 0; border-top: 20px solid #0e1c37; border-left: 20px solid transparent; border-right: 20px solid transparent; bottom: -25px; left: 50%; transform: translateX(-50%)}
#wrap .stepBoxWrap li:last-of-type					{margin: 0}
#wrap .stepBoxWrap li:last-of-type:after			{display: none}
*/
#wrap .stepBoxWrap					{display: grid; width: 100%; grid-template-columns: repeat(3, 1fr); grid-gap: 40px; box-sizing: border-box;}
#wrap .stepBoxWrap li					{height: 100%; text-align: center}
#wrap .stepBoxWrap li:after				{border-left: 20px solid #0e1c37; border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-right: unset; top: 50%; right: -30px; bottom: unset; left: unset; transform: translate(0, -50%)}

/*#wrap.type_B #Footer					{clear:both; color:#cfcfcf; background:#2b2b2b}*/
/* ============================== [01] Common .Start ============================== */


/* ============================== [01] Main Page .Start ============================== */
#wrap.type_F #Contents.main				{background:#f9f8f8}


#wrap.main #Poster					{height:600px; background-size:cover}
#wrap.main #Poster .li_poster				{height:600px}
#wrap.main #Poster:hover .btnMove			{top:260px}
#wrap.main #Poster:hover .btnTimer			{top:20px}

#wrap.main #Contents					{padding-bottom: 30px}

#wrap #sect_1						{margin-top: 30px}
#wrap #sect_1:after					{content:""; clear:both; float:none; display:block; height:0}
#wrap #sect_1 .innerWrap			{display: grid; height: 260px; grid-template-columns: 640px auto; grid-gap: 24px;}


#wrap #sect_1 .icon-plus		{width: 30px; height: 30px; color: #454545; transition: filter 0.2s ease, color 0.2s ease;}
#wrap #sect_1 .icon-plus path	{transition: stroke-width 0.2s ease;}
#wrap #sect_1 .btn_more:hover .icon-plus	{color: #005fa3; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));}
#wrap #sect_1 .btn_more:focus .icon-plus	{color: #005fa3; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));}
#wrap #sect_1 .btn_more:hover .icon-plus path {stroke-width: 2.5;}
#wrap #sect_1 .btn_more:focus .icon-plus path {stroke-width: 2.5;}

#wrap #sect_notice				{position:relative; height: 100%; overflow: hidden;}
#wrap #noticeWrap				{position:relative; width: 100%; height: 100%; margin-right:20px; background:#fff; border:#eeeff2 1px solid; box-sizing:border-box}
#wrap #noticeWrap::before			{content:""; position:absolute; width: 100%; height: 1px; top: 55px; left:0; background:#efefef; box-sizing:border-box}
#wrap #noticeWrap .noticeText			{overflow: hidden;}
#wrap #noticeWrap .listSet			{position: absolute; display:none; width: 100%; height: calc(100% - 55px); text-align:left; color: #454545; top: 55px; left: 0; padding: 20px 30px; box-sizing:border-box; overflow: hidden; border: none;}
#wrap #noticeWrap .selectOn .listSet		{display:block}
#wrap #noticeWrap .listSet ul			{width: 100%; height: 100%; padding: 0; box-sizing:border-box; overflow-y: auto;}
#wrap #noticeWrap .listSet ul:after		{content:""; clear:both; float:none; display:block; height:0}
#wrap #noticeWrap .listSet .list		{position:relative; display: flex; width: 100%; height: 20px; line-height: 20px; padding: 7px 0}
#wrap #noticeWrap .listSet .list:first-of-type	{padding-top: 0}
#wrap #noticeWrap .listSet .list:last-of-type	{padding-bottom: 0}
#wrap #noticeWrap .listSet .title		{width:calc(100% - 120px); height: 100%; text-align:left; box-sizing:border-box}
#wrap #noticeWrap .listSet .title a		{width: auto; border-bottom: none; box-sizing: border-box;}
#wrap #noticeWrap .listSet .title a:hover	{color:#005fa3; outline: #005fa3 1px solid; padding-left: 2px; padding-right: 2px;}
#wrap #noticeWrap .listSet .title a:focus	{color:#005fa3; outline: #005fa3 1px solid; padding-left: 2px; padding-right: 2px;}
#wrap #noticeWrap .listSet .brd_info		{width: 120px; height: 100%; text-align:right; vertical-align:top; color: #757575; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
#wrap #noticeWrap .noticeText .btn_more		{display:none; position: absolute; width: 30px; height: 30px; line-height: 30px; top: 13px; right: 30px; overflow:hidden}
#wrap #noticeWrap .noticeText.selectOn .btn_more{display:flex; text-align: center; align-items: center; border-bottom: none}
#wrap #noticeWrap .noticeText .noticeSet_title	{position:absolute; width: 130px; height: 55px; line-height: 55px; text-align: center; font-size: 16px; font-weight:bold; top: 0; left: 0;  box-sizing: border-box}
#wrap #noticeWrap .noticeText .noticeSet_title a{display: block; width: 100%; height: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; border-bottom: none}
#wrap #noticeWrap .noticeText.selectOn .noticeSet_title {font-weight:bold; color: #005fa3}
#wrap #noticeWrap .noticeText.selectOn .noticeSet_title:after {width: calc(100% - 20px); height: 2px; content: ""; background-color: #005fa3; position: absolute; bottom: 0; left: 10px;}
#wrap #noticeWrap .noticeText:nth-of-type(1)	{z-index:60}
#wrap #noticeWrap .noticeText:nth-of-type(1) .noticeSet_title {left:0}
#wrap #noticeWrap .noticeText:nth-of-type(2)	{z-index:61}
#wrap #noticeWrap .noticeText:nth-of-type(2) .noticeSet_title {left:131px}
#wrap #noticeWrap .noticeText:nth-of-type(3)	{z-index:62}
#wrap #noticeWrap .noticeText:nth-of-type(3) .noticeSet_title {left:261px}
#wrap #noticeWrap .noticeText:last-of-type .noticeSet_title {border-right:none}


#wrap #sect_schedule				{width:100%; height: 100%; overflow:hidden}
#wrap #haksaSchedule				{display: grid; width: 100%; height: 100%; margin-right:10px; padding: 0; border:#eeeff2 1px solid; background:#ffffff; box-sizing:border-box; grid-template-rows: 55px auto; overflow: hidden;}
#wrap #haksaSchedule .titleArea			{display: flex; flex-direction: row; align-items: center; gap: 12px; width:100%; height:55px; line-height:55px; text-align: left; font-size:22px; font-weight:700; background:#fff; border-bottom: #efefef 1px solid; padding: 0 30px; box-sizing:border-box}
#wrap #haksaSchedule .titleArea h3		{display: inline-block; width: auto; height:30px; line-height:30px; text-align:center; font-size: 16px; font-weight: 700}
#wrap #haksaSchedule .titleArea h3 a		{line-height:inherit; font-size:inherit; font-weight:inherit; padding:0; background:none}
#wrap #haksaSchedule .titleArea .targetDT_YYYYMM {display: inline-block; width: auto; line-height: 12px; text-align: center; font-size: 12px; font-weight: 700; color: #454545; background-color: #fff; padding: 5px 6px; border: #757575 1px solid; border-radius: 12px; overflow: hidden; box-sizing: border-box;}
#wrap #haksaSchedule .schd_moreWrap		{display: flex; flex-wrap: wrap; align-items: center; margin-left: auto;}
#wrap #haksaSchedule .btn_more			{line-height: 100%; border: none; text-decoration: none}
#wrap #haksaSchedule .contArea			{width: 100%; padding: 20px 30px; box-sizing:border-box; overflow: hidden}
#wrap #haksaSchedule .calendar			{width:100%}
#wrap #haksaSchedule .calendar .tb_cal .today		{background:#eeeff2; border-radius:50%}
#wrap #haksaSchedule .schedule			{height: 100%; overflow-y: auto;}
#wrap #haksaSchedule .schd_list			{list-style: none; padding: 0; margin: 0;  overflow-y: auto}
#wrap #haksaSchedule .schd_list .schd_li	{padding: 8px 0; border-bottom: 1px solid #ddd;}
#wrap #haksaSchedule .schd_list .schd_li:first-of-type	{padding-top: 0;}
#wrap #haksaSchedule .schd_list .schd_li:last-of-type	{padding-bottom: 0; border-bottom: none;}
#wrap #haksaSchedule .schd_list .schd_title	{font-weight: 500; font-size: 15px; color: #333; margin-bottom: 4px;}
#wrap #haksaSchedule .schd_list .schd_date	{font-size: 13px; color: #757575; line-height: 1.4;}



#wrap #sect_2					{position: relative; width:100%; margin-top: 30px;}
#wrap #sect_2 .a_link				{display: flex; width: 100%; height: 100px; color: #fff; align-items: center; box-sizing: border-box; text-decoration: none; border: none;background: linear-gradient(90deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.20) 100%), #1C7DB7; background-blend-mode: soft-light, normal; border: 1px solid #0071b6;}
#wrap #sect_2 .a_link .link_text		{display: flex; line-height: 24px; color: #FFF; font-size: 20px; font-weight: 800; padding: 0 30px; align-items: center}
#wrap #sect_2 .a_link .link_text::after		{content: ""; display: inline-block; color: #FFF; margin-left: 10px; font-size: 20px; width: 24px; height: 24px; background: url('/images/icon/arrow_right.svg') left center; background-repeat: no-repeat;}
#wrap #sect_2 .a_link .bgOver			{position: absolute; width: 500px; height: 100px; flex-shrink: 0; margin-left: auto; inset: 0; background: linear-gradient(to right, #1377b8 10%, rgba(0, 0, 0, 0)), url('/images/bg/bg_CMS021__banner_license.png') right center / cover no-repeat; z-index: 0; opacity: 0.9; right: 0;}
/* ============================== [01] Main Page .End   ============================== */


/* ============================== [02] Sub Page .Start ============================== */

#wrap.subPage.type_F .contSet				{position: relative; width: 100%; margin-top: 30px;}
#wrap.subPage.type_F .contSet:first-of-type		{margin-top: 0;}
#wrap.subPage.type_F .contSet .descCont			{width: 100%; padding-left: 10px; box-sizing: border-box}
#wrap.subPage.type_F #refSet				{margin-top: 30px}


#wrap.subPage.type_F .subPageCont			{line-height: 2rem; font-family: 'Nanum Gothic'; font-size: 1rem; font-weight: normal}
#wrap.subPage.type_F .subPageCont h1			{line-height: 3rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 2.5rem; font-weight: normal}
#wrap.subPage.type_F .subPageCont h2			{line-height: 3rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 2rem; font-weight: normal; margin-top: 10px}
#wrap.subPage.type_F .subPageCont h3			{line-height: 3rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 1.3rem; font-weight: 700; margin-top: 10px}
#wrap.subPage.type_F .subPageCont h4			{line-height: 1.5rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 1.2rem; font-weight: 700; margin-top: 10px}
#wrap.subPage.type_F .subPageCont h5			{line-height: 1.2rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 1.2rem; font-weight: 700; margin-top: 5px}
#wrap.subPage.type_F .subPageCont h6			{line-height: 1.2rem; font-family: "맑은 고딕", "malgun gothic", sans-serif; font-size: 1rem; font-weight: 700; margin-top: 5px}

table.tb_basic							{margin-top: 2px; border-color:#0a0a0a}
table.tb_basic thead th					{background-color: #7ebcb9; border-color: #0a0a0a; color: #0a0a0a; font-size: 1rem;}
table.tb_basic thead th.borderR				{border-right: #0a0a0a 1px solid}
table.tb_basic tbody th					{background-color: #aae0dd; border-color: #0a0a0a; color: #0a0a0a; border-right: #0a0a0a 1px solid}
table.tb_basic tbody td					{background-color: transparent; border-color: #0a0a0a; color: #0a0a0a; text-align: left}
table.tb_basic tfoot th					{background-color: #565656; border-color: #0a0a0a; color: #ffffff}
table.tb_basic tfoot td					{background-color: #565656; border-color: #0a0a0a; color: #ffffff}
table.tb_basic .alignCenter				{text-align: center}
table.tb_basic .alignLeft				{text-align: left; padding-left: 5px}
table.tb_basic .alignRight				{text-align: right; padding-right: 5px}
table.tb_basic .ftSize_0_8				{font-size: 0.8em}
table.tb_basic .ftSize_1					{font-size: 1em}
table.tb_basic .ftSize_1_2				{font-size: 1.2em}
table.tb_basic .ftSize_1_5				{font-size: 1.5em}
table.tb_basic .ftSize_2					{font-size: 2em}
table.tb_basic .bgLightGray				{color: #0a0a0a; background-color: #eee; border-color: #aaaaaa}
table.tb_basic .bgGray					{color: #0a0a0a; background-color: #f0f0f0}

table.tb_basic tbody .border_L_B				{border-left: #aaaaaa 1px solid}
table.tb_basic .col_red					{color: #E02D2D}
table.tb_basic th.col_red				{color: #AE1111}


/* ============================== [02] Sub Page .End   ============================== */



/* ============================== [03] SiteMap .Start ============================== */
#wrap.sitemap #siteMap					{color:#000}
#wrap.sitemap #siteMap .dep01_li			{}
#wrap.sitemap #siteMap .dep01_li .dep01_a		{color:#fff; background:#005fa3; border-radius:5px; padding:0 5px; border-bottom:#fff 2px solid; box-sizing:border-box}
#wrap.sitemap #siteMap .dep02_div			{background:#eee; border-radius:5px}
#wrap.sitemap #siteMap .dep02_div .dep02_a		{color:#000}
/* ============================== [03] SiteMap .End   ============================== */

