﻿/**
 * OLYM Cascading Style Sheets
 * File Name : board.css
 * Description : 게시판 스타일시트
 * Author : Web business Team / Choi Hyun Mi
 * Email : designtj@olymcompnay.com
 * Date : 2017.06.01
 * Update : 2018.10.11
 * Copyright(c) 2018 OLYM Communications. All Rights Reserved.
*/
 /* ///////////////////////////포인트컬러 변경///////////////////////////
                   #285ed4 - 현 사이트의 포인트 컬러입니다.
				   검색해서 모두 바꾸기 해주세요!
 /////////////////////////////////////////////////////////////////// */

/***********************************************************/
/******************** 게시판 공통사항 시작 *******************/
/***********************************************************/

/* 반응형 게시판 필드 숨기기 */
.pc_x { display:none;}
.mobile_o { display:none;}

@media all and (max-width:767px) { 
.mobile_x { display:none !important;}
.mobile_o { display:inline-block; float:right; font-size:13px; padding-right:30px;}
.pc_x { display:table-cell;}
}
/* 반응형 게시판 필드 숨기기 END */

/* 게시판 기본 */
#board { position:relative; word-break:break-all !important; color:inherit; } /* 글짜기준으로 줄바꿈, 글자에 공백이 없을때 넓이가 늘어나는 현상을 막기 위함 */
#board img { max-width:100%;} /* 이미지가 게시판영역을 벗어나지 않게 최대 넓이 지정 */

#board a { color:inherit; }
#board a:hover { text-decoration:underline !important; }

.box_type1 { border:1px dashed #666; padding:20px 30px; color:#666} /* 게시판 상단태그 */

/*  등록된 글이 없습니다 */
td.no_post { text-align:center; height:140px;  box-sizing:border-box;}
li.no_post { width:100% !important; text-align:center; padding:35px 0 60px 0 !important; height:auto !important;} 
#faq_list td.no_post { border-top:1px solid #d7d7d7;}

/* 게시판 기본 END */

/* 버튼 */
#board .btn { display:inline-block; border:1px solid #ccc; background:#fff; color:#555; padding:5px 15px; border-radius:3px; line-height:1.2em !important; height:auto;}
#board .btn:hover { background-color:#f7f7f7; text-decoration:none !important;}
#board input.btn { cursor:pointer; _cursor:hand;}
#board .btn_em1 { border:1px solid #285ed4; color:#285ed4; font-weight:600;}
#board .btn_em1:hover { background:#285ed4; color:#fff;}
#board .btn_em2 { border:1px solid #333; color:#333; font-weight:600;}
#board .btn_em2:hover { background:#333; color:#fff;}
#board .btn_s1 { font-size:12px; padding:2px 7px;}
#board .btn_co1 { border:1px solid #888; color:#666;}
#board .btn_calendar { display:inline-block; border:1px solid; border-color:#d6d8dc #888c93 #888c93 #d6d8dc; width:28px; height:28px; text-indent:-9999px; background:#fff url(/admode/module/board/images/kor/calender.gif) 7px 7px no-repeat; vertical-align:top; } /* 달력선택 아이콘 */
/* 버튼 END */

/* SNS 공유하기 */
#board .sns_share { margin-bottom:10px; text-align:right;}
#board .sns_share .title_sns {display:inline-block; font-weight:600; color:#333; margin-right:10px;}
#board .sns_share .btn { background-size:auto 70%; padding:5px 15px 5px 30px;}
#board .btn_naverblog {background:url(/admode/module/board/images/kor/bg_naverblog.png) no-repeat 5px center;}
#board .btn_facebook {background:url(/admode/module/board/images/kor/bg_facebook.png) no-repeat 5px center;}
#board .btn_twitter {background:url(/admode/module/board/images/kor/bg_twitter.png) no-repeat 5px center;}
#board .btn_kakaostory {background:url(/admode/module/board/images/kor/bg_kakaostory.png) no-repeat 5px center;}

@media all and (max-width:767px) { 
#board .sns_share .title_sns { vertical-align:top; margin-right:5px; font-size:0; text-indent:-9999px !important; background:url(/admode/module/board/images/kor/bg_sns_share.png) no-repeat center; background-size:cover; width:30px; height:30px;}
#board .sns_share .btn { vertical-align:top; margin-right:5px; border:none; font-size:0; text-indent:-9999px !important; background-size:cover; padding:0; width:30px; height:30px;}
#board .btn_naverblog { background:url(/admode/module/board/images/kor/bg_naverblog.png) no-repeat center; }
#board .btn_facebook { background:url(/admode/module/board/images/kor/bg_facebook.png) no-repeat center;}
#board .btn_twitter { background:url(/admode/module/board/images/kor/bg_twitter.png) no-repeat center; }
#board .btn_kakaostory { background:url(/admode/module/board/images/kor/bg_kakaostory.png) no-repeat center;}
}
/* SNS 공유하기 END */

/* 게시판 카테고리 탭형식 */
#board_tab { margin-bottom:20px;}
#board_tab > ul { display:table; table-layout:fixed; width:100%;}
#board_tab > ul > li { display:table-cell;}
#board_tab > ul > li > a { display:block; text-align:center; border:1px solid #ddd; border-left:none; padding:15px 0; height:20px; color:#666;}
#board_tab > ul > li:first-child > a { border-left:1px solid #ddd;}
#board_tab > ul > li:hover > a, #board_tab > ul > li.on > a { background:#fff; border:2px solid #285ed4; color:#285ed4; padding:14px 0;}

@media all and (max-width:1000px) { 
#board_tab { border:1px solid #ddd; padding:10px;}
#board_tab > ul { display:block; table-layout:auto;}
#board_tab > ul > li { display:inline-block; float:left;}
#board_tab > ul > li > a { padding:3px 10px; font-size:0.95em; border:none;}
#board_tab > ul > li:first-child > a { border-left:none;}
#board_tab > ul > li:hover > a, #board_tab > ul > li.on > a { padding:3px 10px; background:none; color:#333; text-decoration:underline !important; border:none;}
}
/* 게시판 카테고리 탭형식 END */

/* 게시판 카테고리 셀렉트형식 */
#board_category_select { position:absolute; left:160px; z-index:1000;}
#board_category_select select { padding:3px 3px 3px 10px; min-width:70px; height:30px; border:1px solid #ddd; color:#666; font-weight:600; border-radius:3px;}

@media all and (max-width:1000px) { 
#board_category_select { position:relative; left:auto; margin-bottom:10px;}
}
/* 게시판 카테고리 셀렉트형식 END */

/* 게시판 상단 */
#board_top { position:relative; height:30px; margin-bottom:20px; vertical-align:middle;}
#board_top .post_info { background:url(/admode/module/board/images/kor/bg_total.gif) no-repeat left 9px; float:left; padding:5px 0 0 5px; color:#505050; font-size:0.95em; font-weight:600; }
#board_top .font_post { font-weight:normal; color:#858585; padding-left:10px; }
#board_top .search_info { float:right;}
#board_top .select_search { padding:3px 3px 3px 10px; min-width:70px; height:30px; border:1px solid #ddd; color:#666; font-weight:600; border-radius:3px;}
#board_top .input_search { height:28px; min-width:120px; line-height:28px; padding:0 3px; border:1px solid #ddd; color:#666; border-radius:3px;}
#board_top .btn_search input { background:#666; border-radius:3px; width:66px; height:30px; color:#fff; font-weight:600; border:0; cursor:pointer; _cursor:hand; }

@media all and (max-width:1000px) { 
#board_top { height:auto;}
#board_top .post_info { display:none;}
#board_top .search_info { float:none; text-align:center; border-top:solid 1px #ddd; border-bottom:solid 1px #ddd; padding:20px 0; background:#f9f9f9; }
}
/* 게시판 상단 END */

/* 게시판 하단 */
/* page_navigation */
.list_page { padding:15px 0; text-align:center; clear:both;}
.list_page .num { margin:0 3px; vertical-align:top; display:inline-block; width:34px; line-height:34px; color:#404040; text-align:center;}
.list_page .num:hover { color:#285ed4; font-weight:600;}
.list_page strong { margin:0 3px; vertical-align:top; display:inline-block; border:1px solid #285ed4; background:#285ed4; border-radius:30px; width:32px; line-height:32px; color:#fff; text-align:center;}
.list_page span { margin:0 3px; vertical-align:top; display:inline-block; border:1px solid #ddd; border-radius:30px; width:32px; line-height:32px; text-indent:-9999px;}
.list_page .btn_first { background:url(/admode/module/board/images/kor/btn_first.png) no-repeat center; background-size:70%;}
.list_page .btn_prev { background:url(/admode/module/board/images/kor/btn_prev.png) no-repeat center; background-size:70%;}
.list_page .btn_next { background:url(/admode/module/board/images/kor/btn_next.png) no-repeat center; background-size:70%;}
.list_page .btn_last { background:url(/admode/module/board/images/kor/btn_last.png) no-repeat center; background-size:70%;}

/* 하단 버튼 */
#board_bottom .btn_board_bottom { padding-top:10px; height:50px; }
#board_bottom .btn_board_bottom li { float:left; padding-right:5px; }
#board_bottom .btn_board_bottom .li_right { float:right; padding-right:0; }
#board_bottom .btn_board_bottom_right { padding-top:10px; float:right; height:50px; }
#board_bottom .btn_board_bottom_right li { float:left; padding-left:5px; }
/* 게시판 하단 END */

/* 기본 게시판 뷰 */
.table_board_read, .table_board_read th, .table_board_read td { border:0; font-size:inherit;}
.table_board_read { border-top:1px solid #303030;}
.table_board_read .th { text-align:center; color:#2a2a2a; background:#f5f5f5; border-bottom:1px solid #d7d7d7; padding:9px 0; }
.table_board_read .title { font-weight:600; color:#2a2a2a; }
.table_board_read .td { padding:9px 20px; border-bottom:1px solid #d7d7d7; }
.table_board_read .td_con { padding:20px;}
.table_board_read .youtube_box { height:450px;}

@media all and (max-width:767px) { 
.table_board_read .th { padding:9px 10px;  font-size:0.875em;}
.table_board_read .td_con img { width:100%;} /* 모바일 이미지 사이즈 */
}
@media all and (max-width:440px) { 
.table_board_read .youtube_box { height:250px;}
}
/* 기본 게시판 뷰 END */

/* 뷰 -  댓글달기 */
.reply_box { position:relative;}
.reply_box h2 a { display:block; background:url(/admode/module/board/images/kor/icon_reply_read.gif) no-repeat 15px 13px; padding:10px 0 10px 40px; height:22px; border-bottom:1px solid #d7d7d7; font-weight:600; color:#2a2a2a !important;}
.reply_box h2 a:hover { color:#666; text-decoration:underline;}
.reply_box .btn_open_right { position:absolute; top:10px; right:10px;}
.commentList li { border-bottom:1px solid #d7d7d7; padding:20px;}
.commentList li:after {display:block; clear:both; content:""; }
.commentList li:hover { background-color:#f7f7f7;}
.commentList li .btn_reply { float:right; margin-top:10px; }
.commentList li .name { font-weight:600; color:#333;}
.commentList li .date { font-weight:normal; font-family:verdana; font-size:0.875em; color:#858585;}
.commentList .li_reply { padding-left:50px; background:url(/admode/module/board/images/kor/icon_reply_line.gif) no-repeat 25px 13px;}
#write_comment ul { padding:20px 20px 0 20px;}
#write_comment li { float:left; padding-right:20px;}
#write_comment li label { color:#333; font-weight:600; padding-right:10px;}
#write_comment .comment_box { padding:20px; border-bottom:1px solid #d7d7d7;}
#write_comment .reply_textarea { padding-left:3px; border:1px solid #e7e7e7; color:#565656; background:#f5f5f5; width:100%; box-sizing:border-box;}
#write_comment .btn_bottom { text-align:right; padding-top:10px;}

@media all and (max-width:767px) { 
#write_comment li { width:100%; padding-bottom:5px;}
#write_comment li label { width:30%; line-height:30px; padding-left:10px; float:left; box-sizing:border-box;}
#write_comment li input { width:70%; height:30px; float:left; box-sizing:border-box;}
}

/* 뷰 - 하단 이전, 다음글 링크 */
.table_board_read_bottom, .table_board_read_bottom th, .table_board_read_bottom td { border:0; }
.table_board_read_bottom { border-top:1px solid #303030; table-layout:fixed; }
.table_board_read_bottom th { text-align:left; color:#2a2a2a; border-bottom:1px solid #d7d7d7; padding:9px 0 8px 20px; }
.table_board_read_bottom td { padding:9px 20px; border-bottom:1px solid #d7d7d7; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
/* 뷰 -  댓글달기 END */

/* 기본 게시판 쓰기 */
.table_board_write, .table_board_write th, .table_board_write td { border:0; font-size:inherit;}
.table_board_write { border-top:1px solid #303030; }
.table_board_write th { text-align:left; color:#2a2a2a; background:#f5f5f5; border-bottom:1px solid #d7d7d7; border-right:1px solid #d7d7d7; padding:7px 20px; }
.table_board_write .th_div { border-left:1px solid #d7d7d7; }
.table_board_write td { text-align:left; padding:7px 20px; border-bottom:1px solid #d7d7d7; }
.table_board_write .notice { font-size:0.95em; font-weight:600; }
.table_board_write .textarea_form { height:100px;} /* 링크게시판 내용 */
#board_write .box_policy { width:100%; border-bottom:1px solid #d7d7d7; padding-bottom:20px; letter-spacing:-0.05em;}
#board_write .box_policy .privacy { margin:20px; border:1px solid #d7d7d7; height:120px; padding:10px; overflow-y:scroll; }
#board_write .box_policy .privacy { padding:15px; color:#767676; }
#board_write .box_policy .privacy h1 { color:#2a2a2a; font-weight:600; text-align:center; padding-bottom:15px; }
#board_write .box_policy .privacy h2 { padding:15px 0 10px 0; font-weight:600; color:#666; }
#board_write .box_policy .p_privacy { text-align:center; color:#767676; }

@media all and (max-width:440px) { 
.table_board_write { display:block;}
.table_board_write th { display:block; border-right:none; background:none; border-bottom:none; padding:7px 20px 0 20px;}
.table_board_write .th_div { border-left:none; }
.table_board_write td { display:block;}
.table_board_write td input[type="text"] { width:100% !important;}
.table_board_write .m_block { display:block;}
}
/* 기본 게시판 쓰기 END */

/* 게시물 삭제 */
#board_password { min-height:250px;}
#board_password .password_text { border-top:1px solid #303030; border-bottom:1px solid #d7d7d7; padding:50px 20px; text-align:center;}
#board_password .btn_bottom { padding:10px 0; text-align:right;}
#board_password .title .em { color:#2a2a2a; font-weight:600;}
#board_password .pw_input { padding:20px 0; border:1px dashed #d7d7d7; width:60%; margin:20px auto 0 auto}
#board_password .pw_input span { margin-right:20px; color:#2a2a2a; font-weight:600;}

@media all and (max-width:767px) { 
#board_password .pw_input { width:100%; }
}
/* 게시물 삭제 END */

/**********************************************************/
/******************** 게시판 공통사항 끝 ********************/
/**********************************************************/

/* 일반게시판 olym_basic */
.table_board_basic, .table_board_basic th, .table_board_basic td { border:0; font-size:inherit;}
.table_board_basic { table-layout:fixed; border-top:1px solid #303030;}
.table_board_basic th { padding:10px; color:#2a2a2a; background:#fafafa; border-bottom:1px solid #a2a2a2; font-weight:600;}
.table_board_basic tbody tr:hover { background:#f7f7f7; transition: all .3s ease;}
.table_board_basic tbody td { background:none; }
.table_board_basic td { text-align:center; padding:15px 0 14px 0; border-bottom:1px solid #d7d7d7; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.table_board_basic td .font_co1 { color:#285ed4; font-size:0.95em; font-weight:600;}
.table_board_basic .td_left { text-align:left; padding-left:15px; }
/* 일반게시판 olym_basic END */

/* 갤러리 게시판 olym_gallery */
#gallery_list { border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; padding:30px 10px 0 10px; }
#gallery_list li { float:left; width:33.33%;}
#gallery_list li .con_box { width:90%; max-width:300px; margin:0 auto 30px auto;}
#gallery_list li .img { border:1px solid #d7d7d7; background:#f1f1f1; height:200px; overflow:hidden; text-align:center; position:relative;}
#gallery_list li a img { transition: transform .3s; position:absolute; min-width:100%; width:auto; height:auto; margin:auto; top:0; bottom:0; left:0; right:0;}
#gallery_list li a:hover img {transform:scale(1.1);}
#gallery_list li a .p_title { padding:10px;  color:#666; text-align:center; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
#gallery_list li .p_btn { text-align:center;}

@media all and (max-width:1000px) { 
#gallery_list li { width:50%;}
}
@media all and (max-width:440px) { 
#gallery_list { border-top:0; padding:10px 0 0 0; }
#gallery_list li { width:100%; }
}
/* 갤러리 게시판 olym_gallery END */

/* 포토뉴스게시판 (이미지 + 내용) olym_photonews */
#news_list .news_post { border-top:1px solid #d7d7d7;}
#news_list .news_post > li { border-bottom:1px solid #d7d7d7; padding:20px; }
#news_list .img { float:left; width:20%; max-width:180px; margin-right:3%;}
#news_list .img a { background:#f1f1f1; display:block; border:1px solid #d7d7d7; position:relative; height:130px; overflow:hidden;}
#news_list .img a img { position:absolute; width:auto; margin:auto; top:0; bottom:0; left:0; right:0;}
#news_list .desc { overflow:hidden;} /* 첨부이미지가 없을때 이미지가 보이지 않게 */
#news_list .desc .title { padding:10px 0; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}
#news_list .desc .title a { color:#2a2a2a; font-size:1.125em; font-weight:600;}
#news_list .desc .check_box { padding-right:5px; vertical-align:top;}
#news_list .desc_info { padding-top:7px; color:#505050;}
#news_list .desc_info li { float:left; padding-right:10px; }
#news_list .font_post { font-weight:normal; color:#858585; }

@media all and (max-width:767px) {
#news_list .img a { height:100px;}
}
@media all and (max-width:440px) { 
#news_list .news_post { border-top:0;}
#news_list .img { width:100%; max-width:100%; margin:0;  padding-bottom:20px;}
#news_list .img a { height:auto;}
#news_list .img a img { position:relative;}
#news_list .desc { width:100%;}
}
/* 포토뉴스게시판 (이미지 + 내용) olym_photonews END */

/* 인증서 게시판 olym_certificate */
#cert_list { border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; padding-top:20px; }
#cert_list li { float:left; width:25%; padding-bottom:30px; height:250px; }
#cert_list li .img_box { background:#f1f1f1; border:1px solid #d7d7d7; padding:10px; height:200px; width:140px; position:relative;  overflow:hidden; margin:0 auto; }
#cert_list li .img_box img { position:absolute; width:auto; max-width:100%; max-height:100%; margin:auto; top:0; bottom:0; left:0; right:0;}
#cert_list li .p_title { padding:10px; text-align:center;  color:#666;}

@media all and (max-width:767px) { 
#cert_list li { width:50%;}
#cert_list li .p_title { font-size:0.95em;}
}
@media all and (max-width:440px) { 
#cert_list li .img_box { padding:5px; height:170px; width:120px; }
}
/* 인증서 게시판 olym_certificate END */

/* FAQ 게시판 olym_faq */
#faq_list .table_faq, .table_faq th, .table_faq td { border:0; font-size:inherit;}
#faq_list .table_faq { border-bottom:1px solid #d7d7d7; }
#faq_list .table_faq .th { text-align:left; border-top:1px solid #d7d7d7; border-bottom:1px solid #fff; padding:15px 10px 15px 50px; position:relative; font-weight:400;}
#faq_list .table_faq .th .title { color:#2a2a2a;}
#faq_list .table_faq .h_q { position:absolute; top:15px; left:15px; color:#2a2a2a; font-weight:600; font-family:"verdana"; font-size:1.05em;}
#faq_list .table_faq .h_q .num { font-size:0.75em;}
#faq_list .table_faq .td { background:#f7f7f7; padding:15px 10px 15px 50px; border-top:1px solid #d7d7d7; position:relative;}
#faq_list .table_faq .h_a { position:absolute; top:15px; left:15px; display:inline-block; color:#285ed4;  font-weight:600; font-family:"verdana"; font-size:1.05em;}
#faq_list .table_faq .h_a .num { font-size:0.75em;}
#faq_list .btn_faq { position:absolute; right:10px; }
/* FAQ 게시판 olym_faq END */

/* 관련사이트 게시판 olym_link */
#link_list { border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; padding-top:30px; }
#link_list li { float:left; width:25%; padding:0 10px 30px 10px; box-sizing:border-box; text-align:center;}
#link_list li .img { height:40px; padding:10px 0; overflow:hidden; border:1px solid #d7d7d7; max-width:200px; margin:0 auto;}
#link_list li a img { max-width:100%; height:100%; max-height:40px;}
#link_list li a .p_title { padding:10px; color:#666;}
#link_list li .p_con {  padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #efefef;}

@media all and (max-width:1260px) {
#link_list li { width:33.33%;}
}
@media all and (max-width:767px) {
#link_list li { width:50%;}
#link_list li a .p_title { font-size:0.95em;}
}
@media all and (max-width:440px) { 
#link_list { border-top:0; padding-top:10px; }
#link_list li { padding:0 5px 20px 5px;}
#link_list li .img { padding:5px 0;}
}
/* 관련사이트 게시판 olym_link END */

/* 동영상 게시판 olym_movie */
#movie_list { border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; padding-top:30px; }
#movie_list li { float:left; width:50%; padding:0 20px 30px 20px; box-sizing:border-box; text-align:center;}
#movie_list li .img_box { background:#f1f1f1; display:block; border:1px solid #d7d7d7; position:relative; height:240px; max-width:420px; margin:0 auto; overflow:hidden;}
#movie_list li .img_box img { position:absolute; width:auto; margin:auto; top:0; bottom:0; left:0; right:0;}
#movie_list li .p_title { padding:10px; color:#555; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

@media all and (max-width:767px) {
#movie_list li { padding:0 10px 30px 10px;}
#movie_list li .img_box { height:180px;}
}
@media all and (max-width:440px) { 
#movie_list { border-top:0; padding-top:10px; }
#movie_list li { width:100%;}
}
/* 동영상 게시판 olym_movie END */

/* 유튜브 게시판 olym_youtube 1,2 리스트 공통 */
#youtube_list { border-top:1px solid #d7d7d7; border-bottom:1px solid #d7d7d7; padding-top:30px; }
#youtube_list li { float:left; width:50%; padding:0 20px 30px 20px; box-sizing:border-box; text-align:center;}
#youtube_list li .img_box { height:240px; position:relative; max-width:420px; margin:0 auto; }
#youtube_list li .img_box:hover {cursor:pointer;}
#youtube_list li .p_title { padding:10px;}
/* 유튜브1 플레이버튼 */
#youtube_list li .img_box .btn_play { position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background:url(/admode/module/board/images/kor/btn_play_off.png) no-repeat center; background-size:100%; width:64px; height:64px; }
#youtube_list li .img_box:hover .btn_play {background:url(/admode/module/board/images/kor/btn_play_on.png) no-repeat center; background-size:100%; }

@media all and (max-width:767px) {
#youtube_list li { padding:0 10px 30px 10px;}
#youtube_list li .img_box { height:180px;}
#youtube_list li .img_box .btn_play { width:44px; height:44px; }
}
@media all and (max-width:440px) { 
#youtube_list { border-top:0; padding-top:10px; }
#youtube_list li { width:100%; }
}

/* Modal */
.modal { display: none; position: fixed; z-index: 10000; padding-top: 100px; left: 0; top: 0; width: 100%; height: 100%; overflow: auto; background: rgba(0,0,0,0.6);}
.modal-content { position: relative; background: #fefefe; margin: auto; width: 800px; box-sizing: border-box; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); animation-name: animatetop; animation-duration: 0.4s; }
.modal-content iframe { width: 800px; height: 500px; }
.modal-content video { width: 100%; height: 100%; }

@-webkit-keyframes animatetop {  
from { top:-300px; opacity:0}
to { top: 0; opacity: 1 }
}
@keyframes animatetop { 
from { top:-300px; opacity:0}
to { top: 0; opacity: 1 }
}
.modal-header { padding: 15px 20px; background: #285ed4; }
.modal-header h2 { color: #fff; font-weight: bold; }
.modal-header .close { color: #fff; float: right; font-size: 28px; line-height:15px !important; font-weight: bold; }
.modal-header .close:hover, .modal-header .close:focus { color: #000; cursor: pointer; }

@media all and (max-width:767px) {
.modal-content { width: 90%; height: auto; }
.modal-content iframe { width: 100%; height: 250px; }
}
/* 유튜브 게시판 olym_youtube 1,2 리스트 공통 END */
