@charset "utf-8";
/* CSS Document */


@import url("./common/table.css");
@import url("./common/admin.css");
@import url("./common/member.css");
@import url("./common/sitemap.css");



/* 나눔명조 */
@import url('https://fonts.googleapis.com/css?family=Nanum+Myeongjo:400,700,800&subset=korean');

/* 나눔고딕 */
@import url('https://fonts.googleapis.com/earlyaccess/nanumgothic.css');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@700&display=swap');

/* 나눔스퀘어 */
@import url('https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css');

/* 노토산스 */
.noto {font-family: 'Noto Sans KR', sans-serif; letter-spacing:-0.03em;}


@font-face {  font-family: 'NanumSquare'; font-weight: 300;
 src: url(NanumSquareL.eot);
 src: url(NanumSquareL.eot?#iefix) format('embedded-opentype'),
      url(NanumSquareL.woff) format('woff'),
      url(NanumSquareL.ttf) format('truetype');
}
@font-face {  font-family: 'NanumSquare';  font-weight: 400;
 src: url(NanumSquareR.eot);
 src: url(NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(NanumSquareR.woff) format('woff'),
      url(NanumSquareR.ttf) format('truetype');
}
@font-face {  font-family: 'NanumSquare'; font-weight: 700;
 src: url(NanumSquareB.eot);
 src: url(NanumSquareB.eot?#iefix) format('embedded-opentype'),
      url(NanumSquareB.woff) format('woff'),
      url(NanumSquareB.ttf) format('truetype');
}
@font-face {  font-family: 'NanumSquare'; font-weight: 800;
 src: url(NanumSquareEB.eot);
 src: url(NanumSquareEB.eot?#iefix) format('embedded-opentype'),
      url(NanumSquareEB.woff) format('woff'),
      url(NanumSquareEB.ttf) format('truetype');
}




/* 건너뛰기링크 작업 (교육연구정보원 접근성 통과된 작업) */
#skipnavigation{position:absolute; z-index:9999;}
#skipnavigation a{display:block; position:absolute; text-align:center; top:-500px;width:500px;}
#skipnavigation a:hover,
#skipnavigation a:focus,
#skipnavigation a:active{background:#000; color:#FFF; left:50%; padding:5px; position:absolute; top:0; z-index:999;}




/* 여백초기화 */
*{margin:0; padding:0;} 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,button{margin:0;padding:0}
/*테두리 초기화*/
fieldset,img{border:0 none}
/*리스트 스타일 초기화*/
dl,ul,ol,menu,li{list-style:none}

img{border:0; vertical-align:top;}
input{padding:0 5px; box-sizing: border-box; vertical-align:middle;}
button{cursor:pointer;}
select{ padding:0 5px;  box-sizing: border-box;}


/* 폰트 설정 //나눔고딕 웹폰트 링크 후에 쓰는 것 
body {font-size:13px; font-family:"Malgun Gothic","맑은 고딕","NanumGothic","나눔고딕",'Noto Sans', sans-serif;
	  color:#333; 
	  word-wrap:break-word; word-break:keep-all; 
	  line-height:1.6;}*/


/* 유엔평화기념관 - footer top css */
a.topbutton {position: fixed;   width:40px; height:40px; line-height:40px;  border-radius:50px; background:#1e6496;  text-align:center;
				right: 1%;   bottom: 100px; color:#fff; display: none; z-index:1; }

a.topbutton:hover {color:#fff;}

a{text-decoration:none}
a:hover{color:#118eff;text-decoration:none;}
a:active{background-color:transparent}



/*폰트스타일 초기화*/
address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}
.fs_13{font-size: 13px;}
.fs_15{font-size: 15px;}
.fs_18{font-size: 18px;}
.fs_20{font-size: 20px;}
.fs_22{font-size: 22px;}

 

/* PADDING의 설정 */
.pt5{ padding-top:5px; box-sizing: border-box; }
.pt10{ padding-top:10px; box-sizing: border-box;  }
.pt15{ padding-top:15px;  box-sizing: border-box; }
.pt20{ padding-top:20px;  box-sizing: border-box; }
.pt25{ padding-top:25px;  box-sizing: border-box; }
.pt30{ padding-top:30px;  box-sizing: border-box; }
.pt35{ padding-top:35px;  box-sizing: border-box; }
.pt40{ padding-top:40px; box-sizing: border-box;  }
.pt45{ padding-top:45px; box-sizing: border-box;  }
.pt50{ padding-top:50px;  box-sizing: border-box; }
.pt55{ padding-top:55px;  box-sizing: border-box; }

.pb5{ padding-bottom:5px;  box-sizing: border-box; }
.pb10{ padding-bottom:10px;  box-sizing: border-box; }
.pb15{ padding-bottom:15px;  box-sizing: border-box; }
.pb20{ padding-bottom:20px;  box-sizing: border-box; }
.pb25{ padding-bottom:25px;  box-sizing: border-box; }
.pb30{ padding-bottom:30px;  box-sizing: border-box; }

.pl5{ padding-left:5px; box-sizing: border-box;  }
.pl10{ padding-left:10px;  box-sizing: border-box; }
.pl15{ padding-left:15px;  box-sizing: border-box; }
.pl20{ padding-left:20px;  box-sizing: border-box; }
.pl25{ padding-left:25px;  box-sizing: border-box; }
.pl30{ padding-left:30px;  box-sizing: border-box; }
.pl40{ padding-left:40px;  box-sizing: border-box; }
.pl50{ padding-left:50px;  box-sizing: border-box; }
.pl60{ padding-left:60px;  box-sizing: border-box; }
.pl70{ padding-left:70px;  box-sizing: border-box; }


.pr5{ padding-right:5px; box-sizing: border-box;  }
.pr10{ padding-right:10px;  box-sizing: border-box; }
.pr15{ padding-right:15px;  box-sizing: border-box; }
.pr20{ padding-right:20px;  box-sizing: border-box; }
.pr25{ padding-right:25px;  box-sizing: border-box; }
.pr30{ padding-right:30px;  box-sizing: border-box; }


/* MARGIN의 설정 */


.mt5{ margin-top:5px; }
.mt10{ margin-top:10px; }
.mt15{ margin-top:15px; }
.mt20{ margin-top:20px; }
.mt25{ margin-top:25px; }
.mt30{ margin-top:30px; }
.mt35{ margin-top:35px; }
.mt40{ margin-top:40px; }
.mt45{ margin-top:45px; }
.mt50{ margin-top:50px; }
.mt55{ margin-top:55px; }

.mb5{ margin-bottom:5px; }
.mb10{ margin-bottom:10px; }
.mb15{ margin-bottom:15px; }
.mb20{ margin-bottom:20px; }
.mb25{ margin-bottom:25px; }
.mb30{ margin-bottom:30px; }
.mb40{ margin-bottom:40px; }
.mb50{ margin-bottom:50px; }

.ml5{ margin-left:5px; }
.ml10{ margin-left:10px; }
.ml15{ margin-left:15px; }
.ml20{ margin-left:20px; }
.ml25{ margin-left:25px; }
.ml30{ margin-left:30px; }

.mr5{ margin-right:5px; }
.mr10{ margin-right:10px; }
.mr15{ margin-right:15px; }
.mr20{ margin-right:20px; }
.mr25{ margin-right:25px; }
.mr30{ margin-right:30px; }
.mr35{ margin-right:35px; }
.mr40{ margin-right:40px; }
.mr45{ margin-right:45px; }
.mr50{ margin-right:50px; }



                                
/* 추가 작업 */
.new_button {   padding:5px 17px; display:inline-block; text-align: center;  color: #fff !important; background:#0499d3; border-radius: 50px;  }
.new_button:hover{background:#fff; border:1px solid #2174a1; color:#2174a1 !important; }
.new_button a{color:#2174a1 !important;}

.dgray_bt{padding:5px 15px; display:inline-block; background:#404040; color:#fff !important; 
      min-width:75px; text-align: center; box-sizing: border-box;} 
.gray_bt{padding:5px 15px; display:inline-block; background:#777777; color:#fff !important; 
      min-width:75px; text-align: center; box-sizing: border-box;} 
.gray_long_bt{padding:6px 50px; display:inline-block; background:#777777; color:#fff !important; 
      min-width:170px; text-align: center; box-sizing: border-box;} 

     

.blue_bt3{padding:5px 15px; display:inline-block; background: #1c3abf; color:#fff !important; 
            min-width:75px; text-align: center; box-sizing: border-box;} 
.blue_bt2{padding:5px 15px; display:inline-block; background: #145089; color:#fff !important; 
            min-width:75px; text-align: center; box-sizing: border-box;} 
.blue_bt{padding:5px 15px; display:inline-block; background:#0499d3; color:#fff !important; 
      min-width:75px; text-align: center; box-sizing: border-box;} 
.blue_long_bt{padding:6px 50px; display:inline-block; background:#0499d3; color:#fff !important; 
      min-width:170px; text-align: center; box-sizing: border-box;} 

.black_bt{padding:4px 15px; display:inline-block;  border:1px solid #999; color:#333 !important; 
      min-width:75px; text-align: center; box-sizing: border-box;} 

.black_bt_2{padding:4px 15px; display:inline-block;  border:1px solid #999; color:#333 !important; 
          min-width:125px; text-align: center; box-sizing: border-box;} 
.black_bt_2:hover {background: #404040; color:#fff !important; }

          
.black_long_bt{padding:6px 50px; display:inline-block; border:1px solid #999; color:#333 !important; 
      min-width:170px; text-align: center; box-sizing: border-box;} 
.black_long_bt:hover {background: #404040; color:#fff !important; }

.long_bt{padding:6px 50px; display:inline-block; border:1px solid #999; color:#333 !important;
      min-width:170px; text-align: center; box-sizing: border-box;} 
.long_bt:hover {background: #404040; color:#fff !important; }


.long_bt_nohover{padding:6px 50px; display:inline-block; border:1px solid #999; color:#333 !important;
      min-width:170px; text-align: center; box-sizing: border-box;} 


          
.sky_long_bt{padding:6px 50px; display:inline-block; border:1px solid #999; color:#bdcbbb !important; 
      min-width:170px; text-align: center; box-sizing: border-box;} 
.sky_long_bt:hover {background: #404040; color:#fff !important; }

/* 모바일 버튼 3개정렬시 */
.long_bt_m{padding:6px 50px; display:inline-block; border:1px solid #999; color:#333 !important;
			min-width:170px; text-align: center; box-sizing: border-box;} 
.blue_long_bt_m{padding:6px 50px; display:inline-block; background:#0499d3; color:#fff !important; 
				min-width:170px; text-align: center; box-sizing: border-box;} 

/* 대관신청 마감표기 버튼  */
.ap_gray_bt{padding:2px 8px; border-radius:2px; display:inline-block; background:#777777; color:#fff !important; font-size:0.8em;
		 text-align: center; box-sizing: border-box;} 
.ap_blue_bt{padding:2px 8px; border-radius:2px; display:inline-block; background:#0499d3; color:#fff !important; font-size:0.8em;
		text-align: center; box-sizing: border-box;} 



/* 텍스트 정렬 공통 클래스 */
.text_l{text-align:left;}
.text_r{text-align:right;}
.text_c{text-align:center;}
.text_j{text-align:justify;}

.float_l {float: left;}
.float_l::after {clear: both; content: "";}
.float_r{ float: right;}
.float_r::after {clear: both; content: "";}

.indent{padding-left:20px; text-indent: -20px;}



/* 테이블 ===대관안내 dl안에 표 style */
table.table01{ width:100%; border-collapse:collapse; border-left:1px solid #a9c6dd;  font-size:14px; }
table.table01 caption{ padding:0 3px 3px 0; text-align:right; }
table.table01 th{ padding:3px 3px 4px 3px; background-color:rgba(237,246,255,0.5); border-right:1px solid #a9c6dd; border-bottom:1px solid #a9c6dd; 
                  letter-spacing:-0.05em;  font-weight:bold; text-align:center; }
table.table01 td{ padding:3px 3px 3px 3px; border-right:1px solid #a9c6dd; border-bottom:1px solid #a9c6dd; text-align:center;  line-height:16px; }



/* 테이블 백그라운드 설정*/
.table_back{background:#f2f2f2; font-weight:600;}

/* 전체 테이블 속성 ff851c */

caption {text-indent: -9999px; height: 0; color:transparent; }

table {width:100%; text-align:center; color:#3f3f3f;  margin-bottom: 10px;
      font-family: 'NanumSquare', serif; border-collapse: collapse; border-spacing: 0;  vertical-align:middle; 
		 border-top:2px solid #000000; 
		 border-bottom: 1px solid transparent;}
 table td, table th{ padding: 9px 10px;       margin-left: -1px;
					 vertical-align: middle; text-align:center;      border-right: 1px solid #ccc;  }

table tr{height:40px;}
table td {height:35px; line-height:1.5;  border-left: 1px solid #ccc; border-bottom: 1px solid #ccc;  background-clip:padding-box; }
table th{ font-weight:900; transform: skew(-0.09deg); background-clip:padding-box; 
		border-left: 1px solid #ccc;  border-bottom: 1px solid #273346; }



 


/* 시민 테이블 속성 */
.tbl_basic {     margin-bottom: 10px;    width: 100%;    border-top: 2px solid #505d7a;    border-bottom: 1px solid transparent;}
.tbl_basic thead th {     color: #333;background: #f7f7f7;}
.tbl_basic th.thst {    color: #333;background: #eee}
.tbl_basic th {    background-color: #f9fafb;    font-size: 15px;    color: #4b556e;}

.tbl_basic th, .tbl_basic td {     padding: 9px 10px;    border-left: 1px dotted transparent;    border-bottom: 1px solid transparent;    margin-left: -1px;
	vertical-align: middle;    word-wrap: break-word;    word-break: keep-all;    text-align: center;}
.tbl_basic th, .tbl_basic td {    border-left: 1px solid #ccc;    border-right: 1px solid #ccc;    border-bottom: 1px solid #ccc;}
table.tbl_basic caption {text-indent: -9999px; height:0;}




/* dl dt 작업 */
.dl_box {border-top:2px solid #406fc7;}
.dl_type1 {padding:25px 0;}
.dl_type1 dl {overflow:hidden; line-height:24px;}
.dl_type1 + .dl_type1 {border-top:1px solid #d4d3d3;}
.dl_type1 > dt {width: 15%; min-width:150px; float:left; color:#1c568c; font-size:16px; font-weight:bold; box-sizing:border-box; }
.dl_type1 > dd {overflow:hidden;}



/* dl dt 작업 */
.dl_box {border-top:2px solid #406fc7;}
.dl_type2 {padding:10px 0;}
.dl_type2 dl {overflow:hidden; line-height:24px;}
.dl_type2 + .dl_type2 {border-top:1px solid #d4d3d3;}
.dl_type2 > dt {width: 15%; min-width:85px; float:left; color:#1c568c; font-size:14px; font-weight:bold; box-sizing:border-box; }
.dl_type2 > dd {overflow:hidden;}


/* 대관신청 페이지 작은 dl dt 작업 */
.dl_box2 {border-top:2px solid #406fc7;}
.dl_type3 {padding:10px 0;}
.dl_type3 dl {overflow:hidden; line-height:24px;}
.dl_type3 + .dl_type3 {border-top:1px solid #d4d3d3;}
.dl_type3 > dt {width: 15%; min-width:85px; float:left; color:#1c568c; font-size:14px; font-weight:bold; box-sizing:border-box; }
.dl_type3 > dd {overflow:hidden; font-size:15px;}

.lent_table tr:first-child td,
.lent_table tr:nth-child(3) td {padding:0px 0px; font-size:0.9em; }


/* 개인정보동의 박스 작업 */
.online_box_w{  width: 100%; padding:2%; box-sizing: border-box; margin-top:20px;
      border: 1px solid #ddd;       font-size:14px;      background:#f9fafb;         }
      
.online_box_w h3{margin-bottom:5px; margin-top:7px; font-size:15px;}

.online_box_w input{vertical-align: middle;}



/* 320 모바일 사이즈 시작===================================================================================================================== */
@media screen and (min-width:320px)and (max-width:767px){
	.dl_type1 > dt{min-width: 120px;}

	/* 모바일 버튼 3개정렬시 */
	.long_bt_m{padding:5px 5px; display:inline-block; border:1px solid #999; color:#333 !important;
				min-width:110px; text-align: center; box-sizing: border-box;} 
	.blue_long_bt_m{padding:5px 5px; display:inline-block; background:#0499d3; color:#fff !important; 
					min-width:110px; text-align: center; box-sizing: border-box;} 




 }