@charset "utf-8";
/* CSS Document */
/*
font-family: 'NanumSquare', serif; 
font-family: "Nanum Gothic", serif;
font-family: 'Nanum Myeongjo', serif;

*/
 




/* 유엔평화기념관 2020 개편 css 메인 작업 */

body{min-width: 320px; 	font-size:13px; font-family:"Nanum Gothic","나눔고딕","Malgun Gothic","맑은 고딕",'Noto Sans', sans-serif;
	  color:#333; 	  word-wrap:break-word; word-break:keep-all; 	  line-height:1.6; letter-spacing: -0.2px;}
#wrap { min-width: 320px;  width: 100%; 
		word-wrap: break-word;	word-break: keep-all;}


#container:after {clear:both; display:block; content:"";} 


/* 모바일 햄버거 메뉴  */
.openMenu{ display:none; }


 
/* 메인 top 부분 */
#header{position:relative; z-index:300; background:#fff;}
#headerin { position: relative;    width: 1300px; height:100px;  margin:0 auto; }

#headerin .logo{ display:inline-block; float:left; margin:35px  10px 0px 0px;}
#headerin .logo h1 a { display: block;    width: 151px;    height: 90px; }
#sub-body {}


/* 로그인 회원가입 부분 */
.top_login { display:inline-block; position: absolute; top:15px; right:0px; letter-spacing:-0.6px; font-weight:bold;}
.top_login span {margin-left:7px; margin-right: 10px; }
.top_login a {margin-right:3px; }
.top_login a:nth-child(3){margin-right:9px; } 
.top_login a:first-child img { margin-right:2px; }
.top_login a:nth-child(3) img {margin-top:3px; margin-right:2px; }
.top_login a:nth-child(4) img {margin-top:-2px; }
.top_login a:nth-child(5) img {margin-top:-2px; }


/* 자료 검색 부분 */ 
.main_searchbook{width:250px; position: absolute; right:5px; top:50px; z-index: 444; display:none; }
.main_searchbook::after{ content:"";display:block;clear:both}

#msear{width: 100%;	height: 40px; background:#fff; box-sizing: border-box; 	position: relative; border:1px solid #2055a4; 	
		border-radius:30px; -webkit-border-radius:30px; -ms-border-radius:30px; box-shadow: 1px 1px 1px rgba(0,0,0,0.2); overflow:hidden;}

.search-form {display:inline-block; width:90%; }
#msear .topsear{ width:85%; height: 38px; line-height: 38px; float: left;  background: #fff;    display: inline-block;  
				box-sizing: border-box;    margin-left: 10px;}
#msear .topsear label {    position: absolute;    left: 0;    top: -10em;    z-index: 99999;}
#msear .topsear input[type=text] { float:left;	width: 100%; height:100%; text-indent: 10px; border: none; color:#333; font-size: 13px;}	
#msear .topsear input.input_mtext {height:39px; line-height:39px; padding:0;}
#msear .topsear placeholder {color:red;} 
#msear .topsear input[type=image] {    border: none;margin-top:10px;margin-right: 8px;}

#msear .btn_search{float:left; position:absolute; top:27%; right:25px;  }

