@charset "utf-8";
@import url('reset.css');
/*@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900|Work+Sans:300,400,500,600,700,900|Roboto:300,400,500&display=swap');*/
html, body {overflow-x: hidden; min-width: 320px;}

/*image100*/
.width100{width:100%}
/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:14px; font-weight:bold; color:#fff; line-height:1; text-align:center; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {margin-top:0; height:auto; padding:10px 0px}

/* common */
#wrap{width:100%;max-width:1920px;margin:0 auto;}
.brmobile2{display:block}
.mobile{display:none}
#container{width:100%;overflow:hidden}

/* header */
.logo_w{position:fixed;top:5%;left:4%;z-index:999}
.vol{position:fixed;top:55%;left:3%;/*writing-mode: vertical-lr;*/transform-origin:left top 0px; transform: translateY(-100%) rotate(-90deg) translateY(100%);font-family: 'Roboto', sans-serif;color:#fff;font-size:12px;font-weight:300;letter-spacing:0.1em;z-index:999}
.vol span{font-family: 'Noto Sans KR', sans-serif;font-weight:300;font-size:12px;letter-spacing:0.1em;}
/* menu */
.btn_side {position:fixed; top:5%; right:4%; z-index:9999;color:#8a5c47;background:#fff;font-family: 'Work Sans', sans-serif;padding:18px 32px 18px 10px;letter-spacing:0.2em;font-size:18px;font-weight:300;line-height:100%}
#side {display:none; z-index:9999; width:350px; right:-350px; height:100%; position:fixed; background:#fff}
#mask {position:absolute; z-index:999; background:rgba(0,0,0,0.8) 0 0; display:none; left:0; top:0; width:100%; height:100%; overflow:hidden}
.close {display:none; position:absolute; top:50px; left:30px; width:35px; height:33px; background-image:url('../../../images/btn_close.png'); background-position:0 0;background-size:35px 33px;text-indent:-9999px; opacity:1}
.gnb {margin-top:40%; padding-left:20%;height:100%; }
.gnb > li {font-size:20px; font-weight:normal; margin-bottom:10%;font-weight:500;}
.gnb > li > a {color:#404040}
.gnb > li > a:hover {color:#964b9e/*monthly*/}

/*콘텐츠*/

/*제목 한줄*/
.main_con01{position:relative;padding:0; margin:0;height:100%;max-height:936px}
.main_con01 h2{width:100%; text-align:center; position:absolute; top:5%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:500;font-size:19px;letter-spacing:0.1em;}
.main_con01 h3{width:100%; text-align:center; position:absolute; top:47%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:400;font-size:14px;letter-spacing:0.25em;}
.main_con01 h4{width:100%; text-align:center; position:absolute; top:50%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:300;font-size:60px}
.main_con01 h4 span{font-weight:500}
.more_btn{width:100%; text-align:center; position:absolute; top:63%;}

/*제목 두줄*/
.main_con02{position:relative;padding:0; margin:0;height:100%;max-height:936px}
.main_con02 h2{width:100%; text-align:center; position:absolute; top:5%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:500;font-size:19px;letter-spacing:0.1em;}
.main_con02 h3{width:100%; text-align:center; position:absolute; top:32%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:400;font-size:14px;letter-spacing:0.25em;}
.main_con02 h4{width:100%; text-align:center; position:absolute; top:36%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:300;font-size:60px;line-height:140%}
.main_con02 h4 span{font-weight:700}
.more2_btn{width:100%; text-align:center; position:absolute; top:66%;}

.more_btn a{display:block;width:42px;margin:0 auto;border:1px solid rgba(255, 255, 255, 0.4);font-size:12px;font-family: 'Roboto', sans-serif;color:#fff;padding:6px 27px;font-weight:500}
.more_btn a:hover{color:#000;background:#fff;}
.more2_btn a{display:block;width:42px;margin:0 auto;border:1px solid rgba(255, 255, 255, 0.4);font-size:12px;font-family: 'Roboto', sans-serif;color:#fff;padding:6px 27px;font-weight:500}
.more2_btn a:hover{color:#000;background:#fff;}

.two-btn {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 66%;
	left: 50%;
	width: 100%;
	transform: translate(-50%, -50%);
}
.two-btn .btn1 {
	margin: 0 10px;
	border:1px solid rgba(255, 255, 255, 0.4);
}
.two-btn a {
	display: inline-block;
	padding: 5px 20px;
	
	
	color: #fff;
	transition: color 200ms ease-in-out, background 200ms ease-in-out;
	box-sizing: border-box;
}
.two-btn a:hover{color:#000;background:#fff;}


/*news*/
.main_con03{position:relative;padding:0; margin:0;height:100%;max-height:807px}
.main_con03 h2{width:100%; text-align:center; position:absolute; top:5%; color:#fff;font-family: 'Noto Sans KR', sans-serif;font-weight:500;font-size:19px;letter-spacing:0.1em;}
.news01{width:30%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:15%;}
.news01 h3{color:#fff;font-size:24px;font-weight:300;padding:12% 8% 30% 8%;opacity:1}
.news02{width:30%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:55%;}
.news02 h3{color:#fff;font-size:24px;font-weight:300;padding:12% 8% 30% 8%;opacity:1}

/* 컨텐츠 3개
.news01{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:20%;}
.news01 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
.news02{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:43%;}
.news02 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
.news03{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:66%;}
.news03 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
*/

/* 컨텐츠 4개
.news01{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:11.5%;}
.news01 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
.news02{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:31.5%;}
.news02 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
.news03{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:51.5%;}
.news03 h3{color:#fff;font-size:24px;font-weight:300;padding:23% 8% 48% 8%;opacity:1}
.news04{width:17%; text-align:center; position:absolute; top:36%;background:rgba(0, 0, 0, 0.5);left:71.5%;}
.news04 h3{color:#fff;font-size:24px;font-weight:300;padding:30% 8% 52% 8%;opacity:1}
*/

.more_btn02{width:100%; text-align:center; position:absolute; top:60%;left:0;}
.more_btn02 a{display:block;width:42px;margin:0 auto;border:1px solid rgba(255, 255, 255, 0.4);font-size:12px;font-family: 'Roboto', sans-serif;color:#fff;padding:6px 27px;font-weight:500}
.more_btn02 a:hover{color:#000;background:#fff;}
/*.news{width:70%;margin:0 auto; float:left;border:1px solid red}
.news li{display:block; float:left;width:15%;background:#000;opacity:0.5;text-align:center;padding:0 20%; margin:0 5%;font-size:24px;font-weight:400;color:#fff;}*/

/*footer*/
.footer{overflow:hidden;background:#000;padding:2% 0 3% 0}
.address{position:relative;float:left;width:30%;margin-left:5%;color:#969696; font-size:12px;font-weight:300;}
.address span{margin-left:3%}
.address img{vertical-align:bottom;/*margin-right:3%*/}
/*.addressimages{width:100%}*/
.backnumber{float:right;font-size:13px;font-weight:300;color:#fff;margin:1% 1% 0px 0px}
.backnumber img{vertical-align:middle}
.sns_btn{position:relative;float:right;margin:1% 5% 0px 0px;width:7%;}
.sns_btn li{display:block;float:left;width:15%;margin:0px 0px 0px 30%;}


/*top버튼*/
.top_btn{display:block;position:fixed; bottom:17%; right:3%;opacity:0.7}
/*main-image*/
.hidden-e {display:block !important}
.hidden-e2 {display:block !important}
.hidden-m {display:none !important}
.hidden-m2 {display:none !important}
/*br*/
.brmobile{display:none}
.mobile_1024{display:block}
.mobile_1024br{display:none}
.mobile_768{display:block}
.mobile_768br{display:none}
.mobile_570{display:block}
.mobile_570br{display:none}
.mobile_360{display:block}
.mobile_360br{display:none}
.mobile_425{display:block}
.mobile_425br{display:none}

@media screen and (min-width:2100px) {	
	.logo_w {left: 15%;}
	.btn_side {right: 15%;}
}

@media screen and (max-width:1680px) {	
.news04 h3{padding:30% 8% 53% 8%}

}
@media screen and (max-width:1440px) {
.main_con03 h2{font-size:17px}
.main_con01 h4{font-size:45px}
.main_con02 h4{font-size:45px}
/*4개
.news01 h3{font-size:20px}
.news02 h3{font-size:20px}
.news03 h3{font-size:20px}
.news04 h3{font-size:20px;padding:30% 8% 54% 8%}
*/
    
    .news01 h3{font-size:20px}
.news02 h3{font-size:20px}
.news03 h3{font-size:20px;padding:30% 8% 54% 8%}

}
/*노트북*/
@media screen and (max-width:1366px) {

}
@media screen and (max-width:1280px) {
.news04 h3{padding:30% 8% 55% 8%}
.footer{padding:2% 0 4% 0}
.address{width:40%}
.sns_btn{margin:2% 5% 0 0}
.backnumber{margin:2% 1% 0 0}
}
/*아이패드 미니-가로*/
@media screen and (max-width:1024px) {
.main_con01 h4{font-size:40px}
.main_con02 h4{font-size:40px}
/*4개
.news01 h3{font-size:16px}
.news02 h3{font-size:16px}
.news03 h3{font-size:16px}
.news04 h3{font-size:16px}
*/
    .news01 h3{font-size:18px}
.news02 h3{font-size:18px}
.news03 h3{font-size:18px}
.logo_w img{width:90%}
.btn_side{padding:16px 28px 16px 10px;font-size:16px}

}
@media screen and (max-width:960px) {	
.news01 h3{font-size:15px}
.news02 h3{font-size:15px}
.news03 h3{font-size:15px}
.news04 h3{font-size:15px}
.address{width:50%}

}
/*아이패드 미니-세로, 아이폰 XS-가로*/
@media screen and (max-width:768px) {	

.logo_w{position:fixed;top:3%}
.vol{top:90%}
.vol_b{position:absolute;font-size:10px;left:2%}
.vol_b span{font-size:10px}
.hidden-e {display:none !important}
.hidden-m {display:block !important}
	

.logo_w img{width:80%}
.main_con01 h2{font-size:17px}
.main_con01 h3{top:40%;font-size:14px}
.main_con01 h4{top:43%;font-size:50px;line-height:130%}
.main_con02 h2{font-size:17px}
.main_con02 h3{top:28%;font-size:14px}
.main_con02 h4{top:35%;font-size:43px;line-height:130%}
.main_con03 h2{font-size:17px}
/* 4개
.news01{width:35%;left:13%;top:20%}
.news01 h3{font-size:20px;padding:23% 4% 48% 4%}
.news02{width:35%;left:52%;top:20%}
.news02 h3{font-size:20px;padding:23% 4% 48% 4%}
.news03{width:35%;left:13%;top:54%}
.news03 h3{font-size:20px;padding:23% 4% 48% 4%}
.news04{width:35%;left:52%;top:54%}
.news04 h3{font-size:20px;padding:30% 4% 52% 4%}
*/
/*3개
    .news01{width:25%;left:9%}
.news01 h3{font-size:20px;padding:23% 4% 48% 4%}
.news02{width:25%;left:37.5%}
.news02 h3{font-size:20px;padding:23% 4% 48% 4%}
.news03{width:25%}
.news03 h3{font-size:20px;padding:30% 4% 57% 4%}
*/
	
	.news01{width:40%; left:9%}
	.news01 h3{font-size:20px; padding:23% 4% 48% 4%}
	.news02{width:40%;left:52%}
	.news02 h3{font-size:20px; padding:23% 4% 48% 4%}
	.news03{width:25%}
	.news03 h3{font-size:20px; padding:30% 4% 57% 4%}
	
.more_btn{top:67%}
.more2_btn{top:60%}
.brmobile{display:block}
.top_btn{bottom:10%}
.gnb > li{font-size:17px}
.btn_side{padding:12px 22px 12px 10px;font-size:14px;position:fixed;top:3%}
.address{width:50%}
.sns_btn{margin:3% 5% 0 0}
.backnumber{margin:3% 1% 0 0}


}
@media screen and (max-width:570px) {
.main_con01 h2{font-size:16px;top:20%;letter-spacing:0;opacity:0.5}
.main_con02 h2{font-size:16px;top:4.5%;letter-spacing:0;opacity:0.5}
.main_con03 h2{font-size:16px;top:4.5%;letter-spacing:0;opacity:0.5}
.main_con01 h4{font-size:30px;line-height:130%}
.main_con02 h4{font-size:30px;line-height:130%}
.footer{padding:4% 0 5% 0}
.vol{left:2%}
/* 4개
.news01{top:27%}
.news02{top:27%}
.news01 h3{font-size:18px}
.news02 h3{font-size:18px}
.news03 h3{font-size:18px}
.news04 h3{font-size:18px;padding:30% 4% 55% 4%}
*/
.news01{width:85%;top:25%;padding: 2%; left:50%; transform: translateX(-50%)}
.news02{width:85%;top:60%;padding: 2%; left:50%; transform: translateX(-50%)}
.news03{width:65%;top:67%;padding:2% 0% 1% 0%; left:50%; transform: translateX(-50%)}
.news01 h3{font-size:18px;padding:5% 4% 20% 4%}
.news02 h3{font-size:18px;padding:5% 4% 20% 4%}
.news03 h3{font-size:18px;padding:5% 4% 20% 4%}
.sns_btn{margin:3% 7% 0px 0px}
.address{font-size:11px}
.vol{top:98%}
.top_btn{bottom:3%}
}
/*아이폰XS*/
@media screen and (max-width:425px) {
.mobile{display:block}
.top_btn img{width:70%}
.top_btn {right:1%}
.logo_w img{width:60%}
.main_con01 h2{font-size:14px;letter-spacing:-0.05em}
.main_con01 h3{top:38%;font-size:14px;letter-spacing:0/*move*/}
.main_con01 h4{top:42%;font-size:25px;line-height:140%;letter-spacing:-0.05em/*move*/}
.main_con01 h4 span{letter-spacing:-0.05em}
.main_con02 h2{font-size:14px;letter-spacing:-0.05em}
.main_con02 h3{font-size:14px;letter-spacing:0}
.main_con02 h4{top:35%;font-size:25px;line-height:140%;letter-spacing:-0.05em}
.main_con02 h4 span{letter-spacing:-0.05em}
.main_con03 h2{font-size:14px;letter-spacing:-0.05em}
.more_btn{top:65%}
/*.more_btn02{top:60%}*/
.more2_btn{top:70%}
.vol{left:0%;font-size:11px}
/*
.news01 {width:40%;left:7%}
.news02 {width:40%;left:53%}
.news03 {width:40%;left:7%}
.news04 {width:40%;left:53%}
.news01 h3{font-size:14px}
.news02 h3{font-size:14px}
.news03 h3{font-size:14px}
.news04 h3{font-size:14px}
*/
.news01 h3{font-size:15px;}
.news02 h3{font-size:15px;}
.news03 h3{font-size:15px;}
.footer{padding:5% 10% 10% 10%;}
.sns_btn{width:50%;margin:0 auto;float:none}
.sns_btn li{margin:0 5% 0 0}
.address{width:100%;text-align:center;}
.address span{margin:0}
.address img{width:30%;margin:5% 0 3% 0}
.address{font-size:8px}
.mobile_425{display:none}
.mobile_425br{display:block}
.backnumber{margin:0 auto 0;float:none}
.backnumber img{margin-left:3%}
}
@media screen and (max-width:360px) {
.address{font-size:7px}
/*4개
.news01 h3{font-size:13px}
.news02 h3{font-size:13px}
.news03 h3{font-size:13px}
.news04 h3{font-size:13px}
*/
.backnumber{width:80%}


}
.fw_700 {font-weight: 700 !important; }

/* ------------------ prolog ------------------- */
.prolog { }
.prolog > p {width: 100%; text-align: center; position: absolute; top: 25%; color: #fff; font-family: 'Noto Sans KR', sans-serif; font-weight: 400; font-size: 14px; letter-spacing: 0.025em; line-height: 1.6;}
.prolog h4 {top: 35%; }
.prolog .list_box {position: absolute; top: 55%; left: 50%; width: 36%; transform: translateX(-50%);}
.prolog .list_box h5 {margin-bottom: 12px; font-family:'TimesNewRoman', 'Times New Roman', 'Times', 'Baskerville', 'Georgia', serif; font-size: 28px; font-style: italic; color: #fff; }
.prolog .list_box .list {overflow: hidden;}
.prolog .list_box .list li {position: relative; margin-bottom: 10px; }
.prolog .list_box .list li:after {content: ""; display: inline-block; position: absolute; bottom: 0; width: 100%; height: 1px; margin-left: 5px; background-color: #6e6869;}
.prolog .list_box .list li a {color: #fff; font-size: 20px; font-weight: 700; letter-spacing: -0.025em;}
.prolog .list_box .list li span {font-size: 14px; }
.prolog .scroll_down {position: absolute; left: 50%; bottom: 2%; background: transparent; border: 0; outline: 0; transform: translateX(-50%);}
.mshow {display: none;}
.mhid {display: block;}
@media screen and (max-width:1680px) {
    .prolog > p {top: 20%;}
    .prolog h4 {top: 30%; }
    .prolog .list_box {top: 50%; width: 40%; }
} 

@media screen and (max-width:1440px) {
    .prolog > p {top: 18%;}
    .prolog .list_box {top: 45%; width: 50%; }
} 

@media screen and (max-width:1280px) {
	.hidden-m2 {display:block !important}
	.hidden-e2 {display:none !important}
	.prolog > p {top: 20%; }
	.prolog h4 {top: 35%; }
	.prolog .list_box {top: 55%; width: 75%; }
}
@media screen and (max-width:768px) {
	.prolog > p {display: none;}
	.prolog h4 {top: 20%; }
	.prolog .list_box {top: 55%; text-align: center;}
	.prolog .list_box .list li:after {display: none; }
	.prolog .list_box .list li span {display: block;}

	.two-btn {
		flex-wrap: wrap;
		top: 60%;
		left: 50%;
	}
	.two-btn .btn1 {
		width: 100%;
		margin: 10px;
		text-align: center;
	}
	.two-btn a {
		display: block;
		width: 100%;
		padding: 10px 20px;
		box-sizing: border-box;
		font-size: 14px;
	}
	
	.mshow {display: block;}
	.mhid {display: none;}
	
}

@media screen and (max-width: 570px) {
    .prolog > p {top: 15%; font-size: 12px;}
    .prolog h4 {top: 35%; }
    
    .prolog .list_box {top: 57%;}
    .prolog .list_box h5 {margin-bottom: 8px; font-size: 22px; }
    .prolog .list_box .list li {margin-bottom: 15px; }
    .prolog .list_box .list li a {font-size: 15px; }
    .prolog .list_box .list li span {font-size: 12px; }
    .prolog .scroll_down {display: none; }
}

@media screen and (max-width: 475px) {
    .prolog > p {top: 18%;}
    .prolog h4 {top: 40%; }
    .prolog .list_box {top: 50%; width: 90%;}
    .prolog .list_box .list li {margin-bottom: 10px; }
    .prolog .list_box .list li a {font-size: 16px; }
    .prolog .scroll_down {display: none; }
}

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

}