@charset "utf-8";

/* 게시판 쓰기 */
#autosave_wrapper {position:relative; font-size:14px;}
#autosave_pop {display:none;z-index:10;position:absolute !important;top:34px;right:0;width:100%;height:auto !important;height:180px;max-height:205px;border:1px solid #565656;background:#fff;
-webkit-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);
box-shadow: 2px 2px 3px 0px rgba(0,0,0,0.2);}
#autosave_pop:before{content: "";position: absolute;top: -8px;right: 45px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #000 transparent;}
#autosave_pop:after{content: "";position: absolute;top: -7px;right: 45px;width: 0;height: 0;border-style: solid;border-width: 0 6px 8px 6px;border-color: transparent transparent #fff transparent;}
html.no-overflowscrolling #autosave_pop {height:auto;max-height:10000px !important} /* overflow 미지원 기기 대응 */
#autosave_pop strong {position:absolute;font-size:0;line-height:0;overflow:hidden}
#autosave_pop div {text-align:center;margin:0 !important;}
#autosave_pop button {margin:0;padding:0;border:0;}
#autosave_pop ul {margin:0px;padding:15px;border-top:1px solid #e9e9e9;list-style:none;overflow-y:scroll;height:156px;border-bottom:1px solid #e8e8e8}
#autosave_pop li {padding:8px 5px;border-bottom:1px solid #fff;zoom:1}
#autosave_pop li:after {display:block;visibility:hidden;clear:both;content:""}
#autosave_pop a {display:block;float:left}
#autosave_pop span {display:block;float:right;color:#999}
.autosave_close {cursor:pointer;width:100%;height:30px;background:none;color:#888;font-weight:bold;font-size:0.92em}
.autosave_close:hover{background:#f3f3f3;color:#3597d9}
.autosave_content {display:none}
.autosave_del{background:url(./img/close_btn.png) no-repeat 50% 50%;text-indent:-999px;overflow:hidden;height:26px;width:20px;}

.cke_sc { display:none; }

/* 기타 */
#bo_v_con div { position: relative; margin-bottom: 1rem; }
#bo_v_con img { margin-bottom: 1rem; }
#bo_v_con iframe { position: absolute; width: 100%; height: 100%; }
#bo_v_con .video { position: relative; width: 100%;	padding-bottom: 56.25%;	border-radius: 2px;	overflow: hidden; }
#bo_v_con .video iframe { position: absolute; width: 100%; height: 100%; }

/* 커스텀 */
.anchor { position: relative } 
.anchor a { position: absolute; top: -60px }
/* .pagination { margin-bottom: 0.75rem; } */

.table { table-layout: fixed; }

.list-icon { width: 20px; height: 20px; vertical-align: text-bottom; }
.view-icon { width: 48px; height: 48px; }
.comm-icon { width: 48px; height: 48px; }
.comm-body { background: #f4f4f4; padding: 20px; border-radius: 5px; }



#brand-top {position:relative;width:100%;margin:200px auto;text-align:center;}

#brand-top .logo {display:block;max-width:800px;position:relative;margin:0 auto 80px auto;padding-top:100px}
#brand-top .lines {
content:"";
position:absolute;
width:100px;
height:3px;
background-color:#000;
top:0%;
left:50%;
transform:translateX(-50%);

}


.brand-top-explan {max-width:1600px;margin:0 auto}

.brand-left {width:35%;font-size:3rem;font-weight:400;text-align:left;line-height:1.2;letter-spacing:-2px}
.brand-right {width:60%;text-align:left;font-size:1.2rem;color:#555}

.brand-left-img {width:50%;font-size:2.5rem;font-weight:700;text-align:left;line-height:1.2;letter-spacing:-1px}
.brand-right-img {width:40%;text-align:left;font-size:1.2rem;color:#555;flex-direction: column;justify-content: space-evenly}

.brand-left-img img {width:100%}
.brand-right-img img {width:100%}
.brand-right-bottom {font-size:4rem;font-weight:700;color:#111;line-height:1}

.board-top {display:none !important}


.brand-center {position:relative;width:100%;background-color:#242223;padding:200px 0}
.brand-center h2 {display:block;color:#fff;text-align:center;font-size:3rem;font-weight:700}
.brand-center .desc {display:block;color:#ccc;text-align:center;font-size:1.1rem;}
.brand-center02 {position:relative;width:100%;background-color:#f3f3f3;padding:200px 0}
.brand-center02 h2 {display:block;color:#242223;text-align:center;font-size:3rem;font-weight:700}
.brand-center02 .desc {display:block;color:#777;text-align:center;font-size:1.1rem;}
.brand-center-wrap {max-width:1600px;margin:200px auto}
.brand-center-wrap .center-wrap {width:33%;text-align:center;}
.brand-center-wrap .center-wrap h2 {display:block;font-size:1.7rem;margin-top:35px}
.brand-center-wrap .center-wrap p {display:block;color:#eee;font-size:1.1rem}

.brand-center-wrap02 {max-width:80%;margin:100px auto 200px auto}
.brand-center-wrap02 .center-wrap02 {width:31%;text-align:center;}
.brand-center-wrap02 .center-wrap02 img {width:100%}
.brand-center-wrap02 .center-wrap02 h2 {display:block;font-size:3rem;color:#242223;text-transform: uppercase;line-height:1}
.brand-center-wrap02 .center-wrap02 p.ptitle {font-size:1.7rem;color:#555;font-weight:bold;margin-bottom:0px}
.brand-center-wrap02 .center-wrap02 p {display:block;color:#777;font-size:1.2rem}
.brand-center-wrap02 .center-wrap02 a {display:block;max-width:70%;margin:20px auto 0 auto;border:1px solid #242223;color:#242223;padding:15px;font-size:1.2rem;}
.brand-center-wrap02 .center-wrap02 .large {font-size:4rem;display:block}
.brand-center-wrap02 .center-wrap02 .wimg {position:relative}

.brand-center-wrap02 .center-wrap02 .wimg02 {position:relative}
.brand-center-wrap02 .center-wrap02 .wtext01 {position:absolute;bottom:-20%;left:50%;transform:translateX(-50%)}
.brand-center-wrap02 .center-wrap02 .wtext02 {position:absolute;bottom:-15%;left:50%;transform:translateX(-50%)}
.brand-center-wrap02 .center-wrap02 .wtext03 {position:absolute;bottom:-10%;left:50%;transform:translateX(-50%)}



.brand-center03 {position:relative;width:100%;background-color:#fff;padding:200px 0}
.brand-center03 h2 {display:block;color:#242223;text-align:center;font-size:3rem;font-weight:700}
.brand-center03 .desc {display:block;color:#777;text-align:center;font-size:1.1rem;}

.brand-center-wrap03 {max-width:1600px;margin:100px auto 200px auto}

.wgood {width:50%}
.wgood img {width:100%}
.wgood-text {width:45%;text-align:left}



.brand-center-wrap03 .center-wrap03 {width:100%;}

.brand-center-wrap03 .center-wrap03 h3::before {
content:"";
position:absolute;
top:0px;
left:0px;
width:80px;
height:2px;
background-color:#000;
}
.brand-center-wrap03 .center-wrap03 h3 {position:relative;display:block;font-size:2.2rem;color:#242223;text-transform: uppercase;line-height:1;padding-top:35px;margin-bottom:35px}
.brand-center-wrap03 .center-wrap03 p {display:block;color:#777;font-size:1.2rem}


 .appWrapper img {
	 max-width: 100%;
	 border: 0;
	 -ms-interpolation-mode: bicubic;
	 vertical-align: middle;
}
 .appWrapper {
	 position: relative;
	 overflow: hidden;
	 top: 0;
	 left: 0;
	 transition: -webkit-transform 0.3s ease-in-out;
	 transition: -webkit-transform 0.3s ease-in-out;
	 -webkit-transition: -webkit-transform 0.3s ease-in-out;
	 -o-transition: transform 0.3s ease-in-out;
	 transition: transform 0.3s ease-in-out;
	 transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
	 transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
	 transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
 .header__overlay {
	 position: absolute;
	 width: 100%;
	 height: 100%;
	 padding-top: 0px;
	 background-color: rgba(0, 0, 0, 0.2);
}
 .header__title {
	 position: relative;
	 top: 50%;
	/*left: 50%;
	*/
	 width: 65%;
	 margin: -50px auto;
	 text-align: center;
	 -webkit-transform: translate(0%, -50%);
	 -ms-transform: translate(0%, -50%);
	 transform: translate(0%, -50%);
}
 @media (max-width: 580px) {
	 .header__title {
		 width: 80%;
		 -webkit-transform: translate(0%, -60%);
		 -ms-transform: translate(0%, -60%);
		 transform: translate(0%, -60%);
	}
}
 .header__title__img__wrapper {
	 width: 100%;
	 height: 100%;
	 margin: 0px 0px 15px 0px;
	 opacity: 0;
}
 .header__title__img__wrapper img {
	 width: 100px;
}
 .header__title__h2 {
	 font-size: 2rem;
	 color: #fff;
	 display: block;
	 margin: 0px 0px 40px 0px;
	 padding: 0;
	 font-weight: normal;
	 position: relative;
	 top: -40px;
	 opacity: 0;
	 -webkit-backface-visibility: hidden;
	 letter-spacing:0px;
}
 .header__title__h1 {
	font-style: normal;
	 font-weight: 800 !important;
	 font-size: 84px;
	 line-height: 1.2em;
	 letter-spacing: 0.5px;
	 color: #fff;
	 display: block;
	 margin: 0;
	 padding: 10px 0;
	 opacity: 0;
	 position: relative;
	 top: -20px;
	 text-transform: uppercase;
	 -webkit-backface-visibility: hidden;
	 overflow: hidden;
}

 .header__title__paragraph {
	 font-size: 1.3rem;
	 line-height: 1.4em;
	 width: 100%;
	 max-width: 750px;
	 color: #fff;
	 opacity: 0;
	 padding: 0;
	 margin: 15px auto 0 auto;
	 -webkit-font-smoothing: antialiased;
	 -moz-osx-font-smoothing: grayscale;
	 position: relative;
	 -webkit-backface-visibility: hidden;
}
 @media (max-width: 640px) {
	 .header__title__paragraph {
		 font-size: 18px;
		 line-height: 1em;
		 letter-spacing:0px;
	}
}
 .bg {
	 -webkit-backface-visibility: visible;
	 backface-visibility: visible;
	 background-color: transparent;
	 background-position: center center;
	 -webkit-background-size: cover !important;
	 background-size: cover !important;
	 width: 100%;
	 position: relative;
	 overflow: hidden;
}
 .headerIntro {
	 -webkit-transition: all 1s;
	 -o-transition: all 1s;
	 transition: all 1s;
	 -webkit-transform: matrix(1.08, 0, 0, 1.08, 0, 0);
	 -ms-transform: matrix(1.08, 0, 0, 1.08, 0, 0);
	 transform: matrix(1.08, 0, 0, 1.08, 0, 0);
}
 .js-to-Scroll {
	 position: absolute;
	 bottom: 55px;
	 width: 31px;
	 height: 18px;
	 left: 50%;
	 opacity: 0;
	 margin: 0 0 0 -15px;
	 -o-transition: 0.25s;
	 -webkit-transition: 0.25s;
	 transition: 0.25s;
}
 .js-to-Scroll:hover {
	 bottom: 60px;
}
 .scroll__icon {
	 outline: none;
}
 .scroll__icon svg {
	 width: 31px;
	 height: 18px;
	 fill: #fff;
	 -o-transition: 0.25s;
	 -webkit-transition: 0.25s;
	 transition: 0.25s;
}
 .js-to-Scroll:hover svg {
	 fill: #ccbe7a;
}
 #main {
	 height: 1000px;
}
 

@media (max-width:1280px)
{
  .header__title {
	 position: relative;
	 top: 50%;
	/*left: 50%;
	*/
	 width: 65%;
	 margin: 0px auto;
	 text-align: center;
	 -webkit-transform: translate(0%, -50%);
	 -ms-transform: translate(0%, -50%);
	 transform: translate(0%, -50%);
}

 .header__title__h2 {
	 font-size: 1.5rem;
	 color: #fff;
	 display: block;
	 margin: 0px 0px 10px 0px;
	 padding: 0;
	 font-weight: normal;
	 position: relative;
	 top: -40px;
	 opacity: 0;
	 -webkit-backface-visibility: hidden;
	 letter-spacing:0px;
	 letter-spacing:0px;
}
 .header__title__h1 {

	 font-style: normal;
	 font-weight: 800 !important;
	 font-size: 60px;
	 line-height: 1.2em;
	 letter-spacing: 0.5px;
	 color: #fff;
	 display: block;
	 margin: 0;
	 padding: 10px 0;
	 opacity: 0;
	 position: relative;
	 top: -20px;
	 text-transform: uppercase;
	 -webkit-backface-visibility: hidden;
	 overflow: hidden;
}

#brand-top .logo {display:block;max-width:500px;position:relative;margin:0 auto 80px auto;padding-top:100px;right:auto}
#brand-top .lines {
content:"";
position:absolute;
width:100px;
height:3px;
background-color:#000;
top:0%;
left:50%;
transform:translateX(-50%);

}


.brand-top-explan {max-width:90%;margin:0 auto;justify-content: space-between}
.brand-left {width:40%;font-size:2.5rem;font-weight:400;text-align:left;line-height:1.2;letter-spacing:-2px}
.brand-right {width:55%;text-align:left;font-size:1.1rem;color:#555}
.brand-right br {display:none}
.brand-center {padding:150px 0}
.brand-center-wrap {max-width:1600px;margin:100px auto 0 auto}
.brand-center-wrap02 {max-width:90%}
.brand-center-wrap .center-wrap {width:33%;text-align:center;}
.brand-center-wrap .center-wrap h2 {display:block;font-size:1.3rem;margin-top:35px}
.brand-center-wrap .center-wrap p {display:block;color:#eee;font-size:1rem}
.brand-center-wrap .center-wrap img {max-width:100px;margin:0 auto}

.brand-center-wrap02 .center-wrap02 h2 {font-size:2rem;line-height:1}
.brand-center-wrap02 .center-wrap02 .large {font-size:3rem;line-height:1}
.brand-center-wrap02 .center-wrap02 .wtext01 {position:absolute;bottom:-30%;left:50%;transform:translateX(-50%)}
.brand-center-wrap02 .center-wrap02 .wtext02 {position:absolute;bottom:-25%;left:50%;transform:translateX(-50%)}
.brand-center-wrap02 .center-wrap02 .wtext03 {position:absolute;bottom:-20%;left:50%;transform:translateX(-50%)}

.brand-center-wrap02 .center-wrap02 p.ptitle {font-size:1.3rem;color:#555;font-weight:bold;margin-bottom:0px}
.brand-center-wrap02 .center-wrap02 p {display:block;color:#777;font-size:1rem}
.brand-center-wrap02 .center-wrap02 a {display:block;max-width:100%;margin:20px auto 0 auto;border:1px solid #242223;color:#242223;padding:15px;font-size:1rem;}


.brand-center03 {padding:100px 0 0 0}
.brand-center-wrap03 .center-wrap03 {width:90%;margin:0 auto}

.brand-center-wrap03 .center-wrap03 h3 {position:relative;display:block;font-size:1.5rem;color:#242223;text-transform: uppercase;line-height:1;padding-top:35px;margin-bottom:35px}
.brand-center-wrap03 .center-wrap03 p {display:block;color:#777;font-size:1rem}
.brand-center-wrap03 .center-wrap03 p br {display:none}
.brand-right-bottom {font-size:3rem}

}


@media (max-width:820px)
{

 .header__title__h2 {
	 font-size: 1.3rem;
	 color: #fff;
	 display: block;
	 margin: 0px 0px 10px 0px;
	 padding: 0;
	 font-weight: normal;
	 position: relative;
	 top: -40px;
	 opacity: 0;
	 -webkit-backface-visibility: hidden;
	 letter-spacing:0px;
	 letter-spacing:0px;
}
 .header__title__h1 {

	 font-style: normal;
	 font-weight: 800 !important;
	 font-size: 40px;
	 line-height: 1.2em;
	 letter-spacing: 0.5px;
	 color: #fff;
	 display: block;
	 margin: 0;
	 padding: 10px 0;
	 opacity: 0;
	 position: relative;
	 top: -20px;
	 text-transform: uppercase;
	 -webkit-backface-visibility: hidden;
	 overflow: hidden;
}


#brand-top .logo {display:block;max-width:300px;position:relative;margin:0 auto 80px auto;padding-top:100px;right:auto}
#brand-top .lines {
content:"";
position:absolute;
width:100px;
height:3px;
background-color:#000;
top:0%;
left:50%;
transform:translateX(-50%);

}


.brand-top-explan {max-width:90%;margin:0 auto;justify-content: space-between;flex-direction: column;}
.brand-left {width:100%;font-size:2rem;font-weight:400;text-align:left;line-height:1.2;letter-spacing:-1px;margin-bottom:15px}
.brand-right {width:100%;text-align:left;font-size:1.1rem;color:#555}
.brand-left-img,
.brand-right-img {width:100%}
.brand-right-bottom {font-size:3rem;padding:35px 0}
.brand-right-img-title {font-size:1.1rem;padding-top:35px}
}

@media (max-width:600px)
{
	#captcha_audio {display:none !important;}

	.xs-100 { width: 100%; }
	.xs-full {
		width: 100vw;
		position: relative;
		/* margin-top: -36px; */
		margin-left: -50vw;
		left: 50%;
	}
	.xs-full td	{ padding: 8px 18px; }

	.list-icon { width: 18px; height: 18px; vertical-align: text-top; }
	.comm-icon { width: 24px; height: 24px; margin: 10px; position: absolute; }
	.comm-body { padding: 10px; }
	.comm-name { margin: 0 0 6px 30px; }

.brand-left {width:100%;font-size:1.5rem;font-weight:400;text-align:left;line-height:1.2;letter-spacing:-1px;margin-bottom:15px}
.brand-right {width:100%;text-align:left;font-size:1rem;color:#555}
#brand-top {margin:100px auto}
.brand-right-bottom {font-size:2rem;padding:35px 0}

.header__title {width:90%}

 .header__title__h1 {
	font-style: normal;
	 font-weight: 800 !important;
	 font-size: 50px;
	 line-height: 1;
	 letter-spacing: 0.5px;
	 color: #fff;
	 display: block;
	 margin: 0;
	 padding: 10px 0;
	 opacity: 0;
	 position: relative;
	 top: -20px;
	 text-transform: uppercase;
	 -webkit-backface-visibility: hidden;
	 overflow: hidden;
}

#brand-top .logo {display:block;max-width:200px;position:relative;margin:0 auto 80px auto;padding-top:100px;right:auto}
.brand-center-wrap {flex-direction: column;align-items: center}
.brand-center {padding:100px 0}
.brand-center h2 {display:block;color:#fff;text-align:center;font-size:2rem;font-weight:700;letter-spacing:0px}
.brand-center .desc {display:block;color:#ccc;text-align:center;font-size:1rem;max-width:90%;margin:0 auto}
.brand-center .desc br {display:none}
.brand-center02 {position:relative;width:100%;background-color:#f3f3f3;padding:100px 0 0 0}
.brand-center02 h2 {display:block;color:#242223;text-align:center;font-size:2rem;font-weight:700}
.brand-center02 .desc {display:block;color:#777;text-align:center;font-size:1rem;}
.brand-center03 h2 {display:block;color:#242223;text-align:center;font-size:2rem;font-weight:700}
.brand-center03 .desc {display:block;color:#777;text-align:center;font-size:1rem;}
.brand-center-wrap .center-wrap {width:100%;margin:0 0 50px 0}
.brand-center-wrap .center-wrap img {max-width:75px}
.brand-center-wrap {margin-top:50px}
.brand-center-wrap02 {flex-direction: column;margin-top:0px;margin-bottom:0px}
.brand-center-wrap02 .center-wrap02 {width:100%}


.brand-center-wrap02 .center-wrap02 .wtext01 {display:block;bottom:30px}
.brand-center-wrap02 .center-wrap02 .wtext02  {display:block;bottom:60px}
.brand-center-wrap02 .center-wrap02 .wtext03 {display:block;bottom:90px}
.brand-center-wrap03 .center-wrap03 {flex-direction: column;}
.brand-center-wrap03 {margin-top:0px}
.wgood-text {width:100%;margin-top:35px}
.wgood {width:100%}
.brand-center-wrap03 .center-wrap03 h3 {margin-bottom:15px}

.center-wrap03:nth-child(2) .wgood-text {order:1}

}