/* 플레이스 홀더 작업 크롬-파이어폭스-익스플로러 */
::-webkit-input-placeholder {color: #bbb9b9; letter-spacing:-0.6px;}
:-moz-placeholder {color: #bbb9b9; letter-spacing:-0.6px;}
::-moz-placeholder {color: #bbb9b9; letter-spacing:-0.6px;}
:-ms-input-placeholder {color: #bbb9b9; letter-spacing:-0.6px;}


/* nav 메인 메뉴 */
.gnb_wrap {  width: 80%; height: 45px; position: absolute; right:0px; bottom: 0;}
#nav_area{margin: 0 auto; text-align:right; }
.gnb {  display: inline-block; overflow: hidden;   z-index: 999; }
.gnb .d1 { position: relative;    float: left;  padding: 0 50px;}
.gnb .d1 a{color:#2d2d2d}

.gnb .d1 .menu_name {  display: block; font-size: 19px; font-weight: bold;  letter-spacing:-0.6px; font-family: 'NanumSquare', serif;}
.gnb .d1 .sub {    position: absolute;    top: 70px;    left: 15px; z-index:999; }
.gnb .d1 .sub ul { width: 145px; }
.gnb .d1 .sub li {margin-bottom: 8px; text-align: center; line-height:1.8; }
.gnb .d1 .sub li a {  font-size: 15px;  color: #555;  padding: 5px; letter-spacing: -0.5px;}
.gnb .d1 .sub li a:hover {color:#3c87c6; border-bottom:2px solid #3c87c6;}
.gnb .d1:last-child{margin-right:0}

/* 메뉴 흰배경 */
.gnbBg{	position:absolute; top:100px; left:0; width:100%; height:300px; background-color:#fff;
		border-top:1px solid #ddd; border-bottom:2px solid #ddd; display:none;}

.gnb .d1:nth-child(1) .sub {left:10px;} 
.gnb .d1:nth-child(2) .sub {left:27px;}
.gnb .d1:nth-child(3) .sub {left:30px;}
.gnb .d1:nth-child(4) .sub {left:31px;}
.gnb .d1:nth-child(5) .sub {left:30px;}
.gnb .d1:nth-child(6) .sub {left:26px;}
.gnb .d1:nth-child(7) .sub {left:31px;}


/* main quick menu  퀵메뉴 */
#menu-center {position: fixed;  top:326px; right:90px; display: inline-block; z-index: 99; left: calc(50% + 688px); width:150px;}
#menu-center::before{content:''; width:1px; height: 150px;  z-index: 97;
					position: absolute; top:17px; left:5px; background-color:#b7b7b7;}
#menu-center ul li {line-height: 2.8; z-index: 99; position: relative;}
#menu-center ul li a{font-size:12px; font-family: 'NanumSquare', serif; color: #818080;}
/* #menu-center ul li:hover a {color:#00aeef;} */
#menu-center ul li a.active { font-weight: 600;}
#menu-center ul li a.active:hover a {color:#00aeef;}


/* 메인 컨텐츠 시작 =================================================================================================================*/

.section_1{ position:relative; width:100%; margin-top:-100px; background:#fff; }
.section_2{width:100%;  background:#f2f2f2 url(../design_image/main/m_back1_img.png) no-repeat 50% 97%;}
.section_3{width:100%;   background:#f2f2f2 }
.section_4{width:100%;  background:#f8f6f6 url(../design_image/main/m_back3_img.png) no-repeat 50% 97%; }
.section_5{width:100%;  background-size:cover; }
.section_6{width:100%;  background:#f8f6f6}	

.section_1_area{ width:1500px; width:100%; height: 800px; margin:0 auto; box-sizing: border-box;}
.section_2_area,
.section_3_area,
.section_4_area,
.section_5_area{ width:1500px; height: 750px; margin:0 auto;  box-sizing: border-box;}
.section_6_area{ width:1300px; height: 10px; margin:0 auto;   box-sizing: border-box;}
 
.section_title { text-align:center; padding:20px 0 50px 0; font-size:45px; font-family: 'Nanum Myeongjo', serif;}

/* 관람정보 배경 메달 작업 
.section_2_area {position: relative;}
.section_2_area:before {background:url(../design_image/main/m_back1.png) no-repeat; content: ""; position:absolute;  left:-190px; top:0;
						width:200px; height:200px; display: inline-block;}

.section_2_area:after {background:url(../design_image/main/m_back2.png) no-repeat; content: ""; position:absolute;  right:-237px; bottom:-47px;
							width:360px; height:200px; display: inline-block;}*/

/* 기념관소식 배경 메달 작업 
.section_4_area {position: relative;}							
.section_4_area:before {background:url(../design_image/main/m_back3.png) no-repeat; content: ""; position:absolute;  left:-190px; top:0;
						width:200px; height:200px; display: inline-block;}

.section_4_area:after {background:url(../design_image/main/m_back4.png) no-repeat; content: ""; position:absolute;  right:-200px; bottom:-18px;
							width:215px; height:200px; display: inline-block;}*/



/* 관람정보 영역===================================================================================================================================*/ 

.swiper-slide2 img {width:100%; height:100%;margin-right:5%;}
.section_2_explain{ width: 27%; height: 457px; box-sizing: border-box; float:left; margin-right:5%;}
.section_2_guide{ width: 35%; height: 457px; box-sizing: border-box; float:left; margin-left:2%; margin-right:3%;}
.section_2_slide{ width: 26%; height: 558px; box-sizing: border-box; float:left;}

.explain {width:100%; height: 303px; background: url("../design_image/main/explain_back.png")no-repeat; padding: 5%; background-size: cover;
			box-sizing: border-box; margin-bottom: 15px;  box-shadow:0px 1px 4px rgba(0,0,0,0.1);}
.explain_border { border: 1px solid #676767; padding:5%; height: 100%; box-sizing: border-box; text-align: center;  padding-top: 65px;;}
.explain_border h1 {color:#fff; font-size:22px ; margin-bottom:10px;}
.explain_border h3  {color:#fff; font-size:16px;  font-weight: 500; line-height: 1.4;}
.explain_detail {border:1px solid #fff; padding: 5px; width: 58%; height:32px; box-sizing: border-box; 
					margin:0 auto; margin-top:30px;}
.explain_detail:hover,
.explain_detail_2:hover {background:#fff;}
.explain_detail:hover a,
.explain_detail_2:hover a { color:#000;}				
.explain_detail a,
.explain_detail_2 a{ color:#fff; display:block;  }


.explain_2 {width:100%; height: 137px; background: url("../design_image/main/explain_back_2.png")no-repeat 92% 100%; 
			padding: 5%;box-sizing: border-box;  box-shadow:0px 1px 4px rgba(0,0,0,0.1); }
.explain_border_2 { border: 1px solid #676767; padding:5%; height: 100%; box-sizing: border-box; text-align: center; 
					}
.explain_border_2 h1 {color:#fff; font-size:21px ; margin-bottom:6px;}
.explain_border_2 h3  {color:#fff; font-size:16px;  font-weight: 500; line-height: 1.4;}
.explain_detail_2 {border:1px solid #fff; padding: 5px; width: 58%; height:32px; box-sizing: border-box; 
				margin:0 auto;  color:#fff; }

/* 관람안내 시간 작업 */
.section_2_guide {position: relative;}
.guide_tit {font-size: 24px; color:#333; font-weight: bold; margin-bottom: 20px;}
.more_2{position:absolute;top:10px;right:-7px;display:block; background-image:url(../design_image/main/btn_more.png);
		width:29px;height:29px; background-repeat:no-repeat;}
.guide_1 {width: 100%; background:#fff url(../design_image/main/clock_ic.png)no-repeat 103% 120%;; height: 370px; border: 1px solid #dddddd; margin-bottom: 20px;
	box-shadow:0px 1px 4px rgba(0,0,0,0.1); }
.guide_1 ul {height: 100%;}
.guide_1 ul li {width:85%; height: 39%; padding:10% 2% 15%;  box-sizing: border-box; margin:0 auto;}
.guide_1 ul li:first-child{border-bottom:1px dashed #ddd;}
.guide_1 ul li p {width:90px; height: 43px;  display: table-cell; font-size: 20px; font-weight: bold; line-height: 1.2;
					vertical-align: middle; border-right:1px solid #ddd;}
.guide_1 ul li span {display: table-cell; vertical-align: middle; padding-left: 22px; }
.guide_time { font-size: 20px; font-weight: bold; letter-spacing: -1px;}
.guide_time_2{ font-size: 16px; color: #6c6b6b;  font-weight: bold; }

.guide_2 {width: 100%; background:#fff; height: 170px; border: 1px solid #dddddd; padding-top:50px; box-sizing: border-box; box-shadow:0px 1px 4px rgba(0,0,0,0.1);  }
.guide_2 ul li{float:left; width:31.3%; text-align: center;  box-sizing: border-box; position: relative; }
.guide_2 ul li:after{ display: inline-block; content: ""; width:1px; height:50px; background:#ddd; position: absolute; right: 0; top:13px; }
.guide_2 ul li:last-child:after {display:none;}
.guide_2 ul li a{display:block;}
.guide_2 ul li p {color:#636363; font-size:16px; font-weight: bold; margin-top:10px;}

.guide_2 a:hover  p {color:#118eff;}


/* 팝업존 1 작업 */
.v_wrap { width: 100%; height: 100%; float:left; margin-right:2.5%; box-shadow:0px 1px 4px rgba(0,0,0,0.1);
	border: 1px solid #ddd; box-sizing: border-box;} 
.main_alim {position:relative;}
.main_PB_pop{width:100%; height:100%; float:left; box-sizing:border-box; position:relative;}
.main_PB_pop .PB_img li img{width:100%;height:100%;}
.main_PB_pop .pager{ position:absolute; bottom:28px; width:100%; left:0; text-align:center;}
.main_PB_pop .pager li {margin-right:14px;display:inline-block }
.main_PB_pop .pager li a{display: block;background:#ababab; border-radius:50%;    width: 16px;    height: 16px;}
.main_PB_pop .pager .on a{background:#f2d96e}
.main_alim > .controlArea {position: absolute; bottom:0; left:0; width:80px; height:27px; background:#363636; padding-left:10px; box-sizing: border-box;}
.controlArea li {float: left; padding:7px 7px;  box-sizing: border-box;}

/*팝업존 2*/
v_wrap3 { width: 100%; height: 100%; float:left; margin-right:2.5%; box-shadow:0px 1px 4px rgba(0,0,0,0.1); 
	border: 1px solid #ddd; box-sizing: border-box;} 
.main_PB_pop3{width:100%; height:100%; float:left; box-sizing:border-box; position:relative;}
.main_PB_pop3 .PB_img3 li img{width:100%;height:100%;}
.main_PB_pop3 .pager3{ position:absolute; bottom:28px; width:100%; left:0; text-align:center;}
.main_PB_pop3 .pager3 li {margin-right:14px;display:inline-block }
.main_PB_pop3 .pager3 li a{display: block;background:#ababab; border-radius:50%;    width: 16px;    height: 16px;}
.main_PB_pop3 .pager3 .on a{background:#f2d96e}
.controlArea3 {position: absolute; bottom:0; left:0; width:80px; height:27px; background:#363636; padding-left:10px; box-sizing: border-box;}
.controlArea3 li {float: left; padding:7px 7px;  box-sizing: border-box;}



/* 교육행사안내 영역==============================================================================================================*/
.white{color:#fff; }
.section_3_slide1{ width: 26%; height: 457px;  box-sizing: border-box; float:left; margin-right:3%;}
.section_3_edu{ width: 38%; height: 457px;  box-sizing: border-box; float:left; margin-right:3%;}
.section_3_slide2{ width: 26%; height: 457px;  box-sizing: border-box; float:left;}

.edu_1 {width:48%; height: 62px; line-height: 62px; background:#00aeef; float: left; box-sizing: border-box; padding-left:25px;
		margin-right:4%; } 
.edu_2 { width:48%; height: 62px; line-height: 62px; background:#51c5f3; float: left; box-sizing: border-box; padding-left:25px;  }

.edu_1 p, .edu_2 p {display: inline-block;  }
.edu_1 a, .edu_2 a{display: block; color: #fff;font-size: 15px; font-weight: bold;   }
.edu_1 p span img, .edu_2 p span img {margin-top:23px; margin-left:25px;}


.edu_3{ width: 100%; height: 700px; background: #fff;  float: left; margin-top:4%;}

.edu_li li{padding-left:2%;  margin-bottom:20px;}

.edu_li a{ clear: both;  margin:2% 2% 2% 0%;}
.edu_li img {float: left; width:350px; height: 250px; padding-right:1%; padding-bottom:1%; }
.edu_li .edu_text {float: left;  font-size:14px; height:75px; }
.edu_li .edu_text span {display: block; font-size: 12px; color:#afafaf; line-height:1.5; }
.edu_li .edu_text p:first-child {font-weight: bold;}


/* 기념관소식 영역 ==============================================================================================================*/

.section_4_notice{ width: 30%; height: 457px;  box-sizing: border-box; float:left; margin-right:3%;}
.section_4_newsletter{ width: 100%; height: 475px;  box-sizing: border-box; float:left;}


/* 공지사항 css 작업 */

.main_board{position:relative;	width:100%;	height:132px;  margin:0 0 3% 0; box-shadow:0px 1px 4px rgba(0,0,0,0.1); 
	padding:2% 5%; background:#fff; box-sizing:border-box;}
.main_board .board_title{ font-size:18px; float:left; width:100%; height:15px; line-height:15px; background:rgba(255,255,255,.5); box-sizing:border-box;
				margin-bottom:5px; font-family: 'Nanum Gothic', sans-serif; font-weight:bold;}
.main_board .board_title p{float:left; padding-right:20px; text-align:center; position:relative;}
.main_board .board_title p a{ font-size:17px; color:#b7b5b5; }
.main_board .board_title p a:hover{color:#118eff;}
.main_board .board_title p.active { background:#fff; }
.main_board .board_title p.active a {font-weight:bold; color:#333; font-size:20px; padding:10px 0;  }
/* 
.main_board .board_title p:after{ display:inline-block; content:""; width: 1px; height: 18px; background:#fff; position: absolute; top:15px; right:-1px;	} 
.main_board .board_title p:last-child:after {display: none;}
.main_board .board_title p.active:after{ display:none; }  */


.more{position:absolute;top:20px;right:10px;display:block; background-image:url(../design_image/main/btn_more.png);
width:29px;height:29px;background-repeat:no-repeat;}
.main_board .board_list{width:100%; float:left;  box-sizing:border-box; overflow: hidden;}
.main_board .board_list li{width:100%;white-space:nowrap;overflow: hidden;text-overflow: ellipsis; line-height:-2.1; font-weight:500;      }
.main_board .board_list li:last-child{margin-bottom:0}
.main_board .board_list li a{width:73%;font-size:15px;color:#6c6c6c; display:inline-block; }
.main_board .board_list li span {float: right; color:#939292; }

.main_board_new {font-size:15px; font-weight:bold; color:#ff6c00; margin-left:5px;}


/* 공지사항/독서문화행사 앞에 리스트 점표시 */
#extractboard_1 li {background:url("../design_image/common/main/board-li.png") no-repeat 0 13px;  padding-left:15px;padding-right:10px;  box-sizing: border-box;   }
#extractboard_2 li {background:url("../design_image/common/main/board-li.png") no-repeat 0 13px;  padding-left:15px; padding-right:10px;  box-sizing: border-box;   }
#extractboard_3 li {background:url("../design_image/common/main/board-li.png") no-repeat 0 13px;  padding-left:15px; padding-right:10px;  box-sizing: border-box;   }


/* 국제평화기념사업회 작업 */
.peace {width: 100%; height:80px; background: #fff; box-shadow:0px 1px 4px rgba(0,0,0,0.1); padding:5%; box-sizing:border-box; margin-bottom: 5%; }
.peace a p {padding:4px 25px; border:1px solid #acacac; display:inline-block; float: right; color: #7b7b7b; font-weight: bold;
	margin-top:3px;}
.peace a:hover p {border:0px;  background:#333; color:#fff; }
/* un_캐릭터 작업 */
.un_charic  {position:relative; width: 100%; height:80px; background: #ebf5fc; box-shadow:0px 1px 4px rgba(0,0,0,0.1); padding:4% 5%; box-sizing:border-box;  font-family: 'NanumSquare', serif; }
.un_charic p {font-size: 18px; font-weight: bold; color: #333;}
.un_charic span {font-size: 16px; color: #676767;}
.un_charic_logo {position: absolute; right:25px; top:10px;}





/* 새소식 작업 */
.section_4_new{ width: 32%; height: 457px;  box-sizing: border-box; float:left; margin-right:3%;background: #fff; box-shadow:0px 1px 4px rgba(0,0,0,0.1);}
.new_news {padding:3% 5%; position: relative;}
.section_tit {margin-bottom:5%;  font-size:20px;}
.new_news ul li {float: left; position: relative; width:100%; margin:10px 0 20px 0;}
.new_news ul li img { width:100px; height: 65px;border:1px solid #ddd; display: inline-block; }
.new_news ul li span.new_text {display: inline-block; position: absolute; top:0; left:180px; width: 50%;
					}
.new_news ul li p{display:inline-block; float: left; width: 66px; height: 66px;  border: 1px solid #dbdbdb; padding: 7px 10px; box-sizing: border-box;
			font-size: 11px; text-align: center; margin-right:5px; }
.new_news ul li p span{color:#00aeef; font-size: 25px; font-weight: 900; display:inline-block; margin-top:-3px;}


/* 뉴스레터 작업 (625 이전)*/
/*
.section_4_newsletter {background: #fff; padding:2%; position: relative; box-shadow:0px 1px 4px rgba(0,0,0,0.1);}
.section_4_newsletter h1 { position:absolute; top:-15px; left: 50px;background: url("../design_image/main/news_back.png")no-repeat;  display:inline-block; 
					width:120px; height: 65px; 	color:#fff; padding: 20px 0 0 20px; font-size:20px;}
.news_letter {background: #f3f3f3; width: 100%; height: 100%; padding:18% 9% 0 11%; box-sizing: border-box;} 
.news_letter h3 {margin-bottom: 20px;}

.letter_1 {width:100%; height:45px; border: 1px solid #b7b6b6; box-sizing: border-box; padding:4% 0 0 10%; position: relative;  margin-bottom: 10px;}
.letter_1 p {font-size: 14px; color:#333; }
.letter_1 a span {position: absolute; right:25px; top:12px; }
.letter_2 {margin-top:30px;}
.letter_1:hover,  .letter_1:hover a  p{ background:#333; color:#fff; }
*/

/*625소장품 캠페인*/
.section_4_newsletter {background: #fff; padding:1%; position: relative; box-shadow:0px 1px 4px rgba(0,0,0,0.1);}
.section_4_newsletter h1 { position:absolute;   display:inline-block; 
					width:200px; height: 65px; 	 padding: 10px 0 0 20px; font-size:20px;}
.news_letter { width: 100%; height: 100%; padding:10% 5% 10% 5%; box-sizing: border-box;} 


.letter_1 {width:100%; height:45px; border: 1px solid #b7b6b6; box-sizing: border-box; padding:3% 0 3% 10%; position: relative;  margin-bottom: 10px;}
.letter_1 p {font-size: 14px; color:#333; }
.letter_1 a span {position: absolute; right:25px; top:12px; }
.letter_2 {margin-top:20px;}
.letter_1:hover,  .letter_1:hover a  p{ background:#333; color:#fff; }

/* 이달의 소개 영역 ==============================================================================================================*/
.section_5_area {text-align: center;}
.section_5_slide1, 
.section_5_slide2, 
.section_5_slide3{ width: 20%; height: 367px;  box-sizing: border-box; display: inline-block;}

.section_5_slide1, 
.section_5_slide2 { margin-right:9%; }
.section_5_area h3{margin-top:4%; }
.section_5_p {font-size:1.2em; margin-top:10px; font-weight: bold; }




/* SNS 영역 ==============================================================================================================*/

.section_6_area{padding-top: 80px; padding-left:50px;  box-sizing: border-box;}
.section_title_6 {font-family: 'NanumSquare', serif; font-size:28px; font-weight: 900; color:#424242;
				width:100px; height:100px; float:left; text-align: left;}
.section_title_6 p {margin-top:5px;}
.section_title_6 p img {margin-right:5px;}

.socialSlide {position: relative;  }
.socialSlide ul.your-class li {float:left; position: relative; 
					}
.socialSlide ul.your-class li:last-child {margin-right: 0px;}
.socialSlide ul.your-class li a {display:block; width:73;}

.socialSlide ul.right-class li {float:right; position: relative;  margin-right:0.2%; 
					}
.socialSlide ul.right-class li:last-child {margin-right: 0px;}
.socialSlide ul.right-class li a  {display:block;}



.socialSlide ul.controls {position:absolute; left:0; top:188px; font-size:0;}

.img_insta {padding: 2% 5%; box-sizing: border-box;}
.img_insta img{ width:100%; height: 210px; box-sizing: border-box;}
.sns_button {position:absolute; bottom:0; width: 100%; height:50px; background: #f0f1f4;padding: 15px 15px; box-sizing: border-box; }
.sns_button span {font-family: 'NanumSquare', serif; font-size:13px; color:#848383;}
.sns_button img {display:inline-block; float:right;}

.sns_youtube {padding: 5% 5%; box-sizing: border-box; font-family: 'NanumSquare', serif;}
.img_youtube {width:100%; height: 125px;  box-sizing: border-box; margin-bottom:5%; }
.sns_youtube h1 { font-size:16px; line-height: 1.2; margin-top:5px; color:#424242; margin-bottom:1%; }
.sns_youtube h3{color:#929191; }



/* 맨 및 버튼 작업 */

.section_7 {width: 100%; height: 106px; background:#3b3b3d; opacity: 0.8; }
.section_7_area {width:1300px; height: 106px; margin:0 auto;  text-align:center;}

.section_7 ul li { float:left; width:25%; box-sizing: border-box; margin-top:1.5%; height:72px; position: relative; }
.section_7 ul li a {display:block; margin:0 5%;}
.section_7 ul li a p {color:#fff; margin-top:5px;}

.section_7 ul li:after {content:""; display: inline-block; width:1px; height:55px; background:#818080; 
							position: absolute; top:10px; right:0; }

.section_7 ul li:last-child:after {display:none;}
/* .section_7 ul li a:hover p {color:#a2cbfd; font-weight:bold;} */

/* 반응형 nav 햄버거 메뉴 */
#sideR{ position:fixed; top:0; right:-80%;	width:80%; height:100%; background-color:#565759;
	overflow-y:scroll; overflow-x:visible; z-index:800;}
.sideR_search{ 	position:relative; padding:15px; padding-top:44px;}
.sideR_search input{ 	width:100%; height:32px; padding-left:10px; padding-right:80px;
	border:0; box-sizing:border-box;}
.sideR_search button{ 	position:absolute; top:44px; right:15px;	width:60px; height:32px; border:0; line-height:32px;
	background-color:#007cc2; color:#d5dfe5;}
.sideR_menu{	margin-left:15px; margin-right:15px; margin-top:40px; }
.sideR_menu .d1{	border-bottom:1px solid #999;}	
.sideR_menu .d1 .m{	position:relative;	display:block; padding-top:15px; padding-bottom:15px;	font-size:18px; color:#fff;}
.sideR_menu .d1 .m:after{ 	content:""; display:block; width:10px; height:10px;	border-left:2px solid #ccc; border-top:2px solid #ccc;
	position:absolute; top:18px; right:4px;	transform:rotate(-135deg);}
.sideR_menu .d1 .sub{	display:none;}
.sideR_menu .d1 .sub ul{	padding-top:5px; padding-bottom:20px;}
.sideR_menu .d1 .sub li{	border-bottom:1px solid #777;}
.sideR_menu .d1 .sub li:last-child{ 	border-bottom:0;}
.sideR_menu .d1 .sub li a{	display:block; padding-top:10px; padding-bottom:10px;	font-size:15px; color:#ccc;}	
.sideR_menu .d1:hover .m{	color:#42bbff;}
.sideR_menu .d1 .sub li:hover a{	color:#42bbff;}
.sideR_menu .d1.active .m{	color:#42bbff;}
.sideR_menu .d1.active .m:after{	transform:rotate(45deg); border-color:#42bbff;	top:20px;}	

.sideR_close{	position:absolute; top:15px; right:15px;	padding:5px; border:0;}
.sideR_close span{ 	display:block; width:14px; height:14px; text-indent:-9999px;
	background-image:url(../img/btn_close_menu.png);
	background-repeat:no-repeat; background-position:center;	background-size:100% auto;}

.sideR_bg{	position:fixed; top:0; right:0;	width:100%; height:100%; background-color:#fff;
	opacity:0.8; z-index:700; display:none;}
.viewplus {display:none}




.main_popz_area{ width:100%; position:relative}
.main_popz_area .pager{ position:absolute; top:9px; right:0;}
.main_popz_area .pager li{float:left; margin-left:8px}
.main_popz_area .pager ul:after{ content:""; display:block;clear:both}
.main_popz_area .pager li a{width: 14px;    height: 14px;    border-radius: 7px;    background: #fff;    display: block;}
.main_popz_area .pager .on a{background:#f2d96e}
.main_popz_area .popz_img{ width: 100%;     float: left;    margin-top: 42px;}
.main_float_R{width: 90%;    margin: 0 auto;    display: inline-block;}
.main_popz_area .popz_img li img{  width: 100%;    height: auto;    min-height: 210px;    max-height: 281px;}



/* 푸터 css */

#footer{ width:100%;  background:#323539;  }
.footer_area { width:1300px; height:160px; margin:0 auto; padding-top:30px;  position:relative; box-sizing: border-box;}
.footer_logo {width: 195px; float:left; margin-right:45px; margin-top:4px; } 
.footer_logo img{width: 195px; margin-top:30px; }

.footer_list { float:left; margin-top:5px;}
.footer_list li {display:inline-block; float:left; }
.footer_list li span{ margin: 0 20px 0 20px; color:#526375; }
.footer_list li a { color: #fff; }
.footer_list li a:hover{ color: #a2cbfd ; }
.footer_list_ul .footer_list li .on a{color:#a2cbfd;}

.foot_1 { color: #a2cbfd !important ; font-weight:bold;}

.footer_address { color:#a2a0a0; font-size:12.5px; margin-top:30px; line-height:1.45; clear:both; } 

/* 관련사이트바로가기 */
#baro_ga {position:absolute; top:30px; right:-20px; }
#baro_ga .fcount_02 select { width:215px; height:38px; line-height: 38px; color: #fff; 
							 border:1px solid #5e5e61; padding-left:15px; }
#baro_ga .fcount_02 button { width: 50px; height:38px; line-height: 38px;   
							background:#323539; border:1px solid #5e5e61; color: #fff; }

#baro_ga .fcount_02 select{ background:#323539 url('./../design_image/main/select_down.png') no-repeat 95% 50%; 
							-webkit-appearance: none;
							-moz-appearance: none;
							appearance : none;}
#baro_ga .fcount_02 select::-ms-expand { display: none; }





/* 기본화면 마지막====================================================================================================================================================================================== */
/* 기본화면 마지막====================================================================================================================================================================================== */








/* 320 모바일 사이즈 시작===================================================================================================================== */
@media screen and (min-width:320px)and (max-width:767px){

 
#header {height: 65px;}
#headerin { width: 100%;  height:65px; border-top:1px solid #eee; border-bottom:1px solid #eee; box-sizing:border-box;}
#headerin .logo {margin:15px 0 0 10px; }
#headerin .logo > a img{width:140px; }
#headerin .logo span.blog_main {margin-top:0;}

#sub-body {border-top:none; margin-top: 0px;}
#menu-center{ display:none;}
.gnb_wrap { display:none;}

.top_rest {top: -27px; right:10px; text-align:right; font-size:13px;}
.main_searchbook {display:none;}
#header .viewplus {display:none;}

/* 모바일 유엔평화기념관 main slide */
.section_1 {margin-top:0;}
.section_1_area {height: 370px; }
.section_2_area {height: 1170px; }
.section_2_area,
.section_3_area, .section_4_area, 
.section_5_area, .section_6_area, .section_7_area {width:100%; padding: 0 10px; box-sizing: border-box;}
.section_title {font-size: 30px; margin:0px; padding: 15px 0; padding-top:25px; }

/* 모바일 관람정보 작업  */
.section_2_explain{ width:100%; height: 200px; margin-right:0; }
.section_2_guide{ width:97%; height: auto; margin-right:0;}
.section_2_guide .more_2 {top:8px; right:-1px;}
.section_2_slide {display:none;}

.explain {padding:2%; height: 213px; background:url("../design_image/main/explain_back.png")no-repeat 69% 84%;
			background-size: cover; }
.explain_border {padding-top: 17px;}
.explain_2 {padding:2%; height: 113px; 
		background:url("../design_image/main/explain_back_2.png")no-repeat 100% 98%; background-size: cover;}
.explain_border_2 {padding:2%;}
.guide_tit{margin-bottom:8px; font-size: 20px;}
.guide_1 { height: 250px; border: 1px solid #dddddd; }
.guide_1 ul {height: 100%;}
.guide_1 ul li p {font-size: 18px;}
.guide_time{font-size: 17px;}
.guide_time_2{font-size: 15px;}
/*.guide_1 {height: auto; }*/
.guide_1 ul li{ padding:3% 2%; height: 30%; width: 90%;}


/* 모바일 교육행사안내 작업  */
.section_3_area .section_title {font-size: 30px; margin:0px; padding: 15px 0; padding-top:25px;}
.section_3 {background: url(../design_image/main/m_back2_img.png) no-repeat 50% 63%;}
.section_3_area {position: relative; height: 700px;}
.section_3_edu {width: 100%; margin-right:0;}


.socialSlide ul.your-class li{width:70px; margin-right:2px;}
.socialSlide ul.your-class li a {}


/* 슬라이드 히든
.section_3_slide1 {width: 50%; position: absolute; left:0 ; bottom:10px;}
.section_3_slide2 {width: 50%; position: absolute; right:0; bottom:10px;} */
.section_3_slide1 , .section_3_slide2 {display:none;}

.edu_3 {
    width: 100%;
    height: 650px;
    background: #fff;
    float: left;
    margin-top: 4%;
}
.edu_li{ margin-top:10px; width:100%; height:30%; float:left; display: block;}
.edu_li li { width: 48%; height:60%; float:left;}


.education_new .more {top:8px; right:0px;}
.section_tit {margin-bottom: 0.5%;}
.edu_li img{width:90%; height:100%; float:left;}


/* 모바일 기념관소식 작업  */
.section_4_notice,
.section_4_new,
.section_4_newsletter {width: 100%;}
.section_4_area .section_title {margin:0; padding: 15px 0; padding-top:25px;}
.peace{margin-bottom:2%; height:auto;}
.un_charic{height:auto;margin-bottom:2%; }

.section_4_notice{height:height:400px;}
.section_4_new {height: 400px; margin-bottom:2%; overflow:hidden;}
.section_4_area {min-height: 1090px;}
.news_image {display:none;}
.section_4_newsletter h1 {left:1px;}
.section_4_newsletter {height:400px; width: 96.5%;margin-left:8px; }
.news_letter {padding-top:14%; height: auto; padding-bottom: 2%;}
.letter_2{margin-top:23px;}
.letter_1{padding: 2% 5%;}

.section_5_area .section_title {margin:0; margin-bottom:2%; padding: 25px 0 25px 0;}
.section_5_area .section_title > img {width: 78%;}
.section_5_slide1, .section_5_slide2 {margin-right:1%;}
.section_5_slide1, .section_5_slide2, .section_5_slide3 {width: 32%; height: 190px;}
.section_5_area {height: auto; padding:2% 2% 5% 2%;}
.section_5_area h3 img{width: 93%;}



/* 모바일 sns 영역 이하 */
.section_title_6 {width:100%; height: 100px; text-align:center; margin:5% 0 5% 0; }

.section_7_area {padding-top:2%;}
.section_7 ul li a {position:relative; height: 100%; box-sizing:border-box; padding-top:10px;}
.section_7 ul li a img {width:28%;}
.section_7 ul li a p {position:absolute; bottom:0; text-align:center; width:100%;}




/*모바일 햄버거 오픈메뉴 */
.openMenu{ display:block;  position: absolute; top:20px; right: 10px; border:none; background:none;} 
.openMenu span{	 width:28px; height:40px; }
.openMenu img {width: 25px;}

.mainSlide {height:1470px;}
.mainSlide .mainSlide_area { width: 100%; padding: 0 10px; box-sizing:border-box; float:left;} 



/*모바일 팝업존 */
.main_popzone {width:100%; height:450px !important; }
.flexslider .slides li {height: 450px !important;}
#main-book {width:100%;  margin-top:4%;}
#main-book .list1 ul {padding:0 30px 0 30px;}
#main-book .list1 ul li {padding:15px 0px 0 0px; text-align:center; width:33.33%;}
#main-book .list1 ul li img {width:75%; }
#main-book .btns .left {left:3%;}
#main-book .btns .right {right:3%;}

.letter_digital {letter-spacing: -2px;}


/* 모바일 공지사항 */
.main_board {width:96.5%; height:180px; overflow: hidden; margin-left:8px; margin-top:20px; }
.main_board .board_title {margin-bottom:20px;}
.main_board .board_title p a {letter-spacing: -1px; font-size:15px;}
.main_board .board_list {height: 247px; padding:10px;}


.main_board .board_list li a{width:73%;font-size:15px;color:#6c6c6c; display:inline-block;
							overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.main_board .board_list li {line-height: 1.75;}
.main_board .board_list li span {font-size:13px;}



/*모바일 메인 아이콘 */
.mainIcon  {width: 100%; padding:0px 0 0px 0;  margin-bottom:3%; margin-top:3%;}
.mainIcon .Inner{width:100%; }
.mainIcon .Inner ul{text-align:center;}
.mainIcon .Inner li {width:12%; margin:2% 4%; display:block; float:left;}
.mainIcon .Inner li a img{width:30px;}
.mainIcon .Inner li.icon02 {display:inline-block; width:16%;}
.mainIcon .Inner li span {line-height: 1.2; font-size: 13px; letter-spacing: -1px;}


/*모바일 메인 알림판 */
.v_wrap  {width: 100%; height: 285px;  margin-bottom:4%;}
.v_wrap3  {width: 100%; height: 285px;  margin-bottom:4%;}
.main_pop_1 > ul {right:13px !important;}

.main_banner  {display:none;}

/*모바일 행사안내*/
.main_calendar {width: 100%; margin-bottom:4%; box-sizing:border-box; height:auto;}
.main_calendar .calendar_title {width:100%;}

.main_S_block {width: 100%; }
.main_BTN_all {width: 100%; margin-bottom:5%;  }
.main_BTN_all:after {clear:both; content:""; display:block;}
#container:after {clear:both; content:""; display:block;}


#footer{ width:100%; }
.footer_area { width:100%; padding:15px; height: 230px; box-sizing:border-box; }
.footer_logo {display:none; } 

.footer_list {width: 100%; float:left; }
.footer_list li {display:inline-block; float:left; }


.footer_address { width: 100%; clear:both; margin-top:50px; } 
.footer_address span{display:none;}
.footer_qr {display:none;}

/* 공공도서관바로가기 */
#baro_ga {display:none;} 


/*모바일 스크롤 디자인  */
.mb_scroll_01 {    position: relative;    padding-top: 0px;    width: 100%;}
.mb_scroll_01{position:relative; overflow-x:auto;    margin: 0 0 15px;}
.mb_scroll_01::-webkit-scrollbar{height:8px;}
.mb_scroll_01::-webkit-scrollbar-track{background:#eee;}
.mb_scroll_01::-webkit-scrollbar-thumb{background-color:#d2d4d2; border-radius:10px;}


.mb_scroll{position:relative; overflow-x:auto;    margin: 0 0 15px;}
.mb_scroll::-webkit-scrollbar{height:8px;}
.mb_scroll::-webkit-scrollbar-track{background:#eee;}
.mb_scroll::-webkit-scrollbar-thumb{background-color:#d2d4d2; border-radius:10px;}



.mb_img{width:100%;}/*서브 이미지 모바일 100*/



}/* 320 모바일 사이즈 끝===================================================================================================================== */







/* 768 테플릿 사이즈 시작===================================================================================================================== */
@media screen and (min-width:768px) and (max-width:1200px){



#headerin { width: 100%; border-top:1px solid #eee;  border-bottom:1px solid #eee;}
#headerin .logo {margin-left:10px; }
#sub-body {border-top:none; margin-top: 0px;}

.gnb_wrap { display:none;}

.top_rest {display:none;}
.main_searchbook {width:320px; margin-left:-320px;}
#header .viewplus {display:none;}

/* 퀵메뉴 히든 */
#menu-center {display:none;}


/* main slide */
.section_1_area {width:100%; height: 660px; }


.section_2_area,
.section_3_area,
.section_4_area,
.section_5_area,
.section_6_area{ width:100%; padding: 0 2%;}
 

/* 테블릿 관람정보 작업 */
.section_2_explain {width: 43%; margin-right: 2%;}
.section_2_guide{width: 55%; margin-right: 0%;}

.section_2_slide{display:none;}
.guide_1 ul li {height: 43%;}


/* 테블릿 교육 행사 안내작압 */
.edu_li img {width:28%;}


/* 테블릿 기념관 소식작업  */
.new_news {padding:3% 5% 0% 5%;}
.new_news .section_tit {margin-bottom:3%;}
.section_4_notice{margin-right: 2%; width: 50%; } 
.section_4_new{margin-right: 0%; width:48%; height: 295px; margin-bottom: 1%; overflow:hidden; } 
.news_image{display:none;}
.new_news ul li {margin:10px 0 1px 0;}
.section_4_newsletter {width: 48%; height: auto;}
.section_4_newsletter h1 {top:-9px; left:26px;}
.news_letter h3{ display:none;}
.news_letter {padding:5% 9% 1% 11%;}
.letter_1{ height: 37px; padding:2% 0 0 10%;}




/* 특별전시 작업 */
.section_5_slide1, .section_5_slide2{margin-right:2%; }
.section_5_slide1, .section_5_slide2, .section_5_slide3  {width:31%;}

.section_3_slide1{margin-right:2%; }
.section_3_edu {width: 58%; margin-right:0%;}
.section_3_slide1 {width: 40%;}
.section_3_slide2 {display:none;}

.section_6_area {padding-top:0px; box-sizing: border-box; height: auto;}
.section_7_area {width:100%;}




/*테블릿 햄버거 오픈메뉴 */
.openMenu{ display:block;  position: absolute; top:33px; right: 10px; border:none; background:none;} 
.openMenu span{	 width:28px; height:40px; }

.mainSlide {height:1470px;}
.mainSlide .mainSlide_area { width: 100%; padding: 0 10px; box-sizing:border-box; float:left;} 

/*테블릿 팝업존 */
.main_popzone {width:45%; float:left; margin-right:1%; height: 600px; margin-bottom:1%; }
.main_popz {height: 627px;}

#main-book {width:54%; float:left;  }
#main-book .list1 ul {padding:0 30px 0 30px;}
#main-book .list1 ul li {padding:15px 0px 0 0px; width:33.33%; text-align:center; }
#main-book .list1 ul li img {width:75%; }
#main-book .btns .left {left:3%;}
#main-book .btns .right {right:3%;}

.amazon_scroller ul li a img {width: 117px !important;}
.amazon_scroller .amazon_scroller_mask ul li {width: 172px !important;}
.amazon_scroller .amazon_scroller_mask {margin-left:15px !important; margin-right:15px !important; width:95% !important; left:0%;
	box-sizing:border-box;}






#main-book ul.tabs li { height: 50px; padding:0 15px;}
#main-book ul.tabs li a {padding:0 10px; font-size:15px;}
#main-book ul.tabs li.active {padding:0 20px;  background: #fff;}
#main-book ul.tabs .active a {padding:0; text-align:center;}
#main-book .more {right:13px;}
.main_board .board_list {height: 213px; padding-left:4%;}
#main-book ul.tabs li:after {right:-1px; top:15px; }


/* 테블릿- 공지사항 텝 작업  */
.main_board  {width:100%; height:295px; padding-left:0; margin-bottom:2%;}

.main_board .board_title p{ padding:0 20px;}
.main_board .board_title p a {font-size:15px; }
.main_board .more {right:13px;}
/* .main_board .board_list li {width: 70%;} */
.main_board .board_list li a{width:73%;font-size:15px;color:#6c6c6c; display:inline-block; 
							overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.main_board .board_list li {line-height: 1.7;}

/*테블릿 메인 아이콘 */

.mainIcon  {width: 98%; padding:10px 0 5px 0;}
.mainIcon .Inner{width:100%; }
.mainIcon .Inner ul{text-align:center;}
.mainIcon .Inner li {width:16%; margin-bottom:15px;}
.v_wrap  {width: 100%; }
.v_wrap3  {width: 100%; }

.main_banner  {display:none;}
.main_calendar {width: 41%; height: 287px;  margin-bottom:1%; box-sizing:border-box; margin-right:0;}

.main_S_block {width: 100%; }
.main_BTN_all {width: 100%; }
.main_BTN_all:after {clear:both; content:""; display:block;}
#container:after {clear:both; content:""; display:block;}



footer {width: 100%; }
.footer_area {width: 100%; height:160px; padding:30px 20px; box-sizing:border-box;}
.footer_qr {float:right;}
.footer_logo {display:none;}

/* 공공도서관바로가기 */
#baro_ga {display:none;} 



/*모바일 스크롤 디자인  */
.mb_scroll_01 {    position: relative;    padding-top: 0px;    width: 100%;}
.mb_scroll_01{position:relative; overflow-x:auto;    margin: 0 0 15px;}
.mb_scroll_01::-webkit-scrollbar{height:8px;}
.mb_scroll_01::-webkit-scrollbar-track{background:#eee;}
.mb_scroll_01::-webkit-scrollbar-thumb{background-color:#d2d4d2; border-radius:10px;}


.mb_scroll{position:relative; overflow-x:auto;    margin: 0 0 15px;}
.mb_scroll::-webkit-scrollbar{height:8px;}
.mb_scroll::-webkit-scrollbar-track{background:#eee;}
.mb_scroll::-webkit-scrollbar-thumb{background-color:#d2d4d2; border-radius:10px;}

.mb_img{width:100%;} /*서브 이미지 모바일 100*/






}/* 768 테블릿 사이즈 끝===================================================================================================================== */




/* 중간사이즈 추가 작업===================================================================================================================== */
@media screen and (min-width:768px) and (max-width:1024px){


	

	/* sns 중간사이즈*/ 
	.section_title_6 {width:100%; height: 100px; text-align:center; margin:2% 0 7% 0; }
	.slick-slider {display:block; width:100%;}
	.slick-list {display:block; width:100%;}
	.socialSlide .slick-slider {width:48%;}
	.slick-prev {left:70%;}
	.slick-next {}
	.section_6_area {padding-top:20px;}
	.section_7_area {width:100%;}

}/* 중간사이즈 추가 작업 끝=========/




