@charset "UTF-8";
/* Font */
@import url(font.css);
/* Guide
----------------------------------------------------------------------------------------------------------------------------------------------------------

▶사이즈
pc : 1200px
tablet : 980px ~
mobile : 767px ~ 320px

▶미디어쿼리는 (주석으로 구분 되어있는)파트마다 각각 작성함.
*/
/* Reset
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, li, ol, p, pre, select, td, textarea, textarea, th, ul {margin: 0; padding: 0; font-family: "NotoSansKR", sans-serif;}
dl, li, menu, ol, ul {list-style: none; color: #666;}
body {font-family: "NotoSansKR", sans-serif; font-size: 14px; letter-spacing: -1px; font-weight: normal; color: #666;}

*, *:after, *:before {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

:focus {outline: 0 !important;}
iframe {border: none; width: 100%;}
a {
	font-family: "NotoSansKR", sans-serif;
	color: inherit;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
a:active, a:focus, a:hover {text-decoration: none !important; color: #7b1818;}
img {max-width: 100%;}
textarea {max-width: 100%; resize: none;}
.hidden {font-size: 0; line-height: 0; text-indent: -9999em; overflow: hidden;}

@media only screen and (min-width: 320px) {
	body {overflow-x: hidden;}
}
/* Parallax
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.parallax {background-position: 0 0; background-repeat: no-repeat; background-size: 100% auto; width: 100%; background-size: cover; background-attachment: fixed;}
/* Preloader
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.animationload {position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: #fff; z-index: 999999;}
.loader {width: 200px; height: 200px; font-size: 24px; text-align: center; position: absolute; left: 50%; top: 50%; background-image: url("/images/basic_resp/img/preloader.gif"); background-repeat: no-repeat; background-position:center; margin: -100px 0 0 -100px;}
/* Back to top (탑 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.back-to-top {
	width: 60px;
	height: 60px;
	position: fixed;
	bottom: 40px;
	right: 40px;
	display: none;
	text-align: center;
	z-index: 10000;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	background: url(/images/kor05r-18-0411/common/btn_go_top.png) #f6f6f6 no-repeat center;
	box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.35);
	font-size: 0;
}
.back-to-top i {color: #fff; font-size: 15px; display: block; line-height: 33px;}

@media only screen and (max-width: 767px) {
	.back-to-top {width: 50px; height: 50px; right: 20px;}
}
/* Layoyt (레이아웃)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#wrapper {min-width: 1200px; overflow-x: hidden;}
#header {position: absolute; top: 30px; z-index: 1000; width: 100%;}
#header:after {content: ""; position: absolute; top: 0; width: 100%; height: 60px; background: #3F3F3F;}
#header > .header_in {z-index: 1; position: relative; top: 0; padding: 0; margin: 0 auto; max-width: 1200px; width:100%; height: 60px; box-sizing: border-box;}
#L_SITE_LOGO {position: absolute; width: 178px; height: 60px;}
#L_SITE_LOGO h1 {position: relative; display: table; height: 100%; font-size: 0;}
#L_SITE_LOGO h1 a {display: table-cell; vertical-align: middle;}
#L_SITE_LOGO h1 a > img{vertical-align: baseline; height: 32px}
		
@media only screen and (max-width: 1200px) {
	#wrapper {min-width: 320px;}
	#header > div {width: 100%;}
	#L_SITE_LOGO {padding: 0 20px;}
}
@media only screen and (max-width: 980px) {
	#header {position: relative; top: 0;}
	#header:after {height: 48px;}
	#header > div {height: 48px;}
	#header > .header_in {height: 48px;}
	#header > .header_in h1 {line-height: 48px;}
	#L_SITE_LOGO {text-align: left; margin-top: 0; height: 48px;}
	#L_SITE_LOGO a {display: inline-block; line-height: 48px;}
	#L_SITE_LOGO h1 a > img{height: 30px; margin-top: 9px;}
	#L_SITE_LOGO img {width: auto;}
}
@media only screen and (max-width: 767px) {
	#header > div {padding: 0 10px; height: 50px;}
	#L_SITE_LOGO a {line-height: 48px;}
}
/* Login (로그인 메뉴)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.login_box {position: absolute; top: -30px; right: 0; height: 30px; line-height: 30px; text-align: center;}
.login-menu {max-width: 1228px; position: relative; margin: 0 auto;}
.login-menu li a {font-weight: 600; color: #fff;}
.login-menu li:first-child:after {display: none;}

@media only screen and (min-width: 980px) {
	.login-menu ul {text-align: right; line-height: 0; font-size: 0;}
	.login-menu li {position: relative; display: inline-block; padding: 0 20px; line-height: 30px; font-size: 12px;}
	.login-menu li:after {content: ""; position: absolute; top: 10px; left: -2px; width: 1px; height: 11px; background-color: #fff;}
	.login-menu li:after:last-child {display: none;}
	.login-menu li:after:first-child(3) {display: none;}
}
@media only screen and (max-width: 980px) {
	#header > .login_box {display: none;}
	.login-menu {position: relative; top: 0; right: 0;}
	.login-menu ul {margin: 0; padding: 20px 15px; text-align: center; background-color: #f7f7f7;}
	.login-menu ul:after {content: ""; display: block; clear: both;}
	.login-menu li {float: left; margin-left: 15px; width: calc(33.33% - 10px);}
	.login-menu li:first-child {margin-left: 0;}
	.login-menu li a {display: block; text-align: center; width: 100%; line-height: 30px; font-size: 13px; border: 1px solid #aaa; box-sizing: border-box; background-color: #000;}
}
/* Navigation (상단 메뉴)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#menuArea {display: inline-block; margin-left: 298px;}
#gnb {z-index: 999;}
.gnb-bg, .m-menu-close, .m-menu-open {display: none;}
.sub-menu {display: none;}
.navigation .menu-item > a {display: block; font-weight: 700; color: #fff; letter-spacing: 0;}
.navigation .menu-item {position: relative; float: left; display: inline-block; width: 25%;}
.navigation .menu-item:first-child {margin-left: 0;}
.navigation .menu-item:hover {background: #817D7C;}
.sns_box {position: absolute; top: 0; right: 30px; height: 100%; padding: 15px 0;}
.sns_box li {display: inline; float: left; margin-left: 10px;}
.sns_box li:first-child {margin-left: 0;}
.sns_box li a {display: block;}

@media only screen and (min-width: 980px) {
	#menuArea {width: 696px;}
	#gnb .login-menu {display: none;}
	.navigation {margin-top: 0; text-align: center; line-height: 60px;}
	.navigation .menu-item > a {line-height: 60px; font-size: 20px;}
	.sub-menu {z-index: 999; position: absolute; top: 60px; left: 0; min-width: 200px;}
	.sub-menu li {text-align: center; line-height: 64px;}
	.sub-menu li:first-child {border-top: 0;}
	.sub-menu li a {position: relative; display: block; padding: 0 15px 0 42px; width: 100%; box-sizing: border-box; text-align: left; line-height: 64px; font-size: 14px; color: #fff; background: #817D7C;}
	.sub-menu li a:active, .sub-menu li a:hover {background: #675f5d;}
}
@media only screen and (max-width: 1200px) {
	#menuArea {margin-left: 264px;}
	#gnb .login-menu {display: none;}
	.sub-menu ul {margin: 0 auto; width: 100%;}
	.navigation .menu-item:hover {background-color: #fff;}
}
@media only screen and (max-width: 980px) {
	#menuArea {margin-left: 170px;}
	#gnb {display: none; position: fixed; top: 0; right: 0; padding: 48px 48px 0; width: 100%; height: 100%; box-sizing: border-box; background: #fff;}
	#gnb .login-menu {display: block; border-top: 1px solid #eee;}
	.m-menu-open {display: block; position: absolute; top: 0; right: 10px; padding: 15px 10px; width: 48px; height: 48px; cursor: pointer;}
	.m-menu-open span {display: block; margin-top: 6px; width: 100%; height: 2px; background: #fff;}
	.m-menu-open span:first-child {margin-top: 0;}
	.m-menu-close {z-index: 1000; display: block; position: absolute; top: 0; right: 10px; width: 48px; height: 48px; cursor: pointer; padding: 15px 11px;}
	.m-menu-close span {position: relative; top: 7px; left: 0; display: block; width: 25px; height: 2px; background: #000; transform:rotate(45deg);}
	.m-menu-close span:first-child {transform: rotate(-45deg); top: 9px;}
	.navigation {border-top: 1px solid #eee;}
	.navigation .menu-item {position: relative; display: block; margin-left: 0; padding: 0; text-align: left; float: none; width: 100%;}
	.navigation .menu-item > a {padding: 0 15px; width: 100%; line-height: 50px; font-size: 17px; transition: none; border-bottom: 1px solid #eee; color: #333;}
	.sub-menu {width: 100%; background: #f7f7f7;}
	.sub-menu li {border-bottom: 1px solid #eee;}
	.sub-menu li a {display: block; padding: 0 20px; line-height: 40px; font-size: 13px; color: #333;}
	.sub-menu li a:before {display: inline-block; content: ""; position: relative; top: -4px; margin-right: 7px; width:
	5px; height: 1px; background: #fff;}
	.gnb-bg {z-index: 888; display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5);}
	.sns_box {position: relative; right: 0; padding: 10px 15px; height: 51px; border-bottom: 1px solid #eee;}
	.sns_box li a {background-color: #fff; border-radius: 50px; border: 1px solid #eee;}
}
@media only screen and (max-width: 767px) {
	#gnb {padding: 48px 0 0;}
	.login-menu li a {font-weight: 400;}
	.navigation .menu-item > a {font-weight: 400;}
}
/* Button (공통 버튼)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.btn {font-family: "NotoSansKR", sans-serif; text-transform: uppercase; border-radius: 0; line-height: 24px;}
.btn:active, .btn:focus {outline: none; color: #fff;}
.btn-custom {
	border-radius: 3px;
	padding: 0.8em 1.8em;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	text-transform: uppercase;
	background-color: #3d427c;
	border-color: #3d427c;
	color: #fff;
}
.btn-custom:focus, .btn-custom:hover {background-color: #36384e; border-color: #36384e; color: #fff;}
.btn-custom-outline {
	border-radius: 3px;
	padding: 0.8em 1.8em;
	color: #fff;
	-webkit-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
	text-transform: uppercase;
	background-color: transparent;
	border-color: #fff;
}
.btn-custom-outline:focus, .btn-custom-outline:hover {color: #fff; background-color: rgba(255, 255, 255, 0.5);}
.btn-bar a {margin-right: 10px;}
.form-control {box-shadow: none; -webkit-box-shadow: none; border-radius: 3px; height: 38px;}
.form-control:focus {
	outline: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	border-color: #ab7763;
}

/* Footer (하단메시지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#footer {width: 100%; background-color: #e7e7e7; padding: 60px 0;}
.footer-area {display: flex; flex-wrap: wrap; gap: 20px 30px; position: relative; margin: 0 auto; max-width: 1200px; width: 100%; box-sizing: border-box;}
.footer-area p.footer-logo {position: relative; width: 131px;}
.footer-content {width: calc(100% - 161px); position: relative; display: inline-block; padding-left: 30px;}
.footer-content:before {content: ""; width: 1px; height: 100%; position: absolute; top: 0; left: 0; background-color:#bebbbb;}
#footer p {font-size: 14px; letter-spacing: 0; color: #888; line-height: 28px;}
.footer-menu {margin-bottom: 20px;}
.footer-menu li {position: relative; display: inline-block; line-height: 20px;}
.footer-menu li:first-child {margin-left: 0; padding-left: 0; border-left: 0;}
.footer-menu li:before {content: ""; position: relative; display: inline-block; width: 2px; height: 14px; background:#bebbbb; margin: 0 10px 0 13px; top: 2px;}
.footer-menu li:first-child:before {display: none;}
.footer-menu li a {line-height: 10px; font-size: 14px; color: #545454; font-family: "NotoSansKR", sans-serif; font-weight: 700;}
.footer-info {line-height: 20px;}
.footer-info li {padding-top: 12px; color: #888;}
.footer-info li:first-child {padding-top: 0;}
.footer-info li a {color: #7b1818;}
.footer-info li.footer-copy a {color: inherit;}
.footer-info span {color: #888;}
.footer-info span.footer-logo {display: inline-block; margin-bottom: 17px;}

@media only screen and (max-width: 1200px) {
	.footer-area {width: 100%;}
}
@media only screen and (max-width: 980px) {
	.footer-area {padding: 0 20px; box-sizing: border-box;}
}
@media only screen and (max-width: 767px) {
	.footer-area {padding: 0 15px;}
	.footer-content {padding-left: 0; width: 100%;}
	p.footer-logo {display: block; width: 100%;}
	.footer-content:before {display: none;}
	.footer-menu {margin-bottom: 10px;}
	.footer-menu li {margin-left: 5px; padding-left: 5px;}
	.footer-menu li:before {margin: 0 5px 0 -4px;}
	.footer-menu li a {font-size: 12px;}
	.footer-info {font-size: 12px !important; line-height: 11px; letter-spacing: -1px !important;}
	.footer-info li {padding-top: 5px; line-height: 1.4;}
}
/* Main Visual (메인이미지)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.carousel-inner > .item {height: 800px;}
.carousel-inner > .item.main-img01 {background: url("/images/kor05r-18-0411/main/main_visual1.png") no-repeat center center/cover;}
.carousel-inner > .item.main-img02 {background: url("/images/kor05r-18-0411/main/main_visual2.png") no-repeat 85% center/cover;}
		
.main-visual .carousel-caption {
	top: 45%;
	left: 0;
	right: auto;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: left;
	text-shadow: none;
	width: 100%;
}
.main-visual .carousel-caption .slogan {display: block; color: #fff; width: 100%; max-width: 1200px; margin: 0 auto;}
.main-visual .carousel-caption p {display: block; font-size: 48px; white-space: pre-line; line-height: 1.2;}
.main-visual .carousel-caption strong {font-size: 70px; line-height: 70px; display: block; letter-spacing: 2px;}
.main-visual .carousel-caption span {display: block; font-size: 16px; font-weight: 400; font-family: "NotoSansKR"; line-height: 24px; letter-spacing: 0;}
.main-visual .carousel-control {background: none; text-shadow: none;}
.main-visual .carousel-control, .main-visual .carousel-control:focus, .main-visual .carousel-control:hover {opacity: 1;}
.carousel-control .glyphicon-chevron-right, .carousel-control .icon-next {width: 85px; height: 85px; right: 20%;}
.carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev {width: 85px; height: 85px; left: 20%;}
.main-visual .glyphicon-chevron-left:before, .main-visual .glyphicon-chevron-right:before {content: ""; display: block; width: 85px; height: 85px; border: 1px solid #fff;}
.main-visual .glyphicon-chevron-left:before {background: url("/images/kor05r-18-0411/main/prev_btn.png") no-repeat center center;}
.main-visual .glyphicon-chevron-right:before {background: url("/images/kor05r-18-0411/main/next_btn.png") no-repeat center center;}
.carousel-indicators {bottom: 17%;}
.carousel-indicators li {margin: 5px; width: 15px; height: 15px; background: none; border: 0; border: 3px solid #fff; border-radius: 0;}
.carousel-indicators .active {margin: 5px; width: 30px; height: 15px; background: #fff; box-sizing: border-box;}
.main-img01 .img_objt {position: absolute; right: 0; bottom: 0; width: 100%; text-align: right;}
.main-img01 .img_objt p {max-width: 1200px; margin: 0 auto;}
.main-visual .carousel-caption .slogan a {border: 2px solid #fff; font-size: 18px; padding: 0 41px; height: 50px; line-height: 50px; display: inline-block; margin-top: 50px;}
.main-visual .carousel-caption .slogan a:hover {background-color: #fff; color: #7b1818;}

/* slide list 두 번째 */
.img_objt.bg_full {position: absolute; display: table; width: 100%; height: 100%; background-color: #6a0303;}
.img_objt.bg_full .txt_lg {display: table-cell; vertical-align: middle; text-align: center;}
.img_objt.bg_full .txt_lg dt {font-size: 160px; line-height: 108px; color: #fff;}
.img_objt.bg_full .txt_lg span {display: block; font-size: 30px;}
.img_objt.bg_full .txt_lg dd a {display: inline; margin-left: 26px; font-size: 24px; color: #fff;}
.img_objt.bg_full .txt_lg dd a:first-child {margin-left: 0;}
@media screen and (max-width: 1200px) {
	.main-visual .carousel-caption {padding: 0 20px;}
	.main-visual .carousel-caption p {font-size: 40px;}
	.footer-area {padding: 0 20px;} 
	.carousel-control {display: none;}
}
@media screen and (min-width: 980px) {
	.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right,
	.carousel-control .icon-next, .carousel-control .icon-prev {margin-top: -42.5px;}
}
@media screen and (max-width: 980px) {
	.carousel-inner > .item {height: 680px;}
	.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev{width: 60px; height: 60px;}
	.carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next, .carousel-control .icon-prev{margin-top: -30px;}
	.main-visual .glyphicon-chevron-left:before, .main-visual .glyphicon-chevron-right:before {width: 60px; height: 60px;
	background-size: 16px;}
	.main-visual .carousel-caption {padding: 0 20px;}
	.main-visual .carousel-caption p {font-size: 40px;}
	.main-img01 .img_objt {width: 50%;}
}
@media screen and (max-width: 767px) {
	.carousel-inner > .item {height: 320px;}
	.carousel-inner > .item.main-img02{background-position: 89%;}
	
	.carousel-indicators {bottom: 30px;}
	.main-visual .carousel-caption p {font-size: 24px; line-height: 1.4;}
	.main-visual .carousel-caption strong {font-size: 60px; line-height: 60px;}
	.main-visual .carousel-caption span {font-size: 13px; line-height: 21px; letter-spacing: -1px;}
	.main-visual .glyphicon-chevron-left:before, .main-visual .glyphicon-chevron-right:before {width: 40px; height: 40px; background-size: 12px;}
	.main-visual .carousel-caption .slogan a {font-size: 14px; padding: 0 15px; height: 30px; line-height: 27px; margin-top: 15px;}
	
	.img_objt.bg_full .txt_lg dt {font-size: 80px; line-height: 70px;}
	.img_objt.bg_full .txt_lg span {font-size: 25px;}
	.img_objt.bg_full .txt_lg dd a {margin-left: 5px; font-size: 16px;}
}
/* Main Contents (메인 컨텐츠)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.main-contents {background: #fff;}
.main-contents h2 {position: relative; background-color: #fff; display: block; margin: 50px auto; width: 100%; max-width: 1200px; color: #111; font-size: 24px; font-weight: 800; text-align: center;}
.main-contents h2 span {position: relative; padding: 0 27px; background-color: #fff; z-index: 2;}
.main-contents h2:after {content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background-color: #111;}
.main-contents .content-area {position: relative; display: block; width: 100%; padding: 0; margin: 0 auto;}
.main-contents .content-area:after {content: ""; display: block; clear: both;}
.main-contents .content-area .main_banner {padding: 0; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out;}
.main-contents .txt-area {position: relative; padding: 35px 50px 0 18px;}
.main-contents .txt-area:before {position: absolute; top: 0; left: 0; content: ""; display: block; width: 110px; height: 5px; background: #3d427c;}
.main-contents .txt-area p {line-height: 1.7; font-size: 20px; color: #2b2b2b;}
.main-contents .txt-area p:nth-of-type(2) {margin-top: 20px; font-size: 17px; color: #929292;}
.main-contents .txt-area .btn-more {position: absolute; bottom: 5px; right: 50px; display: inline-block; padding: 0 15px; width: 160px; height: 47px; line-height: 47px; font-size: 15px; color: #fff; background: #3d427c; border: 1px solid #3d427c;}
.main-contents .txt-area .btn-more span {float: right; font-size: 20px;}
.main-contents .txt-area .btn-more:hover, .txt-area .btn-more:active {color: #3d427c; background: none;}

@media screen and (max-width: 1200px) {
	.main-contents .content-area {width: 100%;} /*padding:0 30px;*/
	.main-contents .content-area {width: 100%;}
}
@media screen and (max-width: 980px) {
	.main-contents .content-area {display: block; margin: 0 auto;}/*padding:0 20px;*/
}
@media screen and (max-width: 767px) {
	.main-contents {padding-bottom: 0;}
	.main-contents .content-area {top: 0;} /*padding:30px;*/
	.main-contents .content-area > div {display: block; width: 100%;}
	.main-contents .content-area .main_banner {display: inline-block; height: inherit; margin-top: 0; padding: 10px 0!important;}
	.main-contents .content-area .main_banner:first-child {margin-top: 0; margin-bottom: 0;}
	.main-contents .txt-area {margin-bottom: 15px; padding: 20px; text-align: center; border: 1px solid #9194bf;}
	.main-contents .txt-area:before {position: static; margin: 0 auto 20px; width: 15px; height: 15px; transform: rotate(45deg);}
	.main-contents .txt-area p {line-height: 1.5; font-size: 16px;}
	.main-contents .txt-area p:nth-of-type(2) {margin: 15px 0; font-size: 15px;}
	.main-contents .txt-area .btn-more {position: static; bottom: 0; right: 0; display: block; width: 100%; text-align: center;}
}
/* Main Contents 배너 (메인 컨텐츠 배너)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
.main-contents .gallery-list {height: 250px;}
.main-contents .main_banner a.btn_main_product {font-size: 18px; font-weight: normal; background-color: #111; height: 50px; display: block; line-height: 50px; color: #fff; padding: 0; margin: 0 auto; width: 200px; text-align: center;}
.main_banner.bn_1 {margin: 0 auto 60px; max-width: 1200px;}
.main_banner.bn_2 {padding: 60px 0 !important; width: 100%; background-color: #f5f5f5;}
.main_banner.bn_2 .bn_in {margin: 0 auto; max-width: 1200px; width: 100%; height: 240px;}
.main_banner .main_quick {display: table; margin-right: 40px; padding: 0; max-width: 580px; min-height: 240px; background-color: #3f3f3f;}
.main_banner .main_quick a {display: table-cell; vertical-align: middle; text-align: center;}
.main_banner .main_quick a span {display: inline-block; width: 100%; font-size: 30px; font-weight: bold; color: #fff; line-height: 1; margin-bottom: 15px;}	 
.main_banner .main_quick a > img{width: 40%;}
.main_banner .main_board {padding: 40px; max-width: 580px; min-height: 240px; background-color: #fff;}
.main_banner .main_board h5 {margin-bottom: 28px; font-size: 20px; font-weight: 700; color: #111; line-height: 1;}
.main_banner .main_board .extract-title {font-size: 16px; color: #333;}
.main_banner .main_board .extract-article {padding: 12px 0 0 0; border: none;}
.main_banner .main_board .extract-article:first-child {padding-top: 0;}
.main_banner .main_board .extract-article .extract-content {line-height: 16px;}
		
@media screen and (max-width: 1200px) {
	.main-contents .content-area {width: 100%;}/*padding:0 30px;*/
	.main-contents .content-area {width: 100%;}
	.main_banner .main_quick {margin-right: 0; padding: 0; max-width: inherit;}
	.main_banner .main_board {max-width: inherit;}
}
@media screen and (max-width: 980px) {
	.main_banner .main_quick {margin: 0 0 30px 0; padding: 0; max-width: inherit; min-height: inherit;}
	.main_banner .main_quick a {display: table-cell; vertical-align: middle; text-align: center; padding: 80px 0;}
	.main_banner .main_board {max-width: inherit; min-height: inherit;}
	.main_banner.bn_2 .bn_in {display: inline-block; height: auto;}
}
@media screen and (max-width: 767px) {
	#gallery-sub3_1 .viewport:hover:before {display: none;}
	.main-contents .main_banner a.btn_main_product {margin: 20px 0; background-color: #aaa; width: 100%; height: 40px; line-height: 40px;}
	.main_banner .main_quick {margin: 0 0 10px 0;}
	.main_banner .main_quick a {padding: 50px 0;}
	.main_banner .main_quick a span {font-size: 22px;}
	.main_banner .main_board {padding: 30px 20px;}
	.main_banner .main_board .extract-title {font-size: 14px;}
}
/* Main Contents 배너 (사용자 갤러리)
---------------------------------------------------------------------------------------------------------------------------------------------------------- */
#gallery-sub3_1 {font-size: 17px; font-weight: normal; color: #333;}
#gallery-sub3_1 .gallery_title {display: none;}
#gallery-sub3_1 .gallery-list {height: 300px !important;}
#gallery-sub3_1 .img-frame {height: 250px; background-color: #fff;}
#gallery-sub3_1 .owl-stage-outer {height: 300px !important; background: #fff !important;}
#gallery-sub3_1 .owl-controls {display: none;}
#gallery-sub3_1 .viewport:before {display: none; content: ""; position: absolute; top: 0; left: 0; width: 100%; height:100%; border: 4px solid #7b1818; z-index: 1;}
#gallery-sub3_1 .viewport:hover:before {display: block;}
		
@media screen and (max-width: 767px) {
	#gallery-sub3_1 .img-title {font-size: 14px;}
}