@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,600,800,900');

body.pop, html.pop {overflow:hidden;}



/* 1: 공통사용
=========================================================================================== */
html {width:100%; height:100%; min-height:100%}
body {width:100%; height:100%; min-height:100%; font-weight:400; font-family:'Poppins','NanumSquare', sans-serif; font-size:16px;}
#wrap {width:100%; min-height:100%; height:100%;}

.hidden {display:none;}
.blind {visibility:hidden;}
.inr-c {position:relative; max-width:1200px; margin:0 50px; margin:0 auto; color:#2c2c2c;}


.view-m {display:none;}


/*폰트*/
.clcase {color:#eda300;}
.clcase2 {color:#000;}

.f-en {font-family:'Dekar', sans-serif;}
.f-en2 {font-family:'NanumSquare', sans-serif;}
.f-en3 {font-family: 'Nanum Myeongjo', serif;}

.fz_s {font-size:11px; font-size:0.6875rem;}
.fz-b1 {font-size:16px; line-height:1.875; color:#555;}
.t_link {color:#1d456d; border-bottom:1px solid #1d456d;}



/*간격*/
.mbty1 {margin-bottom:50px;}
.mbty2 {margin-bottom:20px;}
.mbty3 {margin-bottom:10px;}
.mbty4 {margin-bottom:5% !important;}
.mbty5 {margin-bottom:10% !important;}

.mrty1 {margin-right:1%;}


/*정렬*/
.ta-c {text-align:center !important;}
.ta-l {text-align:left !important;}
.ta-r {text-align:right !important;}

.fl {}
.fl:after {content:""; clear:both; display:block;}
.f-l {float:left;}
.f-r {float:right;}




/*header*/
.header {z-index:11; position:fixed; left:0; top:0; width:100%; height:160px; text-align: right; transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;}
.header:after {content:""; }
.header .inr-c {max-width:none; margin-left: 3%; margin-right: 3%;}

.logo {z-index:0; float: left; display:inline-block; width:170px; height:80px; vertical-align:middle; text-align:left;}
.logo:after {content:""; clear:both; display:block;}
.logo a {display:block; width:100%; height:100%; /*background:url(../images/common/logo.png) 0 center no-repeat;*/  font-weight:700; line-height:80px; font-size:28px; color:#fff; vertical-align:top;}

.btn_gnb {
	z-index:10;
	position: absolute;
	right:3%; top:30px;
	width: 2em; height: 3em;
	cursor: pointer;
	margin: 0 auto;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	display: none;
}
.btn_gnb span {
	position: absolute;
	top: 50%;
	display: block;
	width: 100%;
	height: 0.1em;
	margin-top: -0.05em;
	background-color: #000;
}
.btn_gnb span:after,
.btn_gnb span:before {
	content: "";
	position: absolute; right:0;
	height: 100%;
	background-color: #000;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
.btn_gnb span:after {width: 100%; -webkit-transform: translateY(0.5em); transform: translateY(0.5em);}
.btn_gnb span:before {width: 100%; -webkit-transform: translateY(-0.5em); transform: translateY(-0.5em);}


.btn_close {z-index:10; position:absolute; right:40px; top:40px; width:30px; height:30px;  text-indent:-9999px; background:url('../images/common/btn_close.png') right top no-repeat;}


.gnbbox {display:inline-block; vertical-align:middle; margin-right: 3%;}
.gnb {font-size: 0;}
.gnb li {position: relative; display:inline-block; *display:inline; *zoom:1;}
.gnb li a {display:block; padding:20px 30px; font-weight:600; font-size: 18px; line-height: 40px; color:#fff; }
.gnb li:after {content:""; position: absolute; left: 50%; top: 0; width: 0; height: 5px; -webkit-transition: all 0.2s; transition: all 0.2s;}
.gnb li:hover:after {left: 0; width: 100%; background-color: #fff; }
.gnb li.on:after {left: 0; width: 100%; background-color: #cf1219;}

.gnb li:hover:after {background-color: #cf1219;}


.link-dot span {position: relative; color: #e51e26; font-size: 18px;} 
.link-dot span:after {content:""; position: absolute; right: -6px; top: -6px; width: 6px; height: 6px; background-color: #e51e26; border-radius: 50%;} 


.btn_g_close {display: none;}


.header.scroll {height: 80px; background-color:rgba(0,0,0,.3);}
.header.scroll .logo {height: 80px;}
.header.scroll .gnb li a {line-height: 40px;}


/*footer*/
.footer {clear:both; padding:2% 0; font-size:14px; font-size:0.875rem; line-height: 1.4; color:#606060; background-color:#fff; border-top:1px solid #eee; position:relative; z-index:10;}
.footer p, .footer a {color:#606060;}

.footer .copy p {font-size:13px; text-align:center; color:#999;}

.lst_sns {text-align:center; margin-bottom:20px;}
.lst_sns ul {font-size:0;}
.lst_sns li {display:inline-block; vertical-align:top; margin:0 5px;}
.lst_sns li a {display:block; overflow:hidden; width:60px; height:60px; border:1px solid #eee; border-radius:50%; background-color:#cecece;}
.lst_sns li a:hover {background-color:#aaa;} 

.lst_sns li.foo_1 a:hover {background-color: #cb2129;} 
.lst_sns li.foo_2 a:hover {background-color: #3b5a9a;} 
.lst_sns li.foo_3 a:hover {
	background: rgb(248,176,76);
	background: -moz-linear-gradient(left, rgba(248,176,76,1) 0%, rgba(231,71,71,1) 30%, rgba(183,46,116,1) 52%, rgba(110,67,146,1) 78%, rgba(65,75,162,1) 100%);
	background: -webkit-linear-gradient(left, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	background: linear-gradient(to right, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8b04c', endColorstr='#414ba2',GradientType=1 );
} 


/*팝업*/
.popup_wrap {display:none;}
.popup_dim {position:fixed; left:0; top:0; width:100%; height:100%;  background:rgba(0,0,0,0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50000000,endColorstr=#50000000); z-index:0;}
.popup {
	position:fixed;
	width:94%; max-width:600px; height:auto; 
	margin:0 auto; 
	background-color:#fff;
	z-index:100;
	border:1px solid #ccc;
	border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px;
	overflow:hidden;
}
.popup .cont img {max-width:100%;}
.popup .botm {padding:7px 20px; border-top:1px solid #ccc;}
.popup .botm .b-close:hover {text-decoration:underline;}
.popup .inp_chk {position:relative;}
.popup .inp_chk input {font-size:0; position:absolute; left:0; top:0; width:1px; height:1px; visibility:hidden;}
.popup .inp_chk input + label {color:#000; cursor:pointer;}
.popup .inp_chk input:checked + label {font-weight:700;}





/*버튼*/
.btn-bot {margin-top:40px;}

.btn-pk {
	display:inline-block; *display:inline-block; *zoom:1; padding:8px 10px; 
	border:1px solid #fff; 
	color:#fff; font-size:14px; font-size:0.875rem;
	transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;
}
.btn-pk.bdrs {border-radius:5px;-webkit-border-radius:5px; -moz-border-radius:5px;}

.btn-pk.b {min-width:150px; padding:14px 20px; font-size:18px; font-size:1.125rem; text-align:center;}
.btn-pk.n {padding:14px 20px; font-size:18px; text-align:center;}

.btn-pk.line1 {position: relative;}
.btn-pk.line1:after {content:""; position: absolute; right: -1px; bottom: 3px; width: 10px; height: 1px; background-color: #fff;  transform: rotate(45deg);}

.btn-pk.white {}
.btn-pk.white:hover {background-color:rgba(255,255,255,.5);}

.btn-pk.blue {background-color:#cf1219; border:1px solid #cf1219;}
.btn-pk.blue:hover {background-color:#a90e14;}

.btn-pk.gray {background-color:#666; border:1px solid #666;}
.btn-pk.gray:hover {background-color:#333;}



.c-red {color: #cf1219 !important;}


/*탭*/
.tab {}
.tab ul {font-size: 0;}
.tab li {position: relative; display: inline-block; *display: inline; *zoom: 1; vertical-align: top; }
_::-moz-svg-foreign-content, :root .tab li {float: left;}

.tabcont {display: none;}


.tab.ty1 {padding: 50px 0; margin-bottom: 20px; text-align: center;}
.tab.ty1 li {padding-left: 10px; margin-left: 10px; }
.tab.ty1 li:after {content:""; position: absolute; left: 0; top: 50%; width: 1px; height: 16px; margin-top: -8px; background-color: #cccccc;}
.tab.ty1 li:first-child {padding-left: 0; margin-left: 0;}
.tab.ty1 li:first-child:after {content:none;}
.tab.ty1 li a {font-weight: 700; font-size: 20px; color: #888;}
.tab.ty1 li.on a {color: #000;}


.tab.ty2 {padding: 0 2%; border-bottom: 1px solid #d8d8d8;}
.tab.ty2 li {margin-left: 1%; vertical-align: bottom;}
.tab.ty2 li:first-child {margin-left: 0;}
.tab.ty2 li a {display: block; padding: 12px 10px 12px; margin-top: 8px; font-size: 20px; line-height: 1; color: #fff; text-align: center; border: 1px solid #5c5f64; background-color: #5c5f64;}
.tab.ty2 li.on {margin-bottom: -1px;}
.tab.ty2 li.on a {color: #000; margin-top: 0; padding-top: 20px; background-color: #fff; border-color: #d8d8d8; border-bottom-color: #fff;}

.tab.ty2.n2 li {width: 49.5%;}


.tab.ty3 {margin-bottom: 20px;}
.tab.ty3 ul {display: table; width: 100%; table-layout:fixed;}
.tab.ty3 li {display: table-cell; vertical-align: top; text-align: center;}
.tab.ty3 li a {display: block; padding: 15px 10px; border: 1px solid #067170; font-size: 16px; line-height: 1; color: #067170;}
.tab.ty3 li.on a {color: #fff; background-color: #067170;}




/* 3: 컨텐츠
=========================================================================================== */
/*메인*/
.mainview {z-index:1; position:relative; overflow:hidden; height:100%;}
.mainview .slider {height:100%;}
.mainview .slider .item {overflow:hidden; position:relative; height:100%;}
.mainview .bg-img {z-index:0; position:absolute; left:0; top:0; width:100%; height:100%; }
.mainview .bg-img {
	/*transition: -webkit-transform 1.5s cubic-bezier(.25,.46,.45,.94);
	transition: transform 1.5s cubic-bezier(.25,.46,.45,.94);
	-webkit-transform: scale(1) translateZ(0);
	transform: scale(1) translateZ(0);*/
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	/*background-attachment: fixed;*/
	background-color:#000;
}
.mainview .bg-img img {width:100%;}
.mainview .bg-img .icon {position: absolute; left: 50%; bottom: 0; margin-left: -75%; display: block; width: 150%; opacity:0; }

.mainview .main_title {
	visibility: hidden; z-index:1; position:relative; left: -30%; display:table; width:100%; height:100%;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-ms-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
.mainview .main_title .tit {color:#fff; font-weight:700; font-size:60px; line-height:1.5;}
.mainview .main_title > div {display:table-cell; vertical-align:top; padding: 10% 0 0 5%;}

.video iframe {position:absolute;  left:0; top:0; width:100%; height:100%;}
.mainview .item.active .bg-img {}
.mainview .item.active .main_title {}

.wrap_fix .bg {z-index:1; position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.5); opacity:0;}
.wrap_fix.fixed .slider {position:fixed; left:0; right:0; z-index:-1;}



#container {background-color:#fff; position:relative; z-index:10;}
.section {position: relative; padding:5% 0;}
.section .sec_hd {margin-bottom:40px;}
.section .sec_hd .title {position:relative; padding-top:20px; font-weight: 700; font-size:50px; line-height:1.1; letter-spacing:-0.0325em; color:#333;}
.section .sec_hd .title:after {content:""; position: absolute; left:0; top:0; width:50px; height:3px; background-color:#333;}
.section .sec_hd .t1 {position:relative; padding-bottom:20px; margin-bottom:15px; font-size: 20px; line-height:1.5; color: #333;}
.section .sec_hd .t1:after {content:""; position: absolute; left:0; bottom:0; width:50px; height:3px; background-color:#333;}

.section .sec_hd2 {position: relative; margin-bottom: 40px; text-align:center;}
.section .sec_hd2 .title {position:relative; padding-bottom:15px; font-weight:800; font-size:62px; color:#000;}
.section .sec_hd2 .title > span {position: relative; padding-bottom:20px;}
.section .sec_hd2 .title > span:after {content:""; position: absolute; left:50%; bottom:0; margin-left:-25px; width:50px; height:3px; background-color:#333;} 
.section .sec_hd2 .t1 {margin-top:20px; font-size: 17px; color: #606060;}

.section .sec_hd3 {margin-bottom:20px;}
.section .sec_hd3 .title {font-weight: 700; font-size:30px; line-height:1.1; letter-spacing:-0.0325em; color:#333;}


.section .lft {float:left; width:48%;}
.section .rgh {float:right; width:48%;}
.section .title2 {margin-bottom:20px;}
.section .fs1 {font-size:18px; line-height:1.5;}

.section.bg {background-color: #f8f8f8;}



#main1 {overflow:hidden;}
#main1 .col img {width:100%;}
#main1 .col.c1 {float:left; width:60%;}
#main1 .col.c2 {padding-left:60%; padding-top:6%;}
#main1 .txt {padding:0 5% 10% 10%; text-align:left;}
#main1 .txt  .h1 {margin-bottom:10px; font-weight:700; font-size:30px; color:#333;}
#main1 .txt  .t1 {margin-bottom: 2em; font-size:14px; line-height:1.8; color:#333;}
#main1 .txt  .btn-pk {width:120px; }


#main2 {background-color:#f9f9f9; padding-bottom:0;}
#main2 .map {overflow:hidden; position:relative; width:100%; height:400px;}
#main2 .map .mapin {position:absolute; left:50%; top:50%; margin-left:-1000px; margin-top:-200px; width:2000px; height:400px;}




/*컨텐츠*/
#container.sub {margin-top: 600px;}
.contents {min-height:700px; background-color: #fff;}


#spot {overflow:hidden; position: fixed; left: 0; top: 0; width: 100%; height: 600px; background-color:#000;}
#spot .title {position: relative; z-index: 1; display: table; width: 100%; height: 100%; text-align: center; text-transform: uppercase; letter-spacing:0.5em;}
#spot .title > p {display: table-cell; vertical-align: middle; font-weight: 800; font-size: 120px; color: #fff;}
#spot .title > p span {-ms-text-shadow:0 0 30px #000; -webkit-text-shadow:0 0 30px #000; -moz-text-shadow:0 0 30px #000; text-shadow:0 0 30px #000;}
#spot .bg-img {position: absolute; left: 50%; top: 0; margin-left: -1000px; width: 2000px; height: 100%; background-repeat: no-repeat; background-position: center 0; -webkit-background-size: 100% auto; background-size: 100% auto; background-attachment: fixed;}
#spot .bg-img img {width: 100%;}


.lst_sns.pos {z-index:1; position:absolute; right:20px; bottom:0; width:auto;}
.lst_sns.pos li a {border:0; background-color:rgba(0,0,0,.5)}
.lst_sns.pos li.foo_1 a:hover {background-color: #cb2129;} 
.lst_sns.pos li.foo_2 a:hover {background-color: #3b5a9a;} 
.lst_sns.pos li.foo_3 a:hover {
	background: rgb(248,176,76);
	background: -moz-linear-gradient(left, rgba(248,176,76,1) 0%, rgba(231,71,71,1) 30%, rgba(183,46,116,1) 52%, rgba(110,67,146,1) 78%, rgba(65,75,162,1) 100%);
	background: -webkit-linear-gradient(left, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	background: linear-gradient(to right, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8b04c', endColorstr='#414ba2',GradientType=1 );
}

.mainview  {}
.mainview .lst_sns.pos li a {background-color:#fff;}
.mainview .lst_sns.pos li.foo_1 a:hover {background-color: #cb2129;} 
.mainview .lst_sns.pos li.foo_2 a:hover {background-color: #3b5a9a;} 
.mainview .lst_sns.pos li.foo_3 a:hover {
	background: rgb(248,176,76);
	background: -moz-linear-gradient(left, rgba(248,176,76,1) 0%, rgba(231,71,71,1) 30%, rgba(183,46,116,1) 52%, rgba(110,67,146,1) 78%, rgba(65,75,162,1) 100%);
	background: -webkit-linear-gradient(left, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	background: linear-gradient(to right, rgba(248,176,76,1) 0%,rgba(231,71,71,1) 30%,rgba(183,46,116,1) 52%,rgba(110,67,146,1) 78%,rgba(65,75,162,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8b04c', endColorstr='#414ba2',GradientType=1 );
}

.mainview .lst_sns.pos2 {z-index:1; position:absolute; right:20px; bottom:0; width:auto; right:0; bottom:50%; width:100%; margin-bottom:-60px;}
.mainview .lst_sns.pos2 li {margin:0 3%;}
.mainview .lst_sns.pos2 li img {width:100%;}
.mainview .lst_sns.pos2 li a {background:none; border:5px solid #fff; width:140px; height:140px; }
.mainview .lst_sns.pos2 li.foo_1 a:hover {background:none;}
.mainview .lst_sns.pos2 li.foo_2 a:hover {background:none;}
.mainview .lst_sns.pos2 li.foo_3 a:hover {background:none;}
.mainview .link {position: absolute; right: 3%; top: 50%; z-index: 1; font-weight: 700; font-size: 1.5em; color: #fff;}


.mainview .lst_sns.pos2 li {position:relative;}
.mainview .lst_sns.pos2 li a:hover:before {
  content: "";
  position: absolute;
  width: 130%;
  height: 130%;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation: pulsate1 1s;
  animation: pulsate1 1s;
  -webkit-animation-direction: forwards;
  animation-direction: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: steps;
  animation-timing-function: steps;
  opacity: 1;
  border-radius: 50%;
  border: 5px solid rgba(255, 255, 255, .75);
  top: -20%;
  left: -20%;
  background: rgba(198, 16, 0, 0);
}

@-webkit-keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 30px 10px rgba(255, 255, 255, 0.75), 0px 0px 30px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;

  }
}

@keyframes pulsate1 {
  0% {
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
    opacity: 1;
    box-shadow: inset 0px 0px 30px 10px rgba(255, 255, 255, 0.75), 0px 0px 30px 10px rgba(255, 255, 255, 0.75);
  }
  100% {
    -webkit-transform: scale(1, 1);
    transform: scale(1);
    opacity: 0;
    box-shadow: none;

  }
}


.button30 {
	color: rgba(255,255,255,1);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	position: relative;
	display:block;
}
.button30 span{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
	display:block;
	padding-right:40px;
	}
.button30:hover span{
	letter-spacing: 2px;
	}
.button30:hover{
	border-top-color: rgba(255,255,255,0);
	border-bottom-color: rgba(255,255,255,0);
}
.button30:hover span{
	padding-right:0;
}
.button30::before{
	content: '→';
	position: absolute;
	top: 0;
	right: 0;
	width: 1px;
	height: 100%;
	z-index: 1;
	font-size:40px; line-height:33px; text-indent:-30px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.button30:hover::before{
	content: '';
	position:absolute;
	left:50%;
	margin-left:-20px;
	top:-20px;
	width:40px;
	height:1px;
	background-color:#FFF;
}
.button30::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 1px;
	height: 100%;
	z-index: 1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.button30:hover::after{
	content: '';
	position:absolute;
	left:50%;
	margin-left:-20px;
	top:-20px;
	width:40px;
	height:1px;
	background-color:#FFF;
	-webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	transform: rotate(90deg);
}



/*about us*/
.wrap_about .contents {background: #fff url('../images/sub/bg_about0.jpg') center 0 no-repeat;}
.wrap_about .mb {margin-bottom: 30px;}

.tit-style1 {position:relative;padding-bottom:1em; margin-bottom:1.5em; font-weight: 700; font-size:40px; line-height:1.1; letter-spacing:-0.0325em; color:#333;}
.tit-style1:after {content:""; position: absolute; left:50%; bottom:0; margin-left:-50px; width:100px; height:3px; background-color:#333;}


.box-img {display: table; width: 100%;}
.box-img > div {display: table-cell; vertical-align: middle; font-size: 16px; line-height: 1.8;}
.box-img > div.img {width: 50%; padding-right: 5%;}
.box-img strong {font-weight: 800;}
.box-img .h1 {font-size:20px;}

.lst_txt {margin-top:5%; padding-top:5%; border-top:1px solid #eee;}

.s_tit {position:relative; text-align:center; padding-bottom:20px; margin-bottom:60px; font-size:35px; font-weight:400; color:#000; text-transform:uppercase;}
.s_tit:after {content:""; position:absolute; left:50%; bottom:0; margin-left:-25px; width:50px; height:2px; background-color:#000; }


.txt_about {text-align:center;}
.txt_about .txt.line-bot {padding-bottom:3%; margin-bottom:3%; border-bottom:1px solid #eee;}
.txt_about .h1 {margin-bottom:2em; font-weight:800; font-size:30px; color:#000;}
.txt_about .h2 {position:relative; /*padding-left:10px;*/ margin-bottom:1em; font-weight:800; font-size:16px; color:#333;}
/*
.txt_about .h2:after {
	content:""; 
	position:absolute; left:0; top:50%; margin-top:-6px; 
	width:3px; height:12px; background-color:#333; 
	-webkit-transform: rotate(-20deg); -moz-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg);
}*/
.txt_about .t1 {margin-bottom:5px; font-size:15px; line-height:1.3;}
.txt_about .t1 > span {display:inline-block; *display:inline; *zoom:1;}

.txt_about .video {width:70%; margin:0 auto; margin-bottom:7%; }


/*앨범*/
.lst_prdimg {/*썸네일*/}
.lst_prdimg .lst {overflow: hidden; padding-bottom:10%;}
.lst_prdimg .lst ul {width: 102%;}
.lst_prdimg .lst ul:after {display: block; visibility: hidden; clear: both; height: 0; content: '';}
.lst_prdimg .lst li {float: left; width: 23%; margin-right: 2%; margin-bottom: 2%;}


.lst_prdimg2 {/*썸네일*/}
.lst_prdimg2 .lst {overflow: hidden; padding-bottom:10%;}
.lst_prdimg2 .lst ul {width: 102%;}
.lst_prdimg2 .lst ul:after {display: block; visibility: hidden; clear: both; height: 0; content: '';}
.lst_prdimg2 .lst li {float: left; width: 48%; margin-right: 2%; margin-bottom: 2%;}


/*박스*/
.box-prd .thumb {overflow: hidden;position: relative; background: #ccc url('../images/common/bg_default.png') center center no-repeat; background-size:contain;}
.box-prd .thumb .img {overflow: hidden;}
.box-prd .thumb .img img {
	width: 100%;
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-ms-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
}
.box-prd .thumb .img:hover img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-o-transform: scale(1.1);
}
.box-prd .thumb .ico {position: absolute; left: 0; top: 0; font-size: 0;}
.box-prd .cont {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.box-prd .cont .h1 {font-weight: 600; font-size: 14px; color: black;}
.box-prd .cont .t1 {font-size: 15px; color: #696969;}
.box-prd .cont .t_botm {margin-top: 10px;}

.box-prd.typ1 {text-align: center;}
.box-prd.typ1 .thumb .img {display: block; height: 0; padding-bottom: 135%;}
.box-prd.typ1 .thumb .ico .i_new {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 15px 13px;
	font-size: 12px;
	color: #fff;
	vertical-align: top;
	background-color: black;
}
.box-prd.typ1 .cont {padding: 20px 0px;}
.box-prd.typ1 .cont .h1 {
	line-height: 23px;
	height: 26px;
	line-height: 1.3;
	overflow: hidden;
	-ms-text-overflow: ellipsis;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.box-prd.typ1 .cont .t1 {
	line-height: 23px;
	height: 46px;
	overflow: hidden;
}

.box-prd.typ2 {}
.box-prd.typ2 .thumb {height: 0; padding-bottom: 79%;}
.box-prd.typ2 .thumb .ico .i_new {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	padding: 15px 13px;
	font-size: 12px;
	color: #fff;
	vertical-align: top;
	background-color: black;
}
.box-prd.typ2 .cont {
	position: relative;
	top: -50px;
	max-width: 90%;
	margin: 0 auto;
	padding: 15px 15px;
	background-color: #fff;
}
.box-prd.typ2 .cont .h1 {
	margin-bottom: 5px;
	line-height: 25px;
	height: 50px;
	overflow: hidden;
}
.box-prd.typ2 .cont .t1 {
	line-height: 21px;
	height: 63px;
	overflow: hidden;
}
.box-prd.typ3 {
  border: 1px solid #e8e8e8;
  /*padding: 5px;*/
  position: relative;
  overflow:hidden; min-height:150px
}
.box-prd.typ3 .cont {
  position: relative;
  padding: 15px 20px 10px;
  background-color: #fff;
  text-align:center;
  position: absolute;
  left: 0; bottom: -50%;
  width: 100%; box-sizing:border-box;
  background-color: rgba(0,0,0,.8);
  color: #fff;
  transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;
}
.box-prd.typ3:hover .cont {
	bottom: 0;
}
.box-prd.typ3 .cont .h1 {
  margin-bottom: 5px;
  line-height: 1.4;
  overflow: hidden;
  color: #fff;
}
.box-prd.typ3 .cont .t1 {
  line-height: 23px;
  /*max-height: 69px;*/
  overflow: hidden;
  color: #fff;
}
.box-prd.typ3 .cont .t1.long {
  max-height: none;
  height: 184px;
  overflow: hidden;
}
.box-prd.typ3 .cont .fz {
	font-size:12px;
}
.box-prd.typ3 .cont .t1.h_ty1 {
  line-height: 23px;
  /*max-height: 46px;*/
  overflow: hidden;
}
.box-prd.typ3.pa {
  padding: 20px;
}
.box-prd.typ3.pa .cont {
  text-align: center;
  padding: 20px 0px 0px 0px;
}
.box-prd .thumb.video {
  position: relative;
}
.btn_play {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -23.5px;
	margin-left: -23.5px;
	width: 47px;
	height: 47px;
	text-indent: -9999px;
	background: url(../images/common/ico_play.png) 0 0 no-repeat;
}

.youtube {display: block; position: relative; height: 0; padding-bottom: 59%;}
.youtube iframe {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}


.area_video .box-prd.typ3 .cont .h1 {height: auto;}


.lst_prdimg1 { padding-bottom: 100px;}
.lst_top {margin-bottom: 20px;}
.lst_top ul {overflow:hidden; width: 102%;}
.lst_top li {float: left; width: 23%; margin-right: 2%;}

.lst_botm ul {overflow:hidden;}
.lst_botm li {float: left; width: 49%;}
.lst_botm li:first-child {margin-right: 2%;}
.lst_botm .box-prd.typ3 {display: table; width: 100%; box-sizing:border-box;}
.lst_botm .box-prd.typ3 > div {display: table-cell; vertical-align: middle;}
.lst_botm .box-prd.typ3 > div.thumb {width: 60%;}




/*레슨*/
.tbl_basic {border-top: 1px solid #d4d6d6;}
.tbl_basic .emp {position: relative; display: inline-block;}
.tbl_basic .emp:after {content:"*"; color: #f44e5d;}
.tbl_basic col.subject {width: 150px;}
.tbl_basic col.subject2 {width: 200px;}
.tbl_basic tr {border-bottom: 1px solid #d4d6d6;}
.tbl_basic tbody td {padding: 8px 10px; height: 38px; border-left: 1px solid #d4d6d6;}
.tbl_basic tbody th {padding: 8px 20px; height: 38px; font-weight: normal; color: #000; text-align: left; background-color: #fff;}
.tbl_basic thead th {padding: 8px 20px; height: 38px; border-left: 1px solid #d4d6d6; font-weight: normal; color: #000; text-align: center; background-color: #f6f7f7;}
.tbl_basic th:first-child,
.tbl_basic td:first-child {border-left: 0;}
.tbl_basic .wi1 {width: 200px;}
.tbl_basic .wi2 {width: 100px;}
.tbl_basic .fz {font-size: 13px; font-size: 0.8125rem; color: #777;}

.tbl_basic td .inp_calender {padding: 8px 10px; border-top: 1px dotted #d4d6d6;}
.tbl_basic td .inp_calender:first-child {border-top: 0;}


.tbl_basic table.list td {text-align: center;} 
.tbl_basic table.list td.subject {text-align: left;}

.tbl_basic table.list td .end {color: #037172;}


.map_lesson {overflow:hidden; position: relative; width: 100%; height: 398px; border: 1px solid #cecece;}
.map_lesson .map {position:absolute; left:50%; top:50%; margin-left:-1000px; margin-top:-200px; width:2000px; height:400px;}



.lst_faq {border-top: 2px solid #000;}
.lst_faq li {border-bottom: 1px solid #cecece; }
.lst_faq .tit {display: block; padding: 0 20px; font-weight: 700; font-size: 20px; color: #000; background: url('../images/common/ico_arr1.png') 98% center no-repeat;}
.lst_faq .tit span.ico_q {display: block; padding: 20px 0 20px 60px; background: url('../images/common/ico_bbsview_q.png') 0 10px no-repeat;}
.lst_faq .box {display: none; min-height:100px; border-top: 1px solid #cecece; background-color: #f8f8f8; padding: 30px 20px; font-size: 15px;}


.tbl_q {}
.tbl_q .col {margin-bottom: 10px;}
.tbl_q .inp_txt,
.tbl_q .textarea {font-size: 16px; font-family: inherit;}





/*contact*/
.map {overflow:hidden; position: relative; height: 598px; border: 1px solid #ddd;}
.mapin {position: absolute; left: 50%; top: -1px; margin-left: -1000px; width: 2000px; height: 600px;} 


.lst_contact {}
.lst_contact li {position:relative; margin-bottom:20px;}
.lst_contact li label {display:block; margin-bottom:0.5em; padding-left:15px; font-weight:600; font-size:20px; }
.lst_contact li label:after {content:""; position:absolute; left:0; top:0; width:10px; height:10px; background-color:#333; border-radius:50%;}
.lst_contact li input[type="text"] {width:100%; height:50px;}
.lst_contact li textarea {width:100%; height:200px;}

.btn-bot {text-align:;}
.btn-bot > * {margin:0 5px;}
.btn-bot .btn-pk {width:150px; }



.player {z-index:100; position:fixed; right:5%; bottom:5%;}
.player .btn_player {position:relative; z-index:1;}
.player .list {display:none; position:fixed; right:5%; bottom:5%; margin-bottom:200px;}
.player .list iframe {position:relative; z-index:1;}
.bg_dim {position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,.8);}


/************************************************************************************* 반응형 ***************************************/

@media (min-width:841px){
	.view-m {display:none;}

	.gnbbox {display:inline-block !important;}
}

@media (max-width:1280px){
	.inr-c {margin-left: 3.15%; margin-right: 3.15%;}

}


@media (max-width:1080px){
	.logo {height: 90px;}
	.gnb li a {line-height: 50px;}

	.box-img {display: block;}
	.box-img > div {display: block; width: 100%;}
	.box-img > div.img {width: 100%; padding-right: 0; margin-bottom: 5%; text-align: center;}


	.lst_prdimg .lst li {width: 31.3%;}

}


.video-background {
  background: #000;
  position: fixed;
  top: 0; right: 0; bottom: 0; left: 0;
  z-index: -99;
}
.video-background:after {
	content:"";
	position:absolute; left:0; top:0;
	width:100%; height:100%; background-color:rgba(0,0,0,.3);
}
.video-foreground,
.video-background iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
#vidtop-content {
	top: 0;
	color: #fff;
}
.vid-info { position: absolute; top: 0; right: 0; width: 33%; background: rgba(0,0,0,0.3); color: #fff; padding: 1rem; font-family: Avenir, Helvetica, sans-serif; }
.vid-info h1 { font-size: 2rem; font-weight: 700; margin-top: 0; line-height: 1.2; }
.vid-info a { display: block; color: #fff; text-decoration: none; background: rgba(0,0,0,0.5); transition: .6s background; border-bottom: none; margin: 1rem auto; text-align: center; }
@media (min-aspect-ratio: 16/9) {
  .video-foreground { height: 300%; top: -100%; }
}
@media (max-aspect-ratio: 16/9) {
  .video-foreground { width: 300%; left: -100%; }
}
@media all and (max-width: 600px) {
.vid-info { width: 50%; padding: .5rem; }
.vid-info h1 { margin-bottom: .2rem; }
}
@media all and (max-width: 500px) {
.vid-info .acronym { display: none; }
}


/*.mov {position:relative; opacity:.7;}*/
.item .bg-img:after {
	content:"";
	position:absolute; left:0; top:0;
	width:100%; height:100%; background-color:rgba(255,255,255,.3);
}
.video-js {width:100% !important; height:100% !important; min-width:100%; min-height:100%;}