@charset "utf-8";
/* CSS Document */
/*-------------------------서브공통--------------------------*/
.contents_outter {}

.sub_contents { width: 100%; max-width:1200px; height: auto; margin: 45px auto 45px; padding: 0 10px; }

.contents_inner { width:1140px; height:calc(100vh - 300px); background-color:#fff; border-radius: 10px; padding:35px 30px; overflow-y:auto; border: 1px solid #dddddd;}
.sub_contents_title h3 { margin:0px 10px; font-size:24px; line-height: 36px; color:#333; display:inline-block; float:left; width:200px;}
.sub_contents_title { position: relative; height:40px; margin-bottom: 15px; border-top: 1px solid #004093; padding-top: 15px;}
.sub_contents_title > .tg {position: absolute; height: 8px; background: linear-gradient(45deg, #4f87de, #69c7b7, #70dcaa); top: -4px;}
.contents_inner > .sub_contents_title > button.print { background:#004093 url(../img/print.png) no-repeat 12px center; width:100px; text-align:center; padding-left:30px; border-radius:15px; color:#fff; border:none; height:30px; font-size: 12px; line-height: 30px; float:right; margin-right: 50px; margin-top: 4px;}
.contents_inner > .sub_coninner { margin-top:5px; padding:15px; height: auto;}
.contents_inner > .sub_contents_title > .close {background-image: url("../img/close.png"); background-size: 50%;background-repeat: no-repeat;background-position: center;cursor: pointer; width: 50px; height: 50px; position: absolute; top: 0px; right: 0px; margin-top: 9px;}

/*-------서브 페이지-------*/
.sub_contents_title ul.sub_list { padding:0; margin-top:6px; width:650px; display:inline-block; margin-left:100px;}
.sub_contents_title ul.sub_list li { float:left; list-style:none; border:1px solid #024b80; border-radius:40px; padding:2px 14px; margin:0 5px;} 
.sub_contents_title ul.sub_list li a { text-decoration:none; color:#024b80;}
.sub_contents_title ul.sub_list li.on { background-color:#024b80;}
.sub_contents_title ul.sub_list li.on a { color:#fff;}


/*----------발간사----------*/

.sub_coninner > .publish { width:770px; float:left; padding-bottom:30px; }
.sub_coninner > .publish p { width:100%; line-height:1.9; text-align:justify; display:inline-block; margin:10px 0;}
.sub_coninner > .publish p.pup_fir { font-size:16px;}

.sub_coninner > .pupl_img { width:300px; /*display:inline-block;*/ float: right; text-align:right; line-height:1.5; margin-top:15px;}
.publish_txt > .pupl_img span { display:block;}
.sub_coninner > .pupl_img > .pupl_img_name { padding-right:10px; display:block;}
.sub_coninner > .pupl_img strong { color:#004394; font-size:18px; letter-spacing:2px; margin-left:5px;}


/*----------설립목적----------*/
.sub_coninner > .found { padding-top:20px;}
.sub_coninner > .found ul { padding:0; margin:0;}
.sub_coninner > .found > .found_bg { background:url(../img/found.png) no-repeat; width:100%; position:relative; z-index:1; height:400px;}
.sub_coninner > .found > .found_bg > p { width:650px; margin:0px auto 15px; text-align:justify; font-size:15px; color:#fff; letter-spacing:-1.3px; position:absolute; left:200px; top:90px; z-index:100;}
.sub_coninner > .found > .found_bg > p strong { display:block; text-align:center; font-size:30px; margin-bottom:15px;}
.sub_coninner > .found > .found_bg > p strong span { font-size:14px; margin-left:5px;}

.sub_coninner > .found > ul.fou_vision { height:250px; margin-top:50px;}
.sub_coninner >.found > ul.fou_vision > li { float:left; width:250px; margin:0px 9px; padding-top:16px; font-weight:bold; position:relative;}

.sub_coninner > .found > ul.fou_vision > li img { position:absolute; top:10px; left:20px;}
.sub_coninner > .found > ul.fou_vision > li.f_list01 { border-top:2px solid #0782bb; color:#0782bb;}
.sub_coninner > .found > ul.fou_vision > li.f_list02 { border-top:2px solid #e28d8b; color:#e28d8b;}
.sub_coninner > .found > ul.fou_vision > li.f_list03 { border-top:2px solid #c09b6d; color:#c09b6d;}
.sub_coninner > .found > ul.fou_vision > li.f_list04 { border-top:2px solid #00ac6c; color:#00ac6c;}

.sub_coninner > .found > ul.fou_vision > li.f_list03 > ul.goal_list { /*margin-top:10px;*/ margin:0px; padding-left:10px;}
.sub_coninner > .found > ul.fou_vision > li.f_list03 > ul.goal_list li { font-size:12px;}
.sub_coninner > .found > ul.fou_vision > li.f_list03 > ul.goal_list img { position:inherit; padding-right:5px;}

.sub_coninner > .found > ul.fou_vision > li.f_list04 > ul.core_list { height:25px; padding:0 20px;}
.sub_coninner > .found > ul.fou_vision > li.f_list04 > ul.core_list li { float:left; padding:0 15px 0 0;}
.sub_coninner > .found > ul.fou_vision > li.f_list04 > ul.core_list img { position:inherit; padding-right:5px;}

.sub_coninner > .found > ul.fou_vision > li span { display:block; line-height:1.5;}
.sub_coninner > .found > ul.fou_vision > li span.f_tit { text-align:right; font-size:20px; padding-bottom:35px;}
.sub_coninner > .found > ul.fou_vision > li span.f_br { display:block;}


/*----------사진으로 본 활동----------*/
.sub_coninner .photocomm { position:relative; height:440px;}
.sub_coninner .photo .view_img { width:570px; height: 380px; position:absolute; top:17px; left:27px; text-align:center;}
.sub_coninner .photo .view_img p { text-align:center; padding:10px 10px; margin:0px; line-height:1.5; font-size: 12px; letter-spacing: 0;}
.sub_coninner .photo .view_img img { width: 100%; height: 100%;}

.sub_coninner .photo .view_but {width:570px; height: 380px; position:absolute; top:17px; left:27px;}
.sub_coninner .photo .view_but button.btn_prev { z-index: 1; position:absolute; left:10px; top:174px; width:30px; height:30px; margin:0px; padding:0px; border:0px; background:URL("../img/btn_prev.png"); }
.sub_coninner .photo .view_but button.btn_next { z-index: 1; position:absolute; right:10px; top:174px; width:30px; height:30px; margin:0px; padding:0px; border:0px; background:URL("../img/btn_next.png"); }

.sub_coninner .photo .view_img > .view_puls {position: absolute; bottom: 0px; right: 0px; width: 40px; height: 40px; margin: 5px;}

.sub_coninner .photo .modal {display: none; z-index: 500; width: 100%; height: 100vh; position: fixed; top: 0; left: 0; background-color: rgba(0, 0, 0, 0.8);}
.sub_coninner .photo .modal button {position: absolute; top: 3rem; right: 3rem; background: transparent; border: 0; color: #ffffff;	font-size: 3rem;}
/*
.sub_coninner .photo .modal .modalBox { position: relative; top: 25%; left: 50%; transform: translate(-50%, -20%); /*background-color: #ffffff; width: calc(100% - 40%); height: auto; text-align: center;}
.sub_coninner .photo .modal .modalBox img {width: calc(100%); height: auto;}
*/
.sub_coninner .photo .modal .modalBox { position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  max-width: 90%;
  max-height: 90%;}
.sub_coninner .photo .modal .modalBox img {max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain; /* 비율 유지하며 여백 남기기 */
  display: block;
  margin: 0 auto;}

.sub_coninner .photo ul.con_ph { list-style:none; margin:0; width:440px; position:absolute; top:40px; right:22px;}
.sub_coninner .photo ul.con_ph li { float:left; width:100px; height:100px; background-color:#e0f2f9; margin:5px; cursor:pointer;}
.sub_coninner .photo ul.con_ph li span.on { border:4px solid #333;}

.page_btn { position:absolute; bottom:14px; right:27px; width:430px; text-align:center;}
.page_btn button { background:#f5f5f5; border:1px solid #ccc; display:inline-block; width:28px; height:28px; text-align:center; color:#444; text-decoration:none; font-size:12px; font-weight:bold; line-height:26px;}
.page_btn button.on { background:#4f4f4f; border:1px solid #333; color:#fff;}

/*----------주요활동----------*/
.sub_coninner > .act > h4 { font-size:18px; color:#0294cf;}
.sub_coninner > .act > p { text-align:justify;}
.sub_coninner > .act > p.agr { color:#999;}
.sub_coninner > .act > ul, li { list-style:none; padding:0; margin:0;}

.sub_coninner > .act_pre > .pre_text { width:100%; margin-bottom:50px; display:inline-block;}
.sub_coninner > .act_pre > .pre_text > p { width:48.5%; text-align:justify; display:inline-block; line-height:2; margin:0; letter-spacing:-1px;}
.sub_coninner > .act_pre > .pre_text > p.right_txt { float:right;}
.sub_coninner > .act_pre > .pre_text > img { width:48.5%;}
.sub_coninner > .act_pre > .pre_text > .img_right { float:right;}

.sub_coninner > .act_move {}
.sub_coninner > .act_move > ul { width:100%; padding:0;}
.sub_coninner > .act_move > ul li { font-weight:normal; padding:0;}
.sub_coninner > .act_move > ul li ul { padding-left:40px;}
.sub_coninner > .act_move > ul li span { display:block; width:100%;}
.sub_coninner > .act_move > ul > .move_year { font-size:22px; font-weight:bold; position:relative;}
.sub_coninner > .act_move > ul > .move_year > span { background:#f4f4f4; text-align:right; padding-right:24px; width:97%; color:#0294cf;}
.sub_coninner > .act_move > ul > li > ul > .move_month { margin-left:80px; font-size:24px; color:#fff; border-bottom:1px solid #ededed; padding:30px 0; font-weight:bold; min-height:100px;}
.sub_coninner > .act_move > ul > li > ul > .move_month > span { background:#004093; width:100px; height:100px; border-radius:50%; text-align:center; line-height:100px; position:absolute; left:25px;}
.sub_coninner > .act_move > ul > li > ul > .move_month > span.move_color1 { background:#10a1d8;}
.sub_coninner > .act_move > ul > li > ul > .move_month > ul li { list-style: disc; padding-left: 10px; margin-left: 50px; }

/*----------2023 개요----------*/
.sub_coninner > .summ { width:100%;}
.sub_coninner > .summ h4 { font-size:18px; color:#0294cf;}
.sub_coninner > .summ p { color:#333;}
.sub_coninner > .summ > img { width:calc(100%); max-width:1050px;}
.sub_coninner > .summ p.tb_tt { color:#999; font-size:12px; text-align:right; margin-top:5px; clear:both;}
.sub_coninner > .summ table { width:100%; border:1px solid #ddd; border-top:2px solid #679f41; border-right:none; margin-top:10px;}
.sub_coninner > .summ table tr.brt td { background:#e6efe2;}
.sub_coninner > .summ table tr.wd1 th { width:142px;}
.sub_coninner > .summ table th, td { border-top:1px solid #ddd; border-right:1px solid #ddd; font-weight:normal; height:36px;}
.sub_coninner > .summ table .col { border-top:none;}
.sub_coninner > .summ table td { text-align:center;}
.sub_coninner > .summ hr { margin:40px 0; clear:both;}
.sub_coninner > .summ .treat_tt01 { font-size:16px; font-weight:bold; margin-bottom:0px;} 
.sub_coninner > .summ .treat_tt02 { font-weight:bold; color:#004394; margin-left:10px; margin-top:20px; margin-bottom:10px;}

.sub_coninner > .sum_edu > .edu_tb { width:100%;}
.sub_coninner > .sum_edu > .mt50 { margin-top:40px;}

.sub_coninner > .sum_treat > div.wh_out { height:auto;}
.sub_coninner > .sum_treat > div > .wh { float:left; width:530px; margin-bottom:30px;}
.sub_coninner > .sum_treat > div > .wh > table tr.col > td { border-top:none;}
.sub_coninner > .sum_treat > div > .wh > table tr td { text-align:left; padding-left:20px;}
.sub_coninner > .sum_treat > div > .wh > table tr td.txt_r { text-align:right; padding-left:0px; padding-right:20px;}

/*----------사이트맵----------*/
.sub_coninner > .aj_list {}
.sub_coninner > .aj_list a { text-decoration:none; color:#424242; display:block;}
.sub_coninner > .aj_list ul { padding:0;}
.sub_coninner > .aj_list > ul.list_01 { height:280px;}
.sub_coninner > .aj_list > ul.list_01 > li { background:#e6f3ff; float:left; width:198px; margin:0px 10px; height:54px; line-height:54px; text-align:center; font-weight:bold; font-size:16px;}
.sub_coninner > .aj_list > ul.list_01 li > ul.list_02 { background:#fcfcfc; height:220px;}
.sub_coninner > .aj_list > ul.list_01 li > ul.list_02 li { height:42px; padding-left:20px; line-height:42px; text-align:left; font-weight:normal; border-bottom:1px solid #ededed;}
.sub_coninner > .aj_list > ul.list_01 li > ul.list_02 li.bd_non { border-bottom:none;}
.sub_coninner > .aj_list h4 { clear:both; margin-bottom:0px; border-top:1px solid #ddd; padding-top:15px; font-size:18px; color:#0294cf;}
.sub_coninner > .aj_list > ul.list_03 { margin-top:50px;}
.sub_coninner > .aj_list > ul.list_03 > li { background:#005bac; float:left; width:160px; height:54px; line-height:54px; text-align:center; font-size:16px; margin-left:22px;}
.sub_coninner > .aj_list > ul.list_03 > li a { color:#fff;}

.sub_coninner > .aj_list > ul.list_03 > li.ml10 { margin-left:10px; }

@media screen and (max-width:1300px){
.contents_outter > .sub_contents {width: calc(100% - 10%);}
.contents_outter > .sub_contents > .contents_inner {width: calc(100% - 10%); height: calc(100vh - 390px); margin: 0px auto;}
}

@media screen and (max-width:1180px){
.contents_outter {width: calc(100%);}
.contents_outter > .sub_contents { width: calc(100%); margin: 0px auto; padding: 20px 0;}
.contents_inner {width: calc(100% - 10%); margin: 0px auto;}
.contents_outter > .sub_contents > .contents_inner {width: calc(100% - 10%); height: calc(100vh - 300px); margin: 0px auto; padding: 35px 30px;}

.contents_inner > .sub_contents_title > .cl2 {position: relative; top: 0px; right: 0px; float: right; margin-top: -10px;}
.contents_inner > .sub_contents_title > .close {position: relative; top: 0px; right: 0px; float: right; margin-top: -10px;}


.contents_inner > .sub_contents_title > button.print {margin: 0px auto;}


/* 발간사 */
.sub_coninner > .pupl_img {width: calc(100% - 75%); float: right;}
.sub_coninner > .pupl_img > img {width: calc(100%); height: auto;}
.sub_coninner > .publish {width: calc(100% - 30%); float: left;}
.sub_coninner > .publish p { width: 100%;}
.sub_coninner > .found > .found_bg > p {width: 100%; margin: 0px auto; text-align: justify; font-size: 15px; color: #fff; letter-spacing: -1.3px; position: absolute; left: 15%; top: 102px; z-index: 100; max-width: 600px;}

/* 설립목적 */
.sub_coninner > .found > ul.fou_vision > li {width: 20vw; margin: 0px 9px;}

/* 사진으로 보는 활동 */
.sub_coninner .photo .view_img {width: 500px; height: 330px;}
.sub_coninner .photo ul.con_ph {position: absolute; top:17px; width: 350px; height: auto; right: -5px;}
.page_btn { position: absolute; bottom: -87px; width: 100px; margin: 0px auto; height: 30px; padding-bottom: 20px; left: 0px; right: 0px;}
.sub_coninner .photo .view_but button.btn_next {z-index: 1; position: absolute; right: 80px; top: 174px; width: 30px; height: 30px; margin: 0px; padding: 0px; border: 0px; background: URL("../img/btn_next.png");}

/* 2023 개요 */
.sub_coninner > .summ > img { width: calc(100%); max-width: 1050px; height: auto;}
.sub_coninner > .sum_treat > div.wh_out > img {width:100%; height: auto;}
}

@media screen and (max-width:890px){
.contents_outter > .sub_contents > .contents_inner {padding: 35px 0px;}
.sub_contents_title {margin: 20px;}
.contents_inner > .sub_coninner {margin: 0px auto; width: calc(100% - 10%); height: 750px; padding: 15px 0; text-align: center;}
.sub_coninner > .pupl_img {width: calc(100% - 60%); float: none;  margin: 0px auto; text-align: center;}
.sub_coninner > .publish {float: none; width: 100%;}

.contents_inner > .sub_contents_title > .cl2 {top: -30px;}

/* 발간사 */
.sub_coninner > .found > .found_bg > p {width: calc(100% - 15%); margin: 0px auto; text-align: justify; font-size: 15px; color: #fff; letter-spacing: -1.3px; position: absolute; left: 8%; top: 102px; z-index: 100; max-width: 600px;}
.sub_coninner > .found > ul.fou_vision { height: 250px; margin: 0px auto; padding-top: 50px; padding-left: 15px;}
.sub_coninner > .found > ul.fou_vision > li {width: 35vw; margin: 0px 15px;}
.sub_coninner > .found > ul.fou_vision > li.f_list03 > ul.goal_list {text-align: justify;}

/* 사진으로 보는 활동 */
.sub_coninner .photo .view_img {width: 500px; height: 330px; position: relative; top: 17px; left: 0px; margin: 0px auto;}
.sub_coninner .photo ul.con_ph { position: relative; top: 63px; right: 0px; margin: 0px auto; width: calc(100% - 10%); height: 330px; padding: 0px;}
.page_btn { position: relative; bottom: -82px; width: 100px; margin: 0px auto; height: 30px; padding-bottom: 20px;}
.sub_coninner .photo .view_but { width: 570px; height: 330px; position: absolute; top: 17px; left: 65px;}

/* 주요활동 */
.sub_coninner > .act > h4 {text-align: justify;}
.sub_coninner > .act_move > ul > li > ul > .move_month {margin-left:50px; text-align: justify;}

/* 2023 개요 */
.sub_coninner > .summ h4 { font-size: 18px; color: #0294cf; text-align: justify;}
.sub_coninner > .summ .treat_tt01 {text-align: justify;}
.sub_contents_title ul.sub_list {width: calc(100% - 30%);  margin: 0px auto; padding-top: 10px;}
}