.lead { font-size:16px; line-height:1.75; letter-spacing:-0.02em; color:#555; font-weight:300;  word-break:keep-all}


@media screen and (max-width: 640px) {
input {
   -webkit-appearance: none;
   -webkit-border-radius: 0;
}
.lead { font-size:17px; font-weight:400}
}


/*헤드메뉴*/
#header_wrap {position: fixed; width:100%; height:100px; z-index:10; transition-duration: 0.3s;}
#header {position:absolute;left:0;top:0px; max-width: 1720px; width:100%; left: 50%; transform:translateX(-50%) ;z-index:6;-webkit-transition:all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#header .header-inner {width:100%; height:100% }
#header .gnb { list-style:none; height:100%; position:absolute; right: 0%; }
#header .gnb > li { float:left; position:relative; display:inline-block;  vertical-align:middle; text-align:center; padding: 0 50px;}
#header .gnb > li > a {display:inline-block; line-height:1em; width:100%; color:#fff; font-size:20px; font-weight:400; text-decoration:none;}
#header .gnb > li.active {background-color: #b0905e}
#header .gnb > li.active > a {color: #fff}
#header .gnb .login {  font-size:12px; width:70px; color:#fff}
#header .gnb .join { font-size:12px; color:#fff; margin-left:20px}
#header .gnb .login a { color:#fff; opacity:0.8; font-size:12px}
#header .gnb .login a:hover { color:#fff}
#header .gnb .join a { color:#fff; opacity:0.8; font-size:12px}
#header .gnb .join a:hover { color:#fff}
#header .gnb > li, #header #right-side-open {height:100px;line-height:100px; -webkit-transition: all .3s ease;-moz-transition: all .3s ease;-ms-transition: all .3s ease;-o-transition: all .3s ease;transition: all .3s ease;}
#header #right-side-open { position:absolute; right:0; width:100px; cursor:pointer; border-left:1px solid rgba(255,255,255,0.3); text-align:center; display: inline-block; }
#header #right-side-open span{display:inline-block;width:20px; height:20px;font-size:20px;line-height:1em;margin-top:-10px; margin-left:-10px; position:absolute; top:50%;left:50%; color:#fff;}
#header .gnb .snb {list-style:none; display:none;}
#header #logo { margin-left:25px; padding:0}
#header #logo a { display:block; width:234px; height:100px; line-height:100px; background-image: url(../img/logo.png); background-repeat: no-repeat; background-position: center;}
#header #logo img { width:100%}
#header .gnb .snb,.device-md #header .gnb .snb{display: none;position: absolute;left: 50%; transform: translateX(-50%); width: 200px; top:100px; border-top: 0;background: #2b436a; z-index:2}
#header .gnb .snb li { font-size:14px; line-height:3.1; text-align:center;}
#header .gnb .snb li a { color:#FFF; display:block; transition-duration: 0.3s;font-size: 16px;}
#header .gnb .snb li a:hover {color:#fff;  display:block; text-decoration:none; line-height:3.1; font-weight: 700;}

/* 스크롤 이벤트 */
#header_wrap  { background-color:#fff; border-bottom: 1px solid #ddd;}
#header .gnb > li > a {color: #121212;}
#header #logo a {background-image: url(../img/logo_c.png);background-size: contain;}
.scrolled #open-button .navicon-line {background: #121212;}
.scrolled #open-button.on>div>div {background-color: #fff !important;}

@media screen and (max-width:1170px) {
	#header .gnb > li{padding: 0 30px;}
}

@media screen and (max-width: 960px) {
    #header { display:block; background-color:transparent; top:0; border-bottom:0; position:fixed}
	#header_wrap {height: 80px;}
	#header #logo { width:120px; display:block}
	#header #logo a {height: 80px; line-height: 80px;}
	#header .gnb { display:none}
}

@media screen and (max-width: 640px) {
	#header_wrap {height: 60px;}
	#header #logo a {height: 60px; line-height: 60px; background-size: 70%; background-position: center left;}
  .scrolled #header #logo a{background-size: 71%;}

}
/*헤드메뉴*/

/*다국어*/
.lang_dd{position: absolute; display: block; right: 0; top: 50%; transform: translateY(-50%);}
.lang_dd .dd_btn{display:flex;align-items:center;gap:20px;padding:10px 20px;border:1px solid #fff;border-radius:50px;background:none;color:#eee;font-size: 16px;;line-height:1;cursor:pointer;transition:box-shadow .2s ease}
.lang_dd .dd_btn .ico{display:block;width:25px;height:25px;background:url(../img/icon_globe.png) center no-repeat;background-size:contain;filter:brightness(0) invert(1)}
.lang_dd .dd_btn:hover{box-shadow:0 4px 14px rgba(0,0,0,.12)}
.lang_dd .dd_list{position:absolute;right:0;top:100%;margin-top:8px; width:100%;background:#fff;border:1px solid #e5e5e5;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.12);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease,visibility .25s}
.lang_dd.active .dd_list{opacity:1;visibility:visible;transform:translateY(0)}
.lang_dd .dd_list a{display:block;padding:12px 16px;color:#111;text-decoration:none;transition:background .2s ease,color .2s ease;font-size: 14px; text-align: center;}
.lang_dd .dd_list a:hover{background:#f5f7fb;color:#000}
.lang_dd .dd_list a[aria-selected="true"]{background:#ffefe6;color:#2f4668;font-weight:700}

.m_lang_dd{position: absolute; display: block; right: 0; bottom: -25%; display: none;}
.m_lang_dd .dd_btn{display:flex;align-items:center;gap:20px;padding:10px 20px;border:1px solid #fff;border-radius:50px;background:none;color:#eee;font-size: 16px;;line-height:1;cursor:pointer;transition:box-shadow .2s ease}
.m_lang_dd .dd_btn .ico{display:block;width:25px;height:25px;background:url(../img/icon_globe.png) center no-repeat;background-size:contain;filter:brightness(0) invert(1)}
.m_lang_dd .dd_btn:hover{box-shadow:0 4px 14px rgba(0,0,0,.12)}
.m_lang_dd .dd_list{position:absolute;right:0;top:100%;margin-top:8px; width:100%;background:#fff;border:1px solid #e5e5e5;border-radius:12px;box-shadow:0 8px 20px rgba(0,0,0,.12);overflow:hidden;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease,visibility .25s}
.m_lang_dd.active .dd_list{opacity:1;visibility:visible;transform:translateY(0)}
.m_lang_dd .dd_list a{display:block;padding:12px 16px;color:#111;text-decoration:none;transition:background .2s ease,color .2s ease;font-size: 14px; text-align: center;}
.m_lang_dd .dd_list a:hover{background:#f5f7fb;color:#000}
.m_lang_dd .dd_list a[aria-selected="true"]{background:#ffefe6;color:#2f4668;font-weight:700}

/* 스크롤 이벤트 */
.scrolled .lang_dd .dd_btn{border:1px solid #2f4668;background:none;color:#2f4668;}
.scrolled .lang_dd .dd_btn .ico{filter: invert(41%) sepia(54%) saturate(2577%) hue-rotate(358deg) brightness(94%) contrast(96%);}

@media screen and (max-width: 960px) {
	.lang_dd{display: none;}
	.m_lang_dd{display:block;}
}
/*다국어*/






/*모바일 오른쪽 메뉴*/
#right-side {background-color:#333;position:fixed; z-index:9999; top:0;right:-400px;max-width:400px; width:100%; height:100%; color:#FFF; padding:30px;-webkit-transition: right .3s ease;-moz-transition: right .3s ease;-ms-transition: right .3s ease;-o-transition: right .3s ease;transition: right .3s ease; box-sizing:border-box; overflow:auto;}
#right-side .side_gnb .call a {text-align:center; display:block;position:relative;background:#6cc043; color:#fff; font-weight:bold; height:5.0em; line-height:5em; border-radius:3px; margin-top:10px; padding:2px 0 4px 0;}
#right-side #btn-close-right-side {position:absolute;top:20px;right:0;color:#fff;width:60px;text-align:center;line-height:40px; font-size:16px; cursor:pointer}
#right-side #btn-close-right-side .fa.fa-times { font-size:18px; padding-top:20px}
.right-side-on #right-side {right:0;}
.right-side-on #wrapper { left:-300px; }
.right-side-on #header { left:-300px; }
.right-side-on #rs-overlay {display:block;}

.quick_menu {width:100%; margin:auto; padding-top:20px}
.quick_menu ul { text-align:center}
.quick_menu li{display:inline-block; margin-left:-3px; width:80px; border-right:1px solid rgba(255, 255, 255, .3)}
.quick_menu li:last-child { border:0} 
.quick_menu li a{display:block; box-sizing:border-box; color:#f5f5f5; letter-spacing:-0.8px; text-align:center; position:relative;  font-size:12px}
.quick_menu li a:hover{color:#fff;backface-visibility:hidden}
.quick_menu li a.on{color:#fff;border-bottom-color:#FF3300;border-bottom-width:2px;border-bottom-style:solid}

.quick_kakao{text-align:center; height:35px; background-color:#ffd800; display:inline-block; clear:both}
.quick_kakao a{display:block;position:relative;background:#ffd800}
.quick_kakao a img{display:block;margin:0 auto}

.side_gnb{position:relative;width:100%;float:left;padding-top:20px;}
.side_gnb p{color:#fff; text-align:center; padding:20px }
.side_gnb .menu-list{display:block;position:relative;border-bottom:1px solid #555; margin-top:60px}
.side_gnb .menu-list>li>a{display:block;position:relative;color:#fff;font-size:15px;line-height:3.8em;padding:0 1.0em;border-top:1px solid #555; text-decoration:none}
.side_gnb .menu-list>li>a i{display:block;position:absolute;top:50%;transform:translateY(-75%) rotate(135deg);-webkit-transform:translateY(-75%) rotate(135deg);right:1.5em;width:5.31%;max-width:32px;border:1px solid #f2f2f2;border-left-width:0;border-bottom-width:0;transition:transform .3s ease;-webkit-transition:-webkit-transform .3s ease;-ms-transition:transform .3s ease}
.side_gnb .menu-list>li.on>a i{-webkit-transform:translateY(-25%) rotate(315deg);transform:translateY(-25%) rotate(315deg)}
.side_gnb .menu-list>li>a i:before{content:"";display:block;position:relative;padding-top:100%}
.side_gnb .depth-2{display:none;}
.side_gnb .depth-2>li { background-color:#ddd}
.side_gnb .depth-2>li>a{display:block;color:#f2f2f2;font-size:1.2em;line-height:3.0em;padding:0 1.5em 0 2.2em;border-bottom:1px solid #fff; color:#000}

@media screen and (max-width:640px) {
   .right_quick { display:none}
}
/*모바일 오른쪽 메뉴*/








/*메인배너*/
.main-carousel{padding:0;position:relative}
.main-carousel .li{height:900px;display:flex;background:#fff;margin-top: 100px;}
.main-carousel .li.split{}

.main-carousel .li .text_area{width:40%;padding:100px 80px 200px;display:flex;flex-direction:column;justify-content:center;background: #f8f8f8;}
.main-carousel .li .text_area h2{font-size:48px;line-height:1.4;font-weight:400;margin:0;color:#000}
.main-carousel .li .text_area h4{margin:15px 0 0;font-size:24px;font-weight:500;color:#000}
.main-carousel .li .text_area p{margin:26px 0 0;font-size:18px;line-height:1.75;color:#333;word-break:keep-all}

.main-carousel .li .image_area{width:60%;background-size:cover;background-position:center}

.main-carousel .img01 .image_area{background-image:url(../img/main_01.jpg)}
.main-carousel .img02 .image_area{background-image:url(../img/main_02.jpg)}

.main-carousel .owl-nav,.main-carousel .owl-dots{display:none}

.visual_ctrl{position:absolute;left:80px;bottom:100px;display:flex;align-items:center;gap:16px;z-index: 999;}
.visual_ctrl .vc_btn{background:none;border:0;font-size:18px;cursor:pointer}
.visual_ctrl .vc_count{font-size:15px}

/* mobile */
@media screen and (max-width:1200px){
.main-carousel .li{flex-direction:column;height:auto}
.main-carousel .li .image_area{width:100%;height:50vh}
.main-carousel .li .text_area{width:100%;padding:40px 20px}
.visual_ctrl{left:20px;bottom:20px}
}

@media screen and (max-width:960px){
.main-carousel .li .text_area h2{font-size: 24px;}
.main-carousel .li .text_area h4{font-size: 18px;}
.main-carousel .li .text_area p{font-size: 16px;}
.main-carousel .li{    margin-top: 60px;}
}

@media screen and (max-width:640px){
.main-carousel .li .text_area{height: 410px;}
}

/*메인배너*/



/* 섹션 공통 */
.content .con{padding: 120px 10px;}
.content .tit a{padding: 10px 20px;border-radius: 7px; display: block; width: 150px; margin:20px auto 0; text-align: center;}
.content .tit a p{font-size: 16px; font-weight: 600;}
.content h3 {font-size: 24px; color: #2b436a; font-weight: 600; line-height: 1.5;font-family: 'BookkMyungjo';margin-bottom: 20px;}
.content h2 {font-size: 48px; margin-bottom: 15px; color: #212121;line-height: 1.5;}
.content p {font-size: 20px; font-weight: 300; color: #666;line-height: 1.5;}

@media screen and (max-width: 960px) {
	.content .con{padding: 50px 10px;}
	.content .tit {margin-bottom: 30px;}
	.content h3 {font-size: 16px; margin-bottom: 10px;}
	.content h2 {font-size: 30px; margin-bottom: 10px;}
	.content p {font-size: 16px;}
}

@media screen and (max-width: 640px) {
	.content .ti {margin-bottom: 30px;}
	.content h3 {font-size: 14px;}
	.content h2 {font-size: 24px;}
	.content p {font-size: 14px;}
}
/* 섹션 공통 */

/*scrolltxt*/
#scrolltxt{padding:15px 0; width: 100%; overflow: hidden; background: #000;}
#scrolltxt .con_pro{position: relative;	width: 2200px; animation: scroll-animation 5s linear infinite;}
#scrolltxt .con_pro h4{font-size:16px; float: left;	width: 220px; letter-spacing: 0; color: #2f4668;}
#scrolltxt .con_pro h4 b{color: #fff;}
@keyframes scroll-animation{
	0%{
	  left: 0;
	}
	100%{
	  left: -220px; /* 텍스트 width와 동일 */
	}
}

@media screen and (max-width:640px){
	#scrolltxt{padding: 10px 0;}
	#scrolltxt .con_pro{position: relative;	width: 1800px; animation: scroll-animation 5s linear infinite;}
	#scrolltxt .con_pro h4{font-size: 14px; width:180px;;}
}
/*scrolltxt*/

/*con00*/
.con00{position:relative;height:100vh;overflow:hidden;background:#000}
.con00 .video_thumb{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(180deg,rgba(0,0,0,.65) 0%,rgba(0,0,0,.7) 60%,rgba(0,0,0,.65) 100%),url(../img/video_thumb.jpg) center/cover no-repeat;z-index:2;transition:all .4s}
.con00:hover .video_thumb{background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.55) 60%,rgba(0,0,0,.65) 100%),url(../img/video_thumb.jpg) center/cover no-repeat}
.con00 .video_wrap{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}
.con00 #ytPlayer{width:100%;height:100%}
.con00 .video_dim{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.4);transition:opacity .4s}
.con00 .video_btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:90px;height:90px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.55);z-index:4;cursor:pointer;transition:all .3s}
.con00 .video_btn:hover{background:#fff;transform:translate(-50%,-50%) scale(1.08)}
.con00 .video_btn.play:hover:after{border-left-color:#000;}
.con00 .video_btn:hover:after{border-left-color:#000}
.con00 .video_btn.play:after{content:'';position:absolute;left:38px;top:30px;border-left:22px solid #fff;border-top:15px solid transparent;border-bottom:15px solid transparent}
.con00 .video_btn.pause:after{content:'';position:absolute;left:30px;top:28px;width:6px;height:34px;background:#fff;box-shadow:18px 0 0 #fff}
.con00 .video_btn.pause:hover:after{background:#000;box-shadow:18px 0 0 #000}
.con00 .video_copy{position:absolute;left:80px;top:90px;z-index:4;color:#fff;transition:opacity .4s}
.con00 .video_label{display:inline-block;font-size:13px;font-weight:500;letter-spacing:3px;color:rgba(255,255,255,.7);margin-bottom:12px}
.con00 .video_copy h2{margin:0;font-size:44px;font-weight:700;line-height:1.25;color:#fff}
.con00.playing .video_thumb{opacity:0;pointer-events:none}
.con00.playing .video_copy{opacity:0}
.con00.playing .video_dim{opacity:.15}

@media screen and (max-width:640px){
  .con00{height: 300px;}
.con00 .video_copy{display: none;}
.con00 .video_copy h2{font-size:28px}
.con00 .video_btn{width:64px;height:64px}
.con00 .video_btn.play:after{left:26px;top:20px;border-left:16px solid #fff;border-top:11px solid transparent;border-bottom:11px solid transparent}
.con00 .video_btn.pause:after{left:22px;top:18px;height:28px;box-shadow:14px 0 0 #fff}
}
/*con00*/

/*con1*/
.content.content1 .con.con1 .con_tit{text-align:center;margin:0 0 50px}
.content.content1 .con.con1 .con_tit p{margin:0;font-size:38px;line-height:1.25;color:#111;font-weight:700}

/* SLIDER VIEW */
.content.content1 .biz_view{position:relative;overflow:hidden}
.content.content1 .biz_track{display:flex;align-items:stretch;gap:40px;transition:transform .55s ease;will-change:transform}

/* SLIDE ITEM */
.content.content1 .biz_item{flex:0 0 65%;position:relative;box-sizing:border-box;transform:scale(.84);opacity:.45;transition:transform .55s ease,opacity .55s ease;cursor:pointer}

/* 높이 지정 */
.content.content1 .biz_item .biz_link{display:block;position:relative;width:100%;height:520px}

/* IMAGE */
.content.content1 .biz_item img{width:100%;height:100%;object-fit:cover;display:block}

.content.content1 .biz_item .biz_copy{
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  padding:40px;
  color:#fff;
  background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.66) 100%);
  opacity:0;
  transition:opacity .3s ease;
  z-index:2;
  height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.content.content1 .biz_item .biz_copy h4,
.content.content1 .biz_item .biz_copy p{
  transform:translateY(60px);
  opacity:0;
  transition:transform .6s ease,opacity .6s ease;
}
.content.content1 .biz_item.is_center .biz_copy{
  opacity:1;
}

.content.content1 .biz_item.is_center .biz_copy h4,
.content.content1 .biz_item.is_center .biz_copy p{
  transform:translateY(0);
  opacity:1;
}
.content.content1 .biz_item.is_center .biz_copy h4{transition-delay:.1s}
.content.content1 .biz_item.is_center .biz_copy p{transition-delay:.2s}


.content.content1 .biz_item .biz_copy h4{margin:0 0 10px;font-size:28px;line-height:1.35;font-weight:700;text-align:center}
.content.content1 .biz_item .biz_copy p{margin:0;font-size:18px;line-height:1.7;opacity:.8;color:#fff;text-align:center}
.content.content1 .biz_item .biz_copy p.sm{margin-top:10px;font-size:13px;opacity:.85}

/* CENTER ACTIVE */
.content.content1 .biz_item.is_center{transform:scale(1);opacity:1;cursor:auto}
.content.content1 .biz_item.is_center .biz_copy{opacity:1;transform:translateY(0)}

/* CENTER IMAGE DARK OVERLAY */
.content.content1 .biz_item.is_center::before{
  content:"";
  position:absolute;
  left:0;top:0;
  width:100%;height:100%;
  background:rgba(0,0,0,.55);
  z-index:1;
}

/* LINK ACTIVE ONLY CENTER */
.content.content1 .biz_item:not(.is_center) .biz_link{pointer-events:none}
.content.content1 .biz_item.is_center .biz_link{pointer-events:auto}

/* SLIDE NAV */
.content.content1 .pro{margin:26px auto 0;max-width:1060px;background:#263a63;border-radius:999px;padding:10px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.content.content1 .pro a{display:flex;align-items:center;justify-content:center;padding:5px 15px;border-radius:999px;text-decoration:none;transition:background .2s ease}
.content.content1 .pro a p{margin:0;font-size:18px;color:#cfe0ff;transition:color .2s ease}
.content.content1 .pro a:hover{background:rgba(255,255,255,.08)}
.content.content1 .pro a.is_on{background:#fff}
.content.content1 .pro a.is_on p{color:#1a2a4a;font-weight:700}
/* PLUS ICON OVERLAY */
.content.content1 .biz_item .biz_link{position:relative}
.content.content1 .biz_item .biz_link::after{
  content:"+";
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%) scale(.6);
  width:80px;height:80px;
  border-radius:50%;
  border:2px solid #fff;
  color:#fff;
  font-size:42px;
  font-weight:300;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(4px);
  opacity:0;
  transition:all .4s ease;
  z-index:3;
}

/* CENTER ONLY + HOVER */
.content.content1 .biz_item.is_center .biz_link:hover::after{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}


/* RESPONSIVE */
@media (max-width:1200px){
  .content.content1 .biz_track{gap:24px}
  .content.content1 .biz_item .biz_link{height:420px}
}

@media (max-width:960px){
	.content.content1 .pro a p{    font-size: 14px;}
	.content.content1 .con.con1 .con_tit{margin: 0 0 20px;}
	  .content.content1 .con.con1 .con_tit p{font-size:30px}
  .content.content1 .biz_track{gap:16px}
  .content.content1 .biz_item{flex-basis:100%}
  .content.content1 .biz_item .biz_link{height:360px}
    .content.content1 .biz_item .biz_copy{padding:22px 18px 16px}
  .content.content1 .biz_item .biz_copy h4{font-size:18px; text-align: left;}
  .content.content1 .biz_item .biz_copy p{font-size: 16px;; text-align: left;}
  .content.content1 .pro{border-radius: 0;    margin: 10px auto 0;}
}

@media (max-width:520px){
  .content.content1 .biz_item .biz_link{height:300px}
  .content.content1 .biz_item .biz_copy p{display: none;}

}
/*con1*/


/*con2*/
.content.content2{padding:0}
.content.content2 .con.con2{max-width:100%;padding:0}
.content.content2 .con_pro ul{display:flex;gap:0;list-style:none;margin:0;padding:0}
.content.content2 .con_pro ul li{position:relative;flex:1;min-height:861px;overflow:hidden}
.content.content2 .con_pro ul li:nth-child(1){background:url(../img/con2_01.jpg) center/cover no-repeat}
.content.content2 .con_pro ul li:nth-child(2){background:url(../img/con2_02.jpg) center/cover no-repeat}
.content.content2 .con_pro ul li:nth-child(3){background:url(../img/con2_03.jpg) center/cover no-repeat}
.content.content2 .con2_link{display:block;width:100%;height:100%;text-decoration:none;color:inherit}
.content.content2 .con2_in{position:relative;width:100%;height:100%;z-index:2}

/* BLUR LAYER (before hover) */
.content.content2 .con_pro ul li:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:inherit;filter:blur(1px);transform:scale(1.02);opacity:1;transition:opacity .45s ease;z-index:0}

/* DARK OVERLAY (hover) */
.content.content2 .con_pro ul li:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.18);transition:background .45s ease;z-index:1}

/* big title (default) */
.content.content2 .con2_big{position:absolute;left:50px;bottom:42px;z-index:2;font-size:64px;line-height:1;font-weight:500;letter-spacing:.01em;color:rgba(255,255,255,.78);font-family:serif;transform:translateY(0);transition:transform .45s ease,color .45s ease,opacity .45s ease,left .45s ease,right .45s ease,top .45s ease,bottom .45s ease;will-change:transform}

/* vertical helper (default) */
.content.content2 .con_pro ul li .con2_vert{position:absolute;right:34px;top:10%;z-index:2;font-size:56px;line-height:1;font-weight:600;letter-spacing:.02em;color:rgba(255,255,255,0);font-family:serif;writing-mode:vertical-rl;text-orientation:mixed;transform:translateY(-50%);pointer-events:none;transition:opacity .45s ease}

/* copy */
.content.content2 .con_pro ul li .con2_copy{position:absolute;left:50px;bottom:54px;z-index:2;max-width:520px;opacity:0;transform:translateY(18px);transition:opacity .45s ease,transform .45s ease}
.content.content2 .con_pro ul li .con2_copy h4{margin:0 0 14px;font-size:26px;line-height:1.35;font-weight:800;color:#fff}
.content.content2 .con_pro ul li .con2_copy p{margin:0 0 18px;font-size:16px;line-height:1.75;color:rgba(255,255,255,.82)}
.content.content2 .con_pro ul li .con2_btn{display:inline-flex;align-items:center;gap:5px;padding:10px 16px;border:1px solid rgba(255,255,255,.55);border-radius:7px;font-size:14px;letter-spacing:.08em;color:#fff;background:rgba(0,0,0,.20);backdrop-filter:blur(2px)}
.content.content2 .con_pro ul li .con2_btn i{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;border-radius:50%; font-style:normal;font-size:14px;line-height:1}

/* ✅ hover : blur off + dark on + copy in + big title move */
.content.content2 .con_pro ul li:hover:after{opacity:0}
.content.content2 .con_pro ul li:hover:before{background:rgba(0,0,0,.62)}
.content.content2 .con_pro ul li:hover .con2_copy{opacity:1;transform:translateY(0)}

/* 핵심: 대타이틀이 오른쪽 세로로 이동 */
.content.content2 .con_pro ul li:hover .con2_big{left:auto; right:34px;top:37%;transform:translateY(-50%);writing-mode:vertical-rl;text-orientation:mixed;font-size:64px;font-weight:600;color:rgba(255,255,255,.40);opacity:1}

/* 중복 방지: hover 때 helper는 숨김 */
.content.content2 .con_pro ul li:hover .con2_vert{opacity:0}

/* =========================
   RESPONSIVE
========================= */

@media (max-width:1500px){
	.content.content2 .con2_big{font-size: 34px;}
	.content.content2 .con_pro ul li:hover .con2_big{font-size: 34px;}
}
@media (max-width:1200px){
  .content.content2 .con_pro ul li{min-height:460px}
  .content.content2 .con2_big{left:34px;bottom:34px;}
  .content.content2 .con_pro ul li .con2_copy{left: 20px; right: 20px;max-width:none}
  .content.content2 .con_pro ul li .con2_vert{right:22px;font-size:46px}
  .content.content2 .con_pro ul li:hover .con2_big{right:22px;}
    .content.content2 .con_pro ul li .con2_copy h4{font-size:18px}
  .content.content2 .con_pro ul li .con2_copy p{font-size:14px}
}
@media (max-width:960px){
  .content.content2 .con_pro ul{flex-direction:column}
  .content.content2 .con_pro ul li{min-height:360px}
  .content.content2 .con_pro ul li .con2_vert{display:none}
  .content.content2 .con_pro ul li:hover .con2_big{right:20px;font-size:26px}
  .content.content2 .con_pro ul li .con2_copy{position: static;        padding: 80px 10px; opacity: 1;}
  .content.content2 .con2_big{        left: 10px;  top: 34px;}

}
@media (max-width:520px){
  .content.content2 .con_pro ul li{min-height:320px}
  .content.content2 .con2_big{font-size:28px}
  .content.content2 .con_pro ul li .con2_copy{left:20px;right:20px;bottom:22px}

  .content.content2 .con_pro ul li:hover .con2_big{right:16px;font-size:28px}
}
/*con2*/


/*con3*/
.content .con3{max-width:1400px; margin: 0 auto; text-align: center; }

.content .con3 .tit a{border: 1px solid #333;transition:all 0.3s ease}
.content .con3 .tit a:hover{background:#2f4668;border:1px solid #2f4668;}
.content .con3 .tit a:hover p{color:#fff}
/*con3*/

/*con4*/
.content.content4{background:#2f4668}
.content.content4 .con.con4{width:100%;max-width:100%;padding:0;margin:0;display:flex;min-height:420px}
.content.content4 .con.con4 .left{flex:1;position:relative;overflow:hidden}
.content.content4 .con.con4 .left img{width:100%;height:100%;object-fit:cover;display:block}
.content.content4 .con.con4 .right{flex:1;display:flex;flex-direction:column;justify-content:center;gap:28px;padding:60px 70px;color:#fff}
.content.content4 .con.con4 .tit h2{margin: 0; font-size: 26px; line-height: 1.45; font-weight: 500; letter-spacing: -.02em; color: #fff; margin-bottom: 20px;}
.content.content4 .con.con4 .tit a{width: 200px; margin: 0; padding: 0;}
.content.content4 .con.con4 .tit a.go p{margin:0;align-items:center;gap:10px;padding:12px 18px;border:1px solid rgba(255,255,255,.45);border-radius:8px;color:#eee; background:rgba(0,0,0,.10)}
.content.content4 .con.con4 .tit a.go p span{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;border-radius:50%; font-weight:700;line-height:1}
.content.content4 .con.con4 .tit a.go:hover p{background:rgba(0,0,0,.18)}
.content.content4 .con.con4 .cs{display: flex; gap: 20px;}
.content.content4 .con.con4 .cs .label{font-size:18px; color: #fff;    padding-top: 4px;}
.content.content4 .con.con4 .cs .tel{margin:0;font-size:24px;font-weight:800;letter-spacing:.01em}
.content.content4 .con.con4 .cs .tel a{color:#fff;text-decoration:none}
.content.content4 .con.con4 .cs .time{margin:6px 0 0;font-size:16px;opacity:.85; color: #fff;}
.content.content4 .con.con4 .quick{display:flex;gap:10px;flex-wrap:wrap}
.content.content4 .con.con4 .quick a.q{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border:1px solid rgba(255,255,255,.35);border-radius:8px;color:#fff;text-decoration:none;font-size:13px;background:rgba(0,0,0,.10)}
.content.content4 .con.con4 .quick a.q .ic{display:inline-flex;width:18px;height:18px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.35);border-radius:4px;font-size:11px;opacity:.9}
.content.content4 .con.con4 .quick a.q:hover{background:rgba(0,0,0,.18)}

/* =========================
   RESPONSIVE
========================= */
@media (max-width:1200px){
  .content.content4 .con.con4 .right{
    padding:50px 44px;
  }
  .content.content4 .con.con4 .tit{
    flex-direction:column;
    align-items:flex-start;
  }
  .content.content4 .con.con4 .tit h2{
    font-size:24px;
  }
}
@media (max-width:900px){
  .content.content4 .con.con4{
    flex-direction:column;
    min-height:auto;
  }
  .content.content4 .con.con4 .left{
    height:320px;
  }
  .content.content4 .con.con4 .right{
    padding:40px 22px;
  }
  .content.content4 .con.con4 .cs .tel{
    font-size:26px;
  }
}
@media (max-width:520px){
  .content.content4 .con.con4 .left{
    height:240px;
  }
  .content.content4 .con.con4 .tit h2{
    font-size:20px;
  }
  .content.content4 .con.con4 .quick a.q{
    width:100%;
    justify-content:center;
  }
}
/*con4*/

/*서브상단*/
.sub_visual{position:relative;max-width:2560px;margin:0 auto;height:500px;overflow:hidden;background-repeat:no-repeat;background-position:center top}
.sub_visual.visual01 .bg{background-image:url(../img/sub_visual01.jpg)}
.sub_visual.visual02 .bg{background-image:url(../img/sub_visual02.jpg)}
.sub_visual.visual03 .bg{background-image:url(../img/sub_visual03.jpg)}
.sub_visual.visual04 .bg{background-image:url(../img/sub_visual04.jpg)}
.sub_visual.visual05 .bg{background-image:url(../img/sub_visual05.jpg)}
.sub_visual:hover .bg{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}
.sub_visual .title_wrap {display:table; margin:0 auto; height:500px}
.sub_visual .title { max-width:1240px; display:table-cell; vertical-align:middle}
.sub_visual h3{position:relative;z-index:2;font-size:54px;font-weight:600; letter-spacing:-4px; color:#FFF;text-align:center}
.sub_visual h3:after {content:""; display:block; height:1px; width:20px; margin:10px auto; background-color:#fff}
.sub_visual .sub_title{font-size:15px;text-align:center;filter:alpha(opacity=60);position:relative;font-weight:600; color:#FFF;z-index:2;opacity:.8; padding-top:10px}
.sub_visual .cover{position:absolute;top:0;left:0;width:100%;height:100%;background:url(../img/sub_visual_cover.png) center bottom no-repeat;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;min-width:1200px;opacity:.6;z-index:1}
.sub_visual .bg{position:absolute;top:0;left:0;width:100%;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;z-index:0;-webkit-transition:all .5s ease;-moz-transition:all .5s ease;-o-transition:all .5s ease;transition:all .5s ease}

@media screen and (max-width: 640px) {
	.sub_visual { height:400px}
    .sub_visual .title_wrap { max-width:100%; height:400px}
	.sub_visual h3 { font-size:35px}
	.sub_visual .sub_title { font-size:13px}
}
/*서브상단*/



/*서브 하단 네비*/
.category-wrap {width:100%; height:70px; background-color:rgba(255,255,255,.0); clear:both; background-attachment:scroll; position:relative; z-index:3}
.sub_navI_warp { background-color:rgba(0,0,0,0); max-width:1300px; z-index:3; position:relative; margin: -70px auto;}
.all-wrap{max-width:1300px;  height:69px; margin:0 auto;   transition:all .3s ease;}
.all-wrap .loca-wrap{width:100%;margin:0 auto;height:69px}
.all-wrap .loca-wrap .loca-area i{float:left;display:inline-block;width:60px;height:71px; line-height:65px;  color:#555; padding:0; margin-top:0; text-align:center}
.all-wrap .loca-wrap .loca-area{height:69px;float:left;}
.all-wrap .loca-wrap .loca-area > a {display:inline-block;width:54px;height:100%; float:left; line-height:100%; text-align:center;}
.all-wrap .loca-wrap .loca-area > a img {margin-top:17px;}
.all-wrap .loca-wrap .loca-area>ul {float: left;margin:0; padding:0;}
.all-wrap .loca-wrap .loca-area>ul>li{float:left;width:220px;height:70px;position:relative; margin-left:-1px}
.all-wrap .loca-wrap .loca-area>ul>li button{height:69px;width:220px;position:relative;text-align:left; background-image:url(../img/loca_arrow_off.png);background-position-y:50%;background-position-x:100%;background-repeat:no-repeat;-webkit-transition:background .3s ease;-moz-transition:background .3s ease;-o-transition:background .3s ease;-ms-transition:background .3s ease;  border:0;  background-color: inherit; box-sizing: border-box;}
.all-wrap .loca-wrap .loca-area>ul>li button.active{background-image:url(../img/loca_arrow_on.png);background-position-y:50%;background-position-x:100%;background-repeat:no-repeat;}
.all-wrap .loca-wrap .loca-area>ul>li button span {padding-left: 19px;background-color: transparent; color:#fff; font-size:15px}
.all-wrap .loca-wrap .loca-area>ul>li div{overflow:hidden;height:0;position:relative}

.all-wrap .loca-wrap .loca-area>ul>li div ul{display:block;position:absolute;width:100%;left:0;border:1px solid #ddd; background-color:#fff; padding:0}
.all-wrap .loca-wrap .loca-area>ul>li div ul li a{ border-bottom:1px solid #ddd; background:#fff;height:46px;color:#555;line-height:46px;display:block;-webkit-transition:background .3s ease;-moz-transition:background .3s ease;-o-transition:background .3s ease;-ms-transition:background .3s ease;padding-left:19px; font-size:15px; box-sizing:border-box}
.all-wrap .loca-wrap .loca-area>ul>li div ul li a:hover { color:#000; font-weight:bold}
.all-wrap .loca-wrap .share-area {float: right; display:block; padding-top:16px;box-sizing: border-box;}
.all-wrap .loca-wrap .share-area .hide-wrap{width:151px;height:34px;overflow:hidden;float:left}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area{width:151px;height:34px;position:relative;left:200px}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul {overflow: hidden; padding:0; margin:0}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul li {float: left;margin-left: 13px; border-bottom: 1px solid #ddd; cursor:pointer}
.all-wrap .loca-wrap .share-area .hide-wrap .hide-area ul li:first-child {margin-left: 0;}
.all-wrap .loca-wrap .share-area .share-btn{width:34px;height:34px;background-image:url(../img/share_open_bt.png);float:right;text-indent:-9999px;padding-left:18px;box-sizing:unset;background-repeat:no-repeat;background-position-x:right;transition:all .5s ease;     background-color: inherit; border:0; margin-right:20px}
.all-wrap .loca-wrap .share-area .share-btn.active {background-image: url(../img/share_close_bt.png);border-left: 1px solid #fff;}

@media screen and (max-width: 640px) {
    .all-wrap .loca-wrap .loca-area {100%; float:none;}
	.all-wrap .loca-wrap .loca-area > a {width:10%;}
	.all-wrap .loca-wrap .share-area { display:none}
	.all-wrap .loca-wrap .loca-area > ul {width:100%;}
	.all-wrap .loca-wrap .loca-area > ul > li { width:50%}
	.all-wrap .loca-wrap .loca-area > ul > li:first-child { border:0}
	.all-wrap .loca-wrap .loca-area > ul > li button {width:100%; border-right:0}
	.all-wrap .loca-wrap .loca-area i { display:none}
}
/*서브 하단 네비*/




/*서브 기본 상단*/
.content_wrap { width:100%;}
.content_wrap .txtCon {margin:0 auto; padding:60px 20px 50px 20px; font-weight:400; position:relative; clear:both}
.content_wrap .txtCon h1 { margin:0 0 40px 0; font-size:40px; padding:0 0 20px 0; color:#121212; font-weight:bold; letter-spacing:-2px; text-align:center}
.content_wrap .txtboard {font-size:12px}

.content_wrap .sub_title{text-align:center;margin-bottom:50px}
.content_wrap .sub_title h3{margin:50px 0 0;display:inline-block;position:relative;font-size:42px;color:#121212;font-weight:800;letter-spacing:.01em}
@media(max-width:1024px){.content_wrap .sub_title h3{font-size:34px}}
@media(max-width:640px){.content_wrap .sub_title h3{font-size:28px}}

.content_wrap .sub_title h3.dot{padding-bottom:24px}
.content_wrap .sub_title h3.dot::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:6px;height:6px;border-radius:50%;background:#2f4668;box-shadow:-16px 0 0 #2f46687e,16px 0 0 #2f46687e;transition:transform .25s ease}
.content_wrap .sub_title h3.dot:hover::after{transform:translateX(-50%) translateY(-2px)}

@media screen and (max-width: 767px){
.content_wrap .txtCon { padding: 30px 10px 20px 10px;}
}
@media screen and (max-width: 640px) {
   
   .content_wrap .txtCon .sub_title h1 { font-size:32px}
   .content_wrap .txtCon .sub_title {margin-bottom: 50px;}
}

/*서브 기본 상단*/





/*서브 하단 네비*/
.share-area {float: right; display:block; padding-top:16px;box-sizing: border-box;}
.share-area .hide-wrap{width:151px;height:34px;overflow:hidden;float:left}
.share-area .hide-wrap .hide-area{width:151px;height:34px;position:relative;left:200px}
.share-area .hide-wrap .hide-area ul {overflow: hidden; padding:0; margin:0}
.share-area .hide-wrap .hide-area ul li {float: left;margin-left: 13px; cursor:pointer}
.share-area .hide-wrap .hide-area ul li:first-child {margin-left: 0;}
.share-area .share-btn{width:34px;height:34px;background-image:url(../img/share_open_bt.png);float:right;text-indent:-9999px;padding-left:18px;box-sizing:unset;background-repeat:no-repeat;background-position-x:right;transition:all .5s ease;     background-color: inherit; border:0; margin-right:20px}
.share-area .share-btn.active {background-image: url(../img/share_close_bt.png);border-left: 1px solid #fff;}

@media screen and (max-width: 640px) {
    .share-area{ display:none}
}
/*서브 하단 네비*/



/*서브 탭메뉴*/
.tab_navi { width:100%; margin:0 auto;}
.tab_navi ul { text-align:center; padding-bottom:100px;}
.tab_navi li{display:inline-block; margin-left:-5px; margin-right:10px; min-width:17%;}
.tab_navi li a{text-align:center;color:#333; height:50px;line-height:50px;font-size:16px;display:block;background-color:#f2f2f2;  border-radius: 50px; text-decoration:none; padding: 0 15px;}
.tab_navi li a:hover{color:#fff;background-color:#14b6c2}
.tab_navi li a.on{color:#fff;background-color:#14b6c2;font-weight:600}
.tab_navi li:first-child { border-left:0px}
.tab_navi li:last-child { margin-right:0}
/*서브 탭메뉴*/



/*게시판 헤더관리*/
#head-edit-form {display:none;border:2px solid tomato;padding:2em;background-color:#fff;border-radius:6px;}
#head-edit-form h3 { font-size:20px; margin-bottom:20px}
#head-edit-form .line {margin:5px 0; padding-bottom:7px}
#head-edit-form .line label {font-size:14px; color:#930; width:150px; display:inline-block; vertical-align:middle;}
#head-edit-form .line textarea {width:400px;height:100px;line-height:20px;border:1px solid #ccc;}
#head-edit-form .line input[type=text] {border:1px solid #ccc;line-height:20px;height:40px;}
#head-edit-form .line #bo_head_bg_class { width: 150px; height:40px }
#head-edit-form .line #bo_head_sub_title { width: 350px; }
#head-edit-form .btn_submit{width:160px; background: #000; text-decoration: none; display:inline-block; border:0; color: #fff; vertical-align: middle;  padding:15px 0 15px 0; line-height:1.1; cursor:pointer; box-sizing:border-box;}
#btn-mng-head {position:absolute;z-index:100; bottom:2px;right:2px;background-color:tomato; color:#fff; font-size:14px; border:0; height:24px; line-height:24px; padding:0 0.5em; border-radius:12px;}
/*게시판 헤더관리*/



/*내용관리 헤더관리*/
#head-edit-form .line #co_head_bg_class { width: 150px; height:40px }
#head-edit-form .line #co_head_sub_title { width: 350px; }
#head-edit-form .tc {text-align:center; margin-top:1em;}
/*내용관리 헤더관리*/



/*푸터*/
#footer {background-color: #fff; padding: 40px 10px;    border-top: 1px solid #ddd;}
#footer .inner {display: flex;position: relative;    justify-content: space-between;max-width: 1720px;}
#footer .ft_logo {margin-right: 100px;}
#footer .ft_info {text-align: right;}
#footer .inner .ft_info ul {display: flex;     margin: 10px 0;justify-content: end;}
#footer .inner .ft_info ul li {margin-right: 20px; padding-right: 20px; position: relative; font-size: 15px; position: relative;}
#footer .inner .ft_info ul li:last-child {margin-right: 0; padding-right: 0;}
#footer .inner .ft_info ul li::after {position: absolute; content: '|'; color: #2b2b2b; right: 0; top: 50%; transform: translateY(-50%);}
#footer .inner .ft_info ul li:last-child::after {display: none;} 
#footer .inner .ft_info ul li.color a {color: #ddd;}
#footer .inner .ft_info ul li a {color: #666;font-size: 16px;}
#footer .inner .ft_info .ft_txt p {color: #666; font-weight: 300; line-height: 26px;font-size: 16px;}
#footer .inner .ft_info .ft_txt p span {margin-right: 20px;}
#footer .inner .ft_info .ft_txt p span:last-child {margin-right: 0;}
#footer .inner .ft_info .ft_txt p span b {color: #666; font-weight: 500;}
#footer .inner .ft_info .copyright {font-size: 14px; color: #666; font-weight: 500;}
#footer .inner .ft_info .copyright a {font-weight: 600;}

#footer .ft_btn{position: absolute; right: 0;}
#footer .ft_btn a{border: 1px solid #fff;transition:all 0.3s ease;display: block; padding: 10px 30px; border-radius: 100px;}
#footer .ft_btn a:hover{background:#2f4668;border:1px solid #2f4668;}
#footer .ft_btn a p{color: #fff;font-size: 16px;}

@media screen and (max-width: 960px) {
	#footer {padding: 40px 10px;}
	#footer .inner {flex-direction: column;}
	#footer .ft_logo {margin-right: 0; margin-bottom: 10px;}
	#footer .ft_logo img{max-width: 40%;}
	#footer .inner .ft_info ul {flex-wrap: wrap; line-height: 24px;justify-content: flex-start;}
	#footer .inner .ft_info ul li {margin-right: 15px; padding-right: 15px; font-size: 14px;}
	#footer .ft_info{text-align: left;}
}

@media screen and (max-width: 640px) {
	#footer .inner .ft_info .ft_txt p {font-size: 14px;}
	#footer .inner .ft_info .copyright {font-size: 12px;}
	#footer .inner .ft_info ul li a{font-size: 14px;}
	#footer .inner .ft_info .ft_txt p:nth-of-type(1){font-size: 14px;}
	#footer .ft_btn a{padding: 5px 20px;}
	#footer .ft_btn a p{font-size: 14px;}
}
/*푸터*/



/* 푸터팝업*/
.tl_pop_con{background:#fff;} 
.tl_pop_con h2.f_pop_tit{width:100%;height:80px;line-height:80px;background:#076aa3;font-size:20px;color:#fff;}
.tl_pop_con h2.f_pop_tit img {display:inline-block;margin-left:50px;margin-right:5px;margin-top:-10px;width:120px;}
.tl_pop_con h2.f_pop_tit span {display:inline-block; padding-left:50px;}
.f_pop_wrap {line-height:23px;text-align:justify;word-break:break-all;font-size:15px;overflow-y:auto;}
.f_pop_wrap strong {color:#00a19a;font-weight:normal;}
.f_pop_wrap p { color:#333; padding:40px 50px; line-height:1.6;}
.mfp-close:after { content: ''; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: url("../img/btn_close.png") no-repeat center center; -webkit-transition: -webkit-transform 300ms; transition: -webkit-transform 300ms; transition: transform 300ms; transition: transform 300ms, -webkit-transform 300ms; border-radius: 50%; }
.mfp-close { width: 40px; height: 40px; text-indent: -999px;opacity: 1; overflow: hidden; background-color:transparent; border:0; }
button.mfp-close:hover:after { -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); }
/* 푸터팝업*/



/*회원가입*/
#fregister { max-width:1200px; margin:0 auto; padding:20px 0}
#fregisterform { max-width:1200px; margin:0 auto; padding:20px 0}
/*회원가입*/



@media screen and (max-width: 960px) {
    /*공통*/
    #open-button{position:fixed;z-index:10000;right:15px;padding-top:18px;width:75px; height:80px;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;transition:all .3s ease-out;cursor:pointer;display:block; }
	#open-button .navicon-line{position:absolute;width:20px;height:2px;border-radius:1px;background:#000000;-webkit-transition:all .7s ease-out;-moz-transition:all .7s ease-out;-o-transition:all .7s ease-out;transition:all .7s ease-out}
	#open-button .nl1 {top: 11px;right: 10px; width:30px;}
	#open-button .nl2 {top: 19px;right: 10px; width:24px;}
	#open-button .nl3 {top: 27px;right: 10px; width:30px;}
	#open-button.on>div>div{transform:rotate(225deg);-ms-transform:rotate(225deg);-webkit-transform:rotate(225deg);width:25px;position:absolute;top:15px;right:10px;margin:0;padding:0;background-color:#fff;}
	#open-button.on>div>div:first-child{transform:rotate(135deg);-ms-transform:rotate(135deg);-webkit-transform:rotate(135deg)}
	#open-button.scrolled .navicon-line {background-color: #333;}
	#open-button.on.scrolled >div>div{background-color:#fff;}
	/*공통*/
}

@media screen and (max-width: 640px) {
#open-button {height: 60px; padding-top: 10px;}
}