@charset "utf-8";
@font-face {font-family: 'Roboto-Light';src: url('/static/webfonts/Roboto-Light.eot');src: url('/static/webfonts/Roboto-Light.eot?#iefix') format('embedded-opentype'),url('/static/webfonts/Roboto-Light.woff') format('woff'),url('/static/webfonts/Roboto-Light.ttf') format('truetype');}
@font-face {font-family: 'Roboto-Regular';src: url('/static/webfonts/Roboto-Regular.eot');src: url('/static/webfonts/Roboto-Regular.eot?#iefix') format('embedded-opentype'),url('/static/webfonts/Roboto-Regular.woff') format('woff'),url('/static/webfonts/Roboto-Regular.ttf') format('truetype');}
@font-face {font-family: 'Roboto-Medium';src: url('/static/webfonts/Roboto-Medium.eot');src: url('/static/webfonts/Roboto-Medium.eot?#iefix') format('embedded-opentype'),url('/static/webfonts/Roboto-Medium.woff') format('woff'),url('/static/webfonts/Roboto-Medium.ttf') format('truetype');}
@font-face {font-family: 'Roboto-Bold';src: url('/static/webfonts/Roboto-Bold.eot');src: url('/static/webfonts/Roboto-Bold.eot?#iefix') format('embedded-opentype'),url('/static/webfonts/Roboto-Bold.woff') format('woff'),url('/static/webfonts/Roboto-Bold.ttf') format('truetype');}



/* reset */
a, abbr, address, article, aside, audio, b, big, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video, xmp {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/* body */
body { line-height: 1; } 

/* a */
a:link, a:visited { text-decoration: none; color: #343434; }
a:hover, a:active { text-decoration: none; color: #343434; }

/* 제목 폰트 사이즈 초기화 */
h1, h2, h3, h4, h5, h6 { font-size: 100%; }

​/* 리스트 스타일 제거 */
ol, ul { list-style: none; }

/* 인용구 표시 초기화 */
blockquote, q { quotes: none; } 
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

/* 폰트 강조 특성 초기화 */
address, caption, cite, code, dfn, em, strong, th, var { font-style: normal; font-weight: normal; }

/* 테이블 스타일 초기화 */
table { border-collapse: collapse; border-spacing: 0; }

/* 텍스트 정렬 초기화 */
caption, th, td { text-align: left; vertical-align: middle; }

/* 이미지와 fieldset의 border 표기 초기화 */
fieldset, img { border: 0; }

/* hr */
hr { display: none; }

/* 시각적으로 안보이게 하겠다  */
.hidden, legend { width: 0; height: 0; margin: 0; padding: 0; overflow: hidden; line-height: 0; font-size: 0; visibility: hidden; position: absolute; left: 0; top: 0; } 



/* base */
html { font-size: 16px; }
body {
	background: #FFFFFF;
	font-family: 'Roboto-Regular', sans-serif;
	line-height: 1.4;
	color: #333333;
	word-wrap: break-word;
	-webkit-text-size-adjust: none;
}
video {background-color: #FFFFFF;}
video:-webkit-full-page-media {
	background-color: #FFFFFF !important;
}
img { max-width: 100%; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
.clearfix { display: block; }






/* layout */
#wrap {
	width: 100%;
	/*padding-bottom: 30px;*/
	/* height: 100%; */ /* 메뉴 열렸을 경우 */
	/*padding-top: 96px;*/
}

header { position: fixed; top: 0; left: 0; width: 100%; height: 96px; background-color: #FFFFFF; z-index: 3000; }
header .header-wrap { margin: 0 auto; max-width: 1520px; }
header .header-wrap h1 { float: left; width: 14%; margin-top: 25px; }
header .header-wrap .gnb { float: left; width: 72%; padding: 0 5%; box-sizing: border-box; }
header .header-wrap .gnb ul { display: table; width: 100%; }
header .header-wrap .gnb ul li { text-align: center; line-height: 94px; display: table-cell; }
header .header-wrap .gnb ul li a { display: inline-block; height: 91px; border-bottom: #FFFFFF 5px solid; font-size: 20px; font-family: 'Roboto-Medium'; }
header .header-wrap .gnb ul li a:hover { border-bottom: #0055C3 5px solid; color: #0055C3; }
header .header-wrap .gnb ul li a.hover { border-bottom: #0055C3 5px solid; color: #0055C3; }
header .header-wrap .gnb ul li a.active { border-bottom: #0055C3 5px solid; color: #0055C3; }
header .header-wrap .outside-link { float: left; width: 14%; }
header .header-wrap .outside-link ul { background-color: #fff; margin-top: 30px; }
header .header-wrap .outside-link ul li { float: right; width: 50%; }
header .header-wrap .outside-link ul li a { display: block; width: 100%; line-height: 28px; text-align: center; border: #999999 1px solid; box-sizing: border-box; font-size: 13px; font-family: 'Roboto-Medium'; }
header .header-wrap .outside-link ul li:first-child a { background-color: #999999; color: #FFFFFF; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
header .header-wrap .outside-link ul li:last-child a { border-top-right-radius: 3px; border-bottom-right-radius: 3px;  }
header .header-wrap .outside-link ul li a img { vertical-align: middle; margin-right: 3px; }
header .submenu-area { position: absolute; margin: 0 0 0 0; width: 100%; height: 48px; background-color: #F1F1F1; border-top: #D7DBE4 1px solid; border-bottom: #D7DBE4 1px solid; z-index: 9999; }
header .submenu-area ul { float:right; width: 70%; display: block; }
header .submenu-area ul li {display: inline-block; padding: 0 3%; line-height: 48px; text-align: center;  }
header .submenu-area ul li:last-child { margin-right: 0; }
header .submenu-area ul li a:hover { color: #0055C3; }

/* Mobile Header */
header .header-mobile-wrap { margin: 0 auto; width: 94%; height: 60px; display: none; }
header .header-mobile-wrap h1 { margin-top: 15px; }
header .header-mobile-wrap .gnb-btn-open {
	position: absolute;
	right: 0;
	padding: 20px 3% 0 0;
	float: right;
	width: 26px;
	height: 20px;
	cursor: pointer;
	z-index: 20000;
	-webkit-transition: opacity .25s ease;
	transition: opacity .25s ease;
	/*display: none;*/
	top: 0;
}
header .header-mobile-wrap .gnb-btn-open.active .top {
	-webkit-transform: translateY(9px) translateX(0) rotate(45deg);
	transform: translateY(9px) translateX(0) rotate(45deg);
	background-color: #666666;
}
header .header-mobile-wrap .gnb-btn-open.active .middle {
	opacity: 0;
	background-color: #666666;
}
header .header-mobile-wrap .gnb-btn-open.active .bottom {
	-webkit-transform: translateY(-9px) translateX(0) rotate(-45deg);
	transform: translateY(-9px) translateX(0) rotate(-45deg);
	background-color: #666666;
}
header .header-mobile-wrap .gnb-btn-open span {
	position: absolute;
	background-color: #0055C4;
	border: none;
	height: 3px;
	width: 26px;
	-webkit-transition: all .35s ease;
	transition: all .35s ease;
	cursor: pointer;
}
header .header-mobile-wrap .gnb-btn-open span:nth-of-type(2) { margin-top: 9px; }
header .header-mobile-wrap .gnb-btn-open span:nth-of-type(3) { margin-top: 18px; }

/* Mobile GNB */
#gnb-wrap { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #F1F1F1; z-index: 2000; overflow-y: scroll; display: none; }
#gnb-wrap ul.main { margin-top: 60px; }
#gnb-wrap ul.main > li { text-align: center; }
#gnb-wrap ul.main > li h2,
#gnb-wrap ul.main > li h2 a { color: #333333; font-size: 20px; padding-top: 5%; }
#gnb-wrap ul.sub {}
#gnb-wrap ul.sub li,
#gnb-wrap ul.sub li a { color: #666666; font-size: 16px; padding-top: 2%; }
#gnb-wrap .moblie-outside-link { text-align: center; margin-top: 5%; padding-top: 5%; border-top: #D6DCE3 1px solid; }
#gnb-wrap .moblie-outside-link a { display: inline-block; width: 130px; line-height: 35px; background-color: #999999; color: #FFFFFF; border-radius: 3px; }



/* main keyvisual */
#keyvisual { width: 100%; }
#keyvisual  { padding-top: 96px; }
#keyvisual .main-keyvisual img { display: block; width: 100%; }



/* Main Contents */
#container { margin: 0 auto; width: 1180px; padding: 120px 0 80px 0; }
#container .main-content { float: left; width: 33.333333333%; }
#container .main-content .text-area { width: 380px; height: 290px; text-align: center; }
#container .main-content .text-area h3 { display: inline-block; font-size: 28px; font-weight: bold; padding: 30px 0 15px; border-bottom: #333333 1px solid; }
#container .main-content .text-area div { padding-top: 20px; }
#container .main-content .text-area a { display: inline-block; width: 150px; line-height: 36px; border: #333333 2px solid; font-weight: bold; margin-top: 30px; }
#container .main-content .img-area { width: 380px; height: 280px; overflow: hidden; }
#container .main-content .img-area img { -webkit-transition: -webkit-transform 2s ease;  -moz-transition: -moz-transform 2s ease;  -o-transition: -o-transform 2s ease;  transition: transform 2s ease; }

#container .main-content.hover .text-area h3 { border-bottom: #0055C3 1px solid; color: #0055C3; }
#container .main-content.hover .text-area a { background-color: #0055C3; border: #0055C3 2px solid; color: #FFFFFF; }
#container .main-content.hover .img-area img { -webkit-transform: scale(1.2);  -moz-transform: scale(1.2);  -ms-transform: scale(1.2);  -o-transform: scale(1.2);  transform: scale(1.2); }

#main-content-1 {}
#main-content-2 .text-area,
#main-content-2 .img-area { margin-left: auto; margin-right: auto; }
#main-content-2-mobile { display: none; }
#main-content-3 .text-area,
#main-content-3 .img-area { margin-left: auto; }



/* Footer */
footer { width: 100%; height: 100px; background-color: #0C4CA3; color: #B3C8E5; box-sizing: border-box; }
footer .footer-wrap { margin: 0 auto; max-width: 1520px; height: 100px; }
footer .footer-wrap .footer-logo { float: left; width: 14%; }
footer .footer-wrap .footer-logo img { margin-top: 30px; }
footer .footer-wrap .copyright { float: left; width: 86%; line-height: 100px; text-align: right; }
footer .footer-wrap .copyright span { padding-right: 60px; }
footer .footer-wrap .copyright span:last-child { padding-right: 0; }
footer .footer-wrap .copyright strong { color: #FFFFFF; }
footer .footer-mobile-wrap { display: none; }



/* sub common */
#keyvisual .sub-visual {position: relative}
#keyvisual .sub-visual img {vertical-align: bottom; width: 100%;}
#keyvisual .sub-visual .copy-area {position: absolute; color: #fff; left: 10%; top: 25%;}
#keyvisual .sub-visual .copy-area h2 {font-size: 1.75em; margin-bottom: 3%;}
#keyvisual .sub-visual .copy-area h3 {font-size: 4.5em; line-height: 1;}
#keyvisual .sub-visual .pager {position: absolute; left: 10%; bottom: 5%; color: #fff;}
#keyvisual .sub-visual .pager a {color: #fff; font-size: 1em;}



/* Sub Contents */
#sub-container .conts {padding: 120px 0 120px}
#sub-container .conts .inner_conts {width: 1200px; margin: 0 auto;}
#sub-container .conts .cont_title {width: 1200px; margin: 0 auto; margin-bottom: 3%; position: relative}
#sub-container .conts .cont_title h4 {text-align: center; color: #0055c3; font-family: 'Roboto-Bold'; font-size: 2.5em; padding:0 10%;}
#sub-container .conts .cont_title p {font-family: 'Roboto-Light'; font-size:1.25em; line-height:1.875em; text-align: center;}
#sub-container .conts ul li {float: left; width: 23.75%; margin-right: 1.66%}
#sub-container .conts ul li:nth-of-type(4) {margin-right: 0}
#sub-container .conts ul li div {text-align: center;}
#sub-container .conts ul li div > img {width: 100%; display: block;}
#sub-container .conts .inner_conts .cont_sec h5 { font-family: 'Roboto-Bold'; font-size: 1.5em; margin: 5% 0 1%;}
#sub-container .conts .inner_conts .cont_sec p {font-family: 'Roboto-Light'; font-size: 1em;}



/* Sub Page */

#sub-container .conts .cont_title h4 {font-size: 2.875em;}
#sub-container .conts .cont_title a {display: block; position: absolute; right: 0; bottom: 0; font-family:'Roboto-Bold'; padding-right: 20px}
#sub-container .conts .cont_title a .right_arrow {position: absolute; right: 0; bottom: 8px;}
#sub-container .conts .cont_title a .right_top_arrow, 
#sub-container .conts .cont_title a .right_bottom_arrow {border-top:1px solid #000; width: 10px; display: block;}
#sub-container .conts .cont_title a .right_top_arrow {margin-bottom: 5px; transform: rotate(45deg);}
#sub-container .conts .cont_title a .right_bottom_arrow {transform: rotate(-45deg)}

#sub-container .conts .inner_conts .thumb_area {position: relative; overflow: hidden; height:15em; background-color:#fff;}
#sub-container .conts .inner_conts .thumb_area > img {width: 100%; display: block; transition: all ease 2s;}
#sub-container .conts .inner_conts .thumb_area .thumb_info_box {position: absolute; width: 100%; bottom: 0; background: rgba(0,0,0,.5); color: #fff;}
#sub-container .conts .inner_conts .thumb_area .thumb_info_box h5 {font-size: 1.25em; text-align: left; display: inline-block; width: 54%; padding-left: 5%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
#sub-container .conts .inner_conts .thumb_area .thumb_info_box span {display: inline-block; width: 34%; text-align: right; padding-right: 5%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; vertical-align: super}
#sub-container .conts .inner_conts .thumb_area a {position: absolute; top: 0; left: 0; right: 0; bottom: 0; text-indent: -99999px;}
#sub-container .conts .inner_conts .thumb_area:hover img {transform: scale(1.2); transition: all ease 2s;}
#sub-container .conts .inner_conts .thumb_area .thumb_info_box span img {display: inline}

#sub-container .conts .inner_conts .thumb_area_list {height:13.125em;}

#sub-container .conts .paging {display: block; text-align: center; margin-top: 50px;}
#sub-container .conts .paging a {display: inline-block; text-indent: -99999px; width: 26px; height: 26px}
#sub-container .conts .paging .prev_page {background: url(../../images/num_prev.png) no-repeat; line-height: 26px; margin-right: 20px;}
#sub-container .conts .paging .next_page {background: url(../../images/num_next.png) no-repeat; line-height: 26px; margin-left: 20px;}
#sub-container .conts .paging .page_num {background: url(../../images/num_off.png) no-repeat; text-indent: 0; text-align: center; line-height: 26px; font-family: 'Roboto-Bold'; margin: 0 5px;}
#sub-container .conts .paging .current_page {background: url(../../images/num_on.png) no-repeat; color: #fff;}

#sub-container .conts .conts-tab {width: 1200px; margin: auto; text-align: center; border-bottom: 1px solid #d6dce3; padding-bottom: 10px; margin-bottom: 2%;}
#sub-container .conts .conts-tab i {margin: 0 1%; color: #d6dce3}
#sub-container .conts .conts-tab a {font-family:'Roboto-Medium'; font-size: 1.25em; padding-bottom: 8px;}
#sub-container .conts .conts-tab a.active {color: #0055c3; border-bottom: 5px solid #0055c3}

#sub-container .cont_01_01 {background: #f4f5f6;}
#sub-container .cont_01_02,
#sub-container .cont_01_03 {padding: 120px 0 0}
#sub-container .cont_01_05 {padding: 0 0 120px}

#sub-container .cont_01_01 ul {padding: 0 4%;}
#sub-container .cont_01_01 ul li {float: none; width: inherit; margin-right: 0; margin-bottom: 2%;}
#sub-container .cont_01_01 ul li .cont_sec {overflow:hidden; text-align:left;}
#sub-container .cont_01_01 ul li .cont_sec img {display: inline-block; float:left; width:258px;height:258px; margin-right:60px; }
#sub-container .cont_01_01 ul li .cont_sec p {line-height:1.8;}

#sub-container .cont_01_04 {text-align: center;}
#sub-container .cont_01_04 ul {margin-top: 2.5%;}
#sub-container .cont_01_04 ul li {width: 15%; padding: 0; margin-right: 0;}
#sub-container .cont_01_04 ul li:nth-of-type(1) {margin-left: 27.5%;}
#sub-container .cont_01_04 .inner_conts {position: absolute; width: 100%;}
#sub-container .cont_01_04 .inner_conts .cont_sec h5 {color: #fff; font-size: 1.125em}
#sub-container .cont_01_04 .inner_conts .cont_sec img {width: inherit; display: inline}

#sub-container .cont_01_05 .inner_conts {position: relative}
#sub-container .cont_01_05 .inner_conts .cont_sec h5 {font-size: 1.25em; font-family: 'Roboto-Regular'}
#sub-container .cont_01_05 .inner_conts .tab_02 {display: none;}


#sub-container .conts_02 ul li {float: left; width: 32.33333%; margin-right: 1.5%; margin-bottom: 1.5%;}
#sub-container .conts_02 ul li:nth-of-type(3),
#sub-container .conts_02 ul li:nth-of-type(6) {margin-right: 0;} 
#sub-container .cont_02_02 {background: #f4f5f6;}

#sub-container .conts_02 ul li div img {width: initial; display: inline}
#sub-container .conts_02 ul li:nth-of-type(4) { margin-right: 1.5%; margin-bottom: 1.5% }


#sub-container .conts_03 .inner_conts {width: 1180px; position: relative}
#sub-container .conts_03 .inner_conts .btn_wrap a {display: block; position: absolute; width: 3.4%;}
#sub-container .conts_03 .inner_conts .btn_wrap a.prev_btn {left: 0;}
#sub-container .conts_03 .inner_conts .btn_wrap a.next_btn {right: 0}

#sub-container .conts_03 .inner_conts .media-desktop-view .slick-arrow {width: 3.2%;}
#sub-container .conts_03 .inner_conts .media-tablet-view .slick-arrow {width: 4.6%;}

#sub-container .conts_03 .inner_conts .slick-prev {left: 0}
#sub-container .conts_03 .inner_conts .slick-next {right: 0}

#sub-container .cont_03_01 ul li {margin: 0 0.88%;}
#sub-container .cont_03_01 .inner_conts ul {padding: 0 5.2%;}
#sub-container .cont_03_01 .inner_conts ul li {width: 32.22%;}
#sub-container .cont_03_01 .inner_conts ul li:nth-of-type(4) {margin: 0 0.88%;}

#sub-container .cont_03_02 {background: #f4f5f6;}
#sub-container .cont_03_02 .inner_conts ul li {margin-bottom: 1.67%}
#sub-container .cont_03_02 .inner_conts ul li:nth-of-type(8) {margin-right: 0}

#sub-container .conts_03 .inner_conts .media-mobile-view li,
#sub-container .conts_03 .inner_conts .media-mobile-view li:nth-of-type(4) {margin: 0;}


#sub-container .conts_04 .inner_conts .board_title_wrap {border-top: 1px solid #e6e6e6; border-bottom: 2px solid #000; padding: 10px 0;}
#sub-container .conts_04 .inner_conts .board_title_wrap h4 {width: 50%; float: left; font-size: 2em; font-family: 'Roboto-Medium'}
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info {width: 50%; float: right; padding: 10px 0; text-align: right;}
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_like {font-size: 1.25em; color: #0055c3; border-right: 1px solid #e6e6e6; padding-right: 15px;}
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_like img {cursor: pointer;}
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_date {color: #666666; padding-left: 15px; margin-right: 15px;}
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_date strong,
#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_count strong {color: #000;}
/* #sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_like:after {content: "|"; display: inline; margin: 0 10px; color: #e6e6e6;} */
#sub-container .conts_04 .inner_conts .sns_icon ul {float: right; margin-top: 10px;}
#sub-container .conts_04 .inner_conts .sns_icon ul li {width: inherit; margin-right: 0; margin-left: 5px;}
#sub-container .conts_04 .inner_conts .sns_icon ul li.whatsapp {display: none;}
#sub-container .conts_04 .inner_conts .board_conts {margin-top: 30px; border-bottom: 1px solid #e6e6e6}
#sub-container .conts_04 .inner_conts .board_conts .border_img_cont {text-align: center;}
#sub-container .conts_04 .inner_conts .board_conts .border_txt_conts {margin: 30px 0 50px; line-height: 1.4; min-height: 200px; }
#sub-container .conts_04 .inner_conts .board_btn {display: block; text-align: right;}
#sub-container .conts_04 .inner_conts .board_btn a {color: #fff; display: inline-block; text-align: center; background: #333; width: 200px; line-height: 55px; margin-top: 20px; font-size: 1.375em;}

#sub-container .conts_05 ul li {float: none; width: inherit; margin-right: 0; margin-bottom: 2%;}
#sub-container .conts_05 ul li span {margin-right: -4px; width: 50%; display: inline-block;}
#sub-container .conts_05 ul li span img {vertical-align: top;}
#sub-container .conts_05 ul li .end_bg img {position: relative; z-index: -9; -webkit-filter: grayscale(100%); filter: gray;}
#sub-container .conts_05 ul li .text_area {vertical-align: top; width: 45%; padding-left: 5%;}
#sub-container .conts_05 ul li .text_area h4 {font-family: 'Roboto-Bold'; font-size: 2em; padding-bottom: 5%; background: url(../../images/txt_bar.jpg) no-repeat left bottom;}
#sub-container .conts_05 ul .cont_sec .text_area p {font-family: 'Roboto-Light'; font-size: 1.25em; margin-top: 5%; height: 8.5em; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 6; -webkit-box-orient: vertical; word-wrap: break-word; display: -webkit-box; text-align: left;}

#sub-container .conts_05 .cont_sec .thumb_img_area a { display: block;    width: 600px; height: 280px; overflow: hidden; }

#sub-container .media-mobile-view {display: none !important;}
#sub-container .media-tablet-view {display: none}










@media screen and (max-width: 1600px) {
	.header-wrap,
	.footer-wrap { padding: 0 3%; }

	#keyvisual .submenu-area ul { width: 50%; }
}





@media screen and (max-width: 1280px) {
	header .header-wrap .outside-link ul li a img { display: none; }
	header .header-wrap .gnb ul li a { font-size: 18px; }
	header .submenu-area ul { width: 80%; }
	header .submenu-area ul li a { font-size: 14px; }

	#container { width: auto; max-width: 1180px; padding: 80px 3% 60px 3%; }
	#container .main-content .text-area { width: 98%; }
	#container .main-content .text-area h3 { font-size: 20px; padding: 30px 0 15px; }
	#container .main-content .text-area div { font-size: 14px; }
	#container .main-content .img-area { width: 98%; }
	#container .main-content .text-area a { width: 130px; line-height: 30px; margin-top: 25px; font-size: 14px; }

	footer .footer-wrap .copyright { font-size: 14px; }
	footer .footer-wrap .copyright span { padding-right: 30px; }



	/* Sub Page */
	#keyvisual .submenu-area ul { width: 60%; }
	#keyvisual .submenu-area ul li a { font-size: 14px; }

	#container { width: auto; max-width: 1180px; padding: 80px 5% 60px 5%; }
	#container .main-content .text-area { width: 98%; }
	#container .main-content .text-area h3 { font-size: 20px; padding: 30px 0 15px; }
	#container .main-content .text-area div { font-size: 14px; }
	#container .main-content .img-area { width: 98%; }
	#container .main-content .text-area a { width: 130px; line-height: 30px; margin-top: 25px; font-size: 14px; }
	
	/* sub */
	#sub-container .conts .cont_title,
	#sub-container .conts .inner_conts {width: 92%; /*padding-left: 4%; padding-right: 4%;*/}
	#sub-container .conts .cont_title a {right: 4%}
        #sub-container .conts .inner_conts .thumb_area {height:13.5em;}
	#sub-container .conts .inner_conts .thumb_area .thumb_info_box h5 {font-size: 1em;}
	#sub-container .conts .inner_conts .thumb_area:hover img {transform: none; transition: none;}
        
        #sub-container .conts .inner_conts .thumb_area_list {height:11.25em;}

	#sub-container .cont_01_04 ul {margin-top: 4.5%;}
	#sub-container .cont_01_04 .inner_conts .cont_sec img {width: 100%;}
	#sub-container .cont_01_04 ul li:nth-of-type(1) {margin-left: 20%;}
	#sub-container .cont_01_04 ul li {width: 16%; padding: 2%;}
	#sub-container .cont_01_04 .inner_conts .cont_sec img {width: 80%;}

	#sub-container .conts .conts-tab {width: 92%;}

	/* #sub-container .conts_04 .inner_conts .board_title_wrap {font-size: 0.85em;} */
	#sub-container .conts_05 ul .cont_sec .text_area p { height: 5.5em; -webkit-line-clamp: 4;}

	#sub-container .conts_05 .cont_sec .thumb_img_area a { display: block;    width: 100%; height: 21.875vw; overflow: hidden; }


	footer .footer-wrap .copyright { font-size: 14px; }
	footer .footer-wrap .copyright span { padding-right: 30px; }
}





@media screen and (max-width: 1023px) {
	#wrap { /*padding-top: 60px;*/ }

	header { height: 60px; border-bottom: #D6DCE3 1px solid; box-sizing: border-box; }
	header .header-wrap { display: none; }
	header .header-mobile-wrap { display: block; }

	#keyvisual  { padding-top: 38px; }

	#container { margin: 0 auto; width: 94%; max-width: inherit; padding: 80px 0 60px 0; }
	#container .main-content { clear: both; width: 100%; }
	#container .main-content .img-area,
	#container .main-content .text-area { float: left; width: 48%; }
	#container .main-content .text-area h3 { padding-top: 10%; }

	#main-content-1 .img-area { margin-right: 4%; }
	#main-content-2 .text-area { margin-right: 4%; }
	#main-content-3 .img-area { margin-right: 4%; }

	#container .main-content .img-area img { max-width: inherit; width: 100%; }
	#container .main-content.hover .img-area img { -webkit-transform: scale(1);  -moz-transform: scale(1);  -ms-transform: scale(1);  -o-transform: scale(1);  transform: scale(1); }

	footer { height: inherit; padding: 20px 0; }
	footer .footer-wrap { display: none; }
	footer .footer-mobile-wrap { display: block; }
	footer .footer-mobile-wrap .logo-box { margin: 0 auto; width: 94%; padding-bottom: 10px; border-bottom: #5583BE 1px solid; }
	footer .footer-mobile-wrap .logo-box .footer-logo { float: left; width: 50%; }
	footer .footer-mobile-wrap .logo-box .phone { float: left; width: 50%; text-align: right; line-height: 31px; }
	footer .footer-mobile-wrap .logo-box .phone strong { font-family: 'Roboto-Medium'; }
	footer .footer-mobile-wrap .copyright { margin: 0 auto; width: 94%; padding-top: 10px; }
	footer .footer-mobile-wrap .copyright .address { text-align: center; font-size: 14px; }
	footer .footer-mobile-wrap strong { color: #FFFFFF; }



	/* Sub Page */
	#sub-container .conts {padding: 80px 0 80px;}
	#sub-container .cont_01_02, #sub-container .cont_01_03 {padding: 80px 0 0;}
	#sub-container .cont_01_05 {padding: 0 0 80px;}
        
        #sub-container .conts .cont_title h4 {font-size: 2.5em; line-height:95px;}
        #sub-container .cont_01_01 .cont_title p {font-size:1.25em; line-height:30px;}
        #sub-container .cont_01_01 ul li .cont_sec img {width:220px; height:220px; margin-right:40px;}
        #sub-container .conts .inner_conts .cont_sec h5 {margin: 0.5em 0; font-size:1.6em; line-height:1.2;}
        #sub-container .conts .inner_conts .cont_sec p {font-size:1.1em; line-height:24px; }
        
        #sub-container .conts .inner_conts .thumb_area {height:12em;}
	#sub-container .conts .inner_conts .thumb_area .thumb_info_box {font-size: 0.85em;}
	#sub-container .conts .inner_conts .thumb_area .thumb_info_box img {width: 15%; display: inline}
        
        #sub-container .conts .inner_conts .thumb_area_list {height:9.25em;}

	#sub-container .conts_05 ul li span {font-size: 0.9em;}
	#sub-container .conts_05 ul .cont_sec .text_area p { height: 5.5em; -webkit-line-clamp: 4;}

}

@media screen and (min-width:768px) and (max-width: 1000px) {
#sub-container .conts .inner_conts .thumb_area {height:10em;}
}

@media screen and (max-width: 781px) {
#sub-container .conts .inner_conts .thumb_area .thumb_info_box span {width:30%;}
}

@media screen and (max-width: 767px) {

	#container { padding: 60px 0 0 0; }
	#container .main-content { margin-bottom: 30px; }
	#container .main-content .img-area,
	#container .main-content .text-area { clear: both; width: 100%; height: inherit; }
	#container .main-content .text-area { padding: 5% 0; }
	#container .main-content .text-area h3 { padding-top: 0; }

	#main-content-1 .img-area { margin-right: 0; }
	#main-content-2 .text-area { margin-right: 0; }
	#main-content-3 .img-area { margin-right: 0; }

	#main-content-2 { display: none; }
	#main-content-2-mobile { display: block; }

	footer .footer-mobile-wrap .logo-box .phone { font-size: 14px; }
	footer .footer-mobile-wrap .copyright .address { font-size: 12px; }



	/* Sub Page */
	#sub-container .conts {padding: 60px 0 60px;}
	#sub-container .cont_01_02, #sub-container .cont_01_03 {padding: 60px 0 0;}
	#sub-container .cont_01_05 {padding: 0 0 60px;}
        
        #sub-container .conts .cont_title h4 {font-size:1.5em;}
        #sub-container .conts .cont_title p {font-size:1em;}
        #sub-container .cont_01_01 ul li:nth-of-type(1), #sub-container .cont_01_01 ul li:nth-of-type(2),
        #sub-container .cont_01_01 ul li:nth-of-type(3),#sub-container .cont_01_01 ul li:nth-of-type(4),
        #sub-container .cont_01_01 ul li:nth-of-type(5),#sub-container .cont_01_01 ul li:nth-of-type(6) {width:100%; padding-left:0; padding-right:0;}
        #sub-container .cont_01_01 ul li .cont_sec {text-align:center; margin-bottom: 2em; }
        #sub-container .cont_01_01 ul li .cont_sec img {display: block; float:none; width:176px; height: 176px;margin: 0 auto;  }
        #sub-container .cont_01_01 ul li .cont_sec h5 {font-size:1.375em;}
        #sub-container .cont_01_01 ul li .cont_sec p {font-size:1em;}
        
        
	.sub-visual {font-size: 0.7em;}
	#sub-container {font-size: 0.9em;}
	#sub-container .cont_01_02 ul li,
	#sub-container .cont_01_03 ul li, 
	#sub-container .cont_01_05 ul li {width: 35%; margin-right: 0}
/*
	#sub-container .cont_01_02 ul li:nth-of-type(1),
	#sub-container .cont_01_02 ul li:nth-of-type(3),
	#sub-container .cont_01_03 ul li:nth-of-type(1),
	#sub-container .cont_01_03 ul li:nth-of-type(3),
	#sub-container .cont_01_05 ul li:nth-of-type(1),
	#sub-container .cont_01_05 ul li:nth-of-type(3) {padding-left: 13%; padding-right: 1.5%;}

	#sub-container .cont_01_02 ul li:nth-of-type(2),
	#sub-container .cont_01_02 ul li:nth-of-type(4),
	#sub-container .cont_01_03 ul li:nth-of-type(2),
	#sub-container .cont_01_03 ul li:nth-of-type(4),
	#sub-container .cont_01_05 ul li:nth-of-type(2),
	#sub-container .cont_01_05 ul li:nth-of-type(4) {padding-right: 13%; padding-left: 1.5%;}

	#sub-container .cont_01_02 ul li:nth-of-type(1),
	#sub-container .cont_01_02 ul li:nth-of-type(2),
	#sub-container .cont_01_03 ul li:nth-of-type(1),
	#sub-container .cont_01_03 ul li:nth-of-type(2),
	#sub-container .cont_01_05 ul li:nth-of-type(1),
	#sub-container .cont_01_05 ul li:nth-of-type(2) {margin-bottom: 3%;} 

	#sub-container .cont_01_01 ul li {width: 30%; padding: 0;}
	#sub-container .cont_01_01 ul li:nth-of-type(1),
	#sub-container .cont_01_01 ul li:nth-of-type(3) {padding-left: 15%; padding-right: 5%;}
	#sub-container .cont_01_01 ul li:nth-of-type(2),
	#sub-container .cont_01_01 ul li:nth-of-type(4) {padding-right: 15%; padding-left: 5%;}
	#sub-container .cont_01_01 ul li:nth-of-type(1),
	#sub-container .cont_01_01 ul li:nth-of-type(2) {margin-bottom: 5%;}
*/


	#sub-container .cont_01_04 .inner_conts .cont_sec h5 {font-size: 0.875em;}
	#sub-container .cont_01_04 ul {margin-top: 7%;}
	#sub-container .cont_01_04 ul li {width: 28%}
	#sub-container .cont_01_04 ul li:nth-of-type(1) {margin-left:0 }
	#sub-container .cont_01_04 ul li:nth-of-type(1),
	#sub-container .cont_01_04 ul li:nth-of-type(2) {margin-right: 2%;}

	#sub-container .conts_02 ul li {width: 48.5%; margin-right: 3%; margin-bottom: 3%}
	#sub-container .conts_02 ul li:nth-of-type(3) {margin-right: 3%;} 
	#sub-container .conts_02 ul li:nth-of-type(2),
	#sub-container .conts_02 ul li:nth-of-type(4),
	#sub-container .conts_02 ul li:nth-of-type(6) {margin-right: 0;}

	#sub-container .conts_03 .inner_conts .btn_wrap a {width: 5%;}
	
	#sub-container .conts .cont_title a {font-size: 0.8em; padding-right: 10px;}
	#sub-container .conts .cont_title a .right_arrow {bottom: 6px;}
	#sub-container .conts .cont_title a .right_top_arrow,
	#sub-container .conts .cont_title a .right_bottom_arrow {width: 7px;}
	#sub-container .conts .cont_title a .right_top_arrow {margin-bottom: 3px;}

	#sub-container .media-tablet-view {display: block;}
	#sub-container .media-desktop-view {display: none;}
        
        #sub-container .conts .inner_conts .thumb_area {height:12.56em;}
        
        
	#sub-container .cont_03_01 .inner_conts ul {padding: 0 8%;}
	#sub-container .cont_03_01 .inner_conts ul li {width: 49.15%}
	#sub-container .conts_03 .inner_conts .btn_wrap a {width: 4.87%;}

	#sub-container .cont_03_02 .inner_conts ul li {width: 48.5%; margin-right: 3%; margin-bottom: 3%;}
	#sub-container .cont_03_02 .inner_conts ul li:nth-of-type(2),
	#sub-container .cont_03_02 .inner_conts ul li:nth-of-type(4),
	#sub-container .cont_03_02 .inner_conts ul li:nth-of-type(6) {margin-right: 0;}

	#sub-container .conts .paging .prev_page { margin-right: 10px;}
	#sub-container .conts .paging .next_page { margin-left: 10px;}

	#sub-container .conts_04 .inner_conts .board_title_wrap {border-top: 0; padding: 0;}
	#sub-container .conts_04 .inner_conts .board_title_wrap h4 {float: none; width: 100%; line-height: 2; text-align: center;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info {float: none; width: 100%; text-align: left; border-top: 1px solid #e6e6e6; padding: 15px 0; font-size: 1em;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info span {display: inline-block; margin-right: -4px;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_like {border-right: 0; padding-right: 0; width: 25%;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_like img {width: initial;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_date {width: 40%; margin-right: 0; padding-left: 0; text-align: center;}
	#sub-container .conts_04 .inner_conts .board_title_wrap .board_info .board_count {width: 35%; text-align: right;}
        #sub-container .conts_04 .inner_conts .sns_icon ul li.whatsapp {display: block;}

	#sub-container .conts_05 ul li span {font-size: 1em;}
	#sub-container .conts_05 ul .cont_sec .text_area p { /*height: 4em; -webkit-line-clamp: 3; */margin-top: 2.5%;}

	#sub-container .conts_05 ul li span {margin-right: 0; width: 100%; display: block;}
	#sub-container .conts_05 ul li span img {width: 100%;}
	#sub-container .conts_05 ul li .text_area {width: 100%; padding-left: 0; margin: 2.5% 0 5%;}
	#sub-container .conts_05 ul li .text_area h4 {padding-bottom: 2.5%;}


	#sub-container .conts_05 .cont_sec .thumb_img_area a, #sub-container .conts_05 .cont_sec .end_bg a { display: block;    width: 100%; height: 36.50586701434159vw; overflow: hidden; }
}





@media screen and (max-width: 640px) {
    
        #sub-container .conts .inner_conts .thumb_area {height:10.5em;}
    
	#sub-container .conts .cont_title h4 {padding: 0;}
	#sub-container .conts .cont_title a {position: relative; right: 0; text-align: right}
}

@media screen and (max-width: 480px) {
	#sub-container .conts {padding: 40px 0 40px;}
	#sub-container .conts .inner_conts {font-size: 0.9em;}
	#sub-container .conts .cont_title h4 { font-size: 2em;}
	#sub-container .cont_01_02, #sub-container .cont_01_03 {padding: 40px 0 0;}
	#sub-container .cont_01_05 {padding: 0 0 40px;}
	#sub-container .conts .conts-tab {margin-bottom: 4%}
	
	.sub-visual {font-size: 0.55em;}
	#sub-container {font-size: 0.8em;}

	#sub-container .conts_04 .inner_conts .board_btn {text-align: center;}
	#sub-container .conts_04 .inner_conts .board_btn a {width: 150px; line-height: 45px;}

	#sub-container .conts .conts-tab a {font-size: 1em}
}

@media screen and (max-width: 360px) {
	#sub-container .media-desktop-view {display: none;}
	#sub-container .media-tablet-view {display: none;}
	#sub-container .media-mobile-view {display: block !important;}

	#sub-container .conts_03 .inner_conts .btn_wrap {display: none;}
	#sub-container .cont_03_01 .inner_conts ul {padding: 0;}
	#sub-container .cont_03_01 .inner_conts .conts-slide .slick-dots {bottom: -25px;}
	#sub-container .cont_03_01 .inner_conts .conts-slide .slick-dots li {width: 20px; float: none}
	#sub-container .cont_03_01 .inner_conts .conts-slide .slick-dots li button {}
	#sub-container .cont_03_01 .inner_conts .conts-slide .slick-dots li.slick-active button:before {color: #000;}
	#sub-container .cont_03_01 .inner_conts .conts-slide .slick-dots li button:before {color: #000;}
	#sub-container .cont_03_01 ul li {margin-right: 0;}

        #sub-container .conts .inner_conts .thumb_area {height:10em;}
	#sub-container .cont_03_01 .inner_conts .thumb_area .thumb_info_box {font-size: 1.2em;}
	#sub-container .conts .inner_conts .thumb_area .thumb_info_box span img {display: inline}

	#sub-container .conts_04 .inner_conts .sns_icon ul li { text-align: right; margin-left: 0}
	#sub-container .conts_04 .inner_conts .sns_icon ul li img {width: 70%;}
}