@charset "utf-8";

/*** Main_Common ***/
.inner {width: 100%; max-width:1320px; margin: 0 auto; }
.ft_m {font-family: 'Montserrat'; letter-spacing: 0; font-weight: 600;}

/** Mv_sec **/
.mv_sec {position:relative; padding-top: 119px; overflow: hidden; height: 709px;}
.mv_sec .owl-theme .item {height: 709px; overflow: hidden;}
.mv_sec .owl-theme img {width: 100%; height: 100%;}
.mv_sec .mv_info {position:absolute;left:50%;top:63%; margin-top:-225px;color:#fff; text-align: left; margin-left:-640px; z-index: 50;}
.mv_sec .mv_info .txt1 {font-size: 15px; color: #fff; opacity: 0}
.mv_sec .mv_info .txt2 {font-size: 75px; color: #fff; padding: 6px 0 17px; line-height: 1; font-weight: 800; opacity: 0}
.mv_sec .mv_info .txt3 {font-size: 18px; color: #fff; padding-bottom: 10px; opacity: 0}
.mv_sec .mv_info .txt4 {font-size: 18px; color: #fff; line-height: 1.55; font-weight: 300; opacity: 0}

/* 메인효과 */
.mv_sec .owl-theme .item > img.on {transform: scale(1.1); transition: 3s;}
.mv_sec .mv_info .txt1.on {animation: an1 2s 1s forwards; transform:translateY(-20px); }
.mv_sec .mv_info .txt2.on {animation: an2 2.5s 1.2s forwards; transform:translateY(-20px);}
.mv_sec .mv_info .txt3.on {animation: an3 2.5s 1.4s forwards; transform:translateY(-20px);}
.mv_sec .mv_info .txt4.on {animation: an4 2.5s 1.6s forwards; transform:translateY(-20px);}

@keyframes an1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
	transform:translate(0);
  }
}

 @keyframes an2 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
	transform:translate(0);
  }
}
  @keyframes an3 {
  0% {
    opacity: 0;
	
  }
  100% {
    opacity: 1;
	transform:translate(0);
  }
}
  @keyframes an4 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
	transform:translate(0); 
  }
}
.owl-theme.mv_list .owl-dots .owl-dot {display: block; height: 60px;}
.owl-theme.mv_list .owl-nav.disabled+.owl-dots {position:absolute;bottom:36% !important; width:auto !important; line-height:0; right: 108px; z-index:10; }
.owl-theme.mv_list .owl-nav.disabled+.owl-dots:before {content: '01'; display: block; color: #fff; font-size: 15px; font-family: 'Montserrat'; position: absolute;  top: -25px; left: -6px; font-weight: 600;}
.owl-theme.mv_list .owl-nav.disabled+.owl-dots:after {content: '03'; display: block; color: #fff; font-size: 15px; font-family: 'Montserrat'; position: absolute;  bottom: -25px; left: -6px; font-weight: 600;}
.owl-theme.mv_list .owl-dots .owl-dot span {position: relative;width:2px;height:60px;background: rgba(255,255,255,0.3); opacity:1;transition:background 0.4s; border-radius: 0; margin: 0;}
.owl-theme.mv_list .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {width: 2px; height: 60px; background: #fff !important; }

.msc_box .owl-nav {display: block !important; position: static !important;}
.mv_sec .mv_info .main_btn {margin-top: 70px;}
.mv_sec .mv_info .main_btn li{position: relative;display: inline-block; width: 207px;text-align: center; margin-left: 10px; z-index: 2;border: 2px solid #fff;transform: skew(-30deg);  transition: all 0.4s; ;}
.mv_sec .mv_info .main_btn li:nth-child(2) {background-color: #fff;}
.mv_sec .mv_info .main_btn li:nth-child(2) a {color: #4b4955;}
.mv_sec .mv_info .main_btn li:nth-child(2):hover {background-color: transparent;}
.mv_sec .mv_info .main_btn li:nth-child(2):hover a {color: #fff;}
.mv_sec .mv_info .main_btn li:nth-child(1):hover {background-color: #fff;}
.mv_sec .mv_info .main_btn li:nth-child(1):hover a {color: #4b4955;}
.mv_sec .mv_info .main_btn a{transform: skew(30deg);font-size: 20px;color: #fff; padding: 20px 0;}
.btm_arr {position: absolute; left: 50%; transform: translateX(-50%);bottom: 0;animation:ico_Move 3s infinite; z-index: 99;}
.btm_arr span {font-size: 14px; color: #fff; letter-spacing: -0.02em;}
.btm_arr p {position: relative; display: block; width: 1px; height: 50px; background-color: rgba(255,255,255,0.3); overflow: hidden; margin: 15px auto 0;}
.btm_arr p:after {content: ''; display: block; width: 1px; height: 25px; background-color: #fff;  position: absolute; left: 0; top: -25px; animation: scr_down 2s cubic-bezier(0.26, 0.35, 0.68, 0.85) infinite; }

@keyframes scr_down {
  from { top:-25px}
  to { top:65px}
}
/**********/
/**공통**/
.tit_b {text-align: center;}
.tit_b h3 {font-size: 50px; padding-bottom: 7px; font-weight: 800; letter-spacing: -0.01em;}
.tit_b p {position: relative; font-size: 18px; line-height: 1.625;}
.pr_0 {padding-right: 0;}
.mr_0 {margin-right: 0;}

/*top_info*/
.top_info article {width: 50%; float: left;}
.top_info article .inner {width: 660px;}
.top_info article.tpo1 {background: #007aec; }
.top_info article.tpo1 .inner {float: right;  height: 120px; display: table;}
.top_info article.tpo1 .inner h3 {color: #fff; font-size: 30px; display: table-cell; width: 59%; vertical-align: middle; margin-right: 95px; font-weight: 700; letter-spacing: -0.01em;}
.top_info article.tpo1 .inner h3 > span {font-family: 'Noto Sans Korean'; color: #fff; font-size: 18px; display: inline-block; vertical-align: middle; margin-right: 26px; font-weight: 400;}
.top_info article.tpo1 .inner .dl_box {display: table-cell; vertical-align: middle;}
.top_info article.tpo1 .inner dl dt {position: relative; font-size: 16px; color: #fff; display: inline-block;  vertical-align: top; padding-left: 10px; padding-right: 13px; line-height: 1.5}
.top_info article.tpo1 .inner dl dt:before {content: ''; display: block; width: 3px; height: 3px; background: #fff; position: absolute; left: 0; top:10px;}
.top_info article.tpo1 .inner dl dd {font-size: 16px; color: #fff; display: inline-block;  vertical-align: top; font-weight: 300;line-height: 1.5} 
.top_info article.tpo2 {background: #f1f1f1;}
.top_info article.tpo2 .inner {float: left; padding: 50px 0 50px 50px;}
.top_info article.tpo2 .inner ul li {position: relative; float: left; color: #606060;  margin-right: 40px;}
.top_info article.tpo2 .inner ul li:last-child {margin-right: 0; padding-left: 70px;}
.top_info article.tpo2 .inner ul li:nth-child(1) a {position: relative; width: 100%; display: block; padding-left: 70px; color: #606060;}
.top_info article.tpo2 .inner ul li:nth-child(1) a:before {content: ''; display: block; width: 52px; height: 52px; position: absolute; left: 0; top: -15px;background: url(../images/main/online_icon.png) no-repeat center left;}
.top_info article.tpo2 .inner ul li:nth-child(2):before {content: ''; display: block; width: 52px; height: 52px; position: absolute; left: 0; top: -15px;background: url(../images/main/kakao_icon.png) no-repeat center left;}
.top_info article.tpo2 .inner ul li span { color: #303030; display: inline-block; margin-right: 10px;}
/** msec01 **/
.msec01 .inner {padding: 120px 0 127px;}
.msec01 .inner ul {margin-top: 50px; text-align: left; font-size: 0;}
.msec01 .inner ul li {display: inline-block; width: 315px; margin-right: 1.5%;  }
.msec01 .inner ul li .mbb {position: relative; overflow: hidden}
.msec01 .inner ul li .mbb:after {content: ''; display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: absolute; left: 0; top: 0; opacity: 0; transition: 0.3s;}
.msec01 .inner ul li .mbb img {transition: 0.3s;}
.msec01 .inner ul li:last-child {margin-right: 0;}
.msec01 .inner ul li .bt_t {padding: 38px 0; text-align: center; width: 100%; height: 150px; box-sizing: border-box; transition: 0.3s;}
.msec01 .inner ul li:nth-child(1) .bt_t {padding: 38px 0; text-align: center; width: 100%; height: 150px; box-sizing: border-box; background: #003d76;}
.msec01 .inner ul li:nth-child(2) .bt_t {padding: 38px 0; text-align: center; width: 100%; height: 150px; box-sizing: border-box; background: #d58700;}
.msec01 .inner ul li:nth-child(3) .bt_t {padding: 38px 0; text-align: center; width: 100%; height: 150px; box-sizing: border-box; background: #00937f;}
.msec01 .inner ul li:nth-child(4) .bt_t {padding: 38px 0; text-align: center; width: 100%; height: 150px; box-sizing: border-box; background: #2c2c2c;}
.msec01 .inner ul li .bt_t p {font-size: 25px; padding-bottom: 3px; color: #fff;}
.msec01 .inner ul li .bt_t span {position: relative; display: block;font-size: 14px; color: #fff;}
.msec01 .inner ul li .bt_t span:after {content: ''; display: block; width: 106px; height: 2px; background: rgba(255,255,255,0.3); position: absolute; right: 0; bottom: 5px; transition: 0.3s;}

	/*msec01 호버효과*/
.msec01 .inner ul li:hover .mbb:after {opacity: 1;}
.msec01 .inner ul li:hover .mbb > img {transform: scale(1.1);}
.msec01 .inner ul li:nth-child(1):hover .bt_t {background: #007aec;}
.msec01 .inner ul li:nth-child(2):hover .bt_t {background: #ec9600;}
.msec01 .inner ul li:nth-child(3):hover .bt_t {background: #00d2b7;}
.msec01 .inner ul li:nth-child(4):hover .bt_t {background: #000000;}
.msec01 .inner ul li:hover .bt_t span:after {background: #fff;}
.msec01 .inner ul li .bt_t span:hover:after {width: 90px;}

/** msec02 **/
.msec02 {background: url(../images/main/msec02_bg.jpg) no-repeat center top; padding: 150px 0;}
.msec02 .tit_b {text-align: right;}
.msec02 .tit_b p {font-size: 16px;}
.msec02 .tit_b .m_btn {width:145px; background: #fff; height: 60px; text-align: center; border-radius: 30px; float: right; margin-top:45px; transition: 0.3s; border: 2px solid #fff; box-sizing: border-box;}

	/*msec02 호버효과*/

.msec02 .tit_b .m_btn a {line-height: 55px; text-align: center; color: #253131; font-size: 14px; transition: 0.3s;}
.msec02 .tit_b .m_btn:hover {background: transparent; border: 2px solid #fff;}
.msec02 .tit_b .m_btn:hover a {color: #fff;}

/** msec03 **/
.msec03 {width: 100%;}
.msec03 .in_box { width: 580px; margin: 0 auto;}
.msec03 article {width: 50%; float: left;}
.msec03 article.at1 {background: url(../images/main/msec03_bg1.jpg) no-repeat center top; padding: 130px 0 150px;}
.msec03 article.at1 ul {font-size: 0;text-align: center; margin-top: 47px;}
.msec03 article.at1 ul li {display: inline-block; text-align: center; margin-right: 65px;}
.msec03 article.at1 ul li:last-child {margin-right: 0;}
.msec03 article.at1 ul li .img_bg {width:146px; height: 146px; line-height: 146px; background: #fff;border-radius: 50%; box-shadow: 1px 1px 15px rgba(0,0,0,0.1); transition: 0.3s;}
.msec03 article.at1 ul li .img_bg .ov2 {opacity: 0;}
.msec03 article.at1 ul li .img_bg > img {vertical-align: middle; }
.msec03 article.at1 ul li:hover .img_bg {background: #1e7aec;}
.msec03 article.at1 ul li:hover .img_bg .ov1 {display: none;}
.msec03 article.at1 ul li:hover .img_bg .ov2 {opacity: 1}
.msec03 article.at1 ul li p {font-size: 25px; padding: 8px 0 6px; color: #303030;}
.msec03 article.at1 ul li span {font-size: 14px; color: #a0a0a0;}
.msec03 article.at2{background: url(../images/main/msec03_bg2.jpg) no-repeat center top; padding: 120px 0 97px;}
.msec03 article.at2 .bd_list {font-size: 0; text-align: center;}
.msec03 article.at2 .tit_b h3 {color: #fff; padding: 18px 0 37px;}
.msec03 article.at2 .bd_list li {display: inline-block; padding-top: 5px; margin-right: 28px;}
.msec03 article.at2 .bd_list li:last-child {margin: 0;}
.msec03 article.at2 .bd_list li.on {position: relative;}
.msec03 article.at2 .bd_list li.on:after {content: ''; display: block; width: 100%; height: 1px; background: #fff; position: absolute; top: 0; left: 0;}
.msec03 article.at2 .bd_list li a {position: relative; color: #fff; font-size: 18px;}
.msec03 article.at2 .bd_list li a:after {content: ''; display: block; width: 1px; height: 15px; background: rgba(255,255,255,0.1); position: absolute; right: 0; top: 3px;}
.msec03 article.at2 .bd_list li:last-child a:after {display: none;}
.msec03 article.at2 .bd_box .list_b {display: table;background: #fff; padding: 30px 0 0 50px; height: 125px; box-sizing: border-box; box-shadow: 1px 1px 30px rgba(0,0,0,0.1); width: 100%;}
.msec03 article.at2 .bd_box .list_b dt {display: table-cell; font-size: 35px; color: #007aec; display: inline-block; vertical-align: middle;}
.msec03 article.at2 .bd_box .list_b dt > span {display: block; font-size: 14px; color: #606060;}
.msec03 article.at2 .bd_box .list_b dd {position: relative; display: table-cell; font-size: 16px; color: #606060; display: inline-block; vertical-align: middle; padding-left: 72px;}
.msec03 article.at2 .bd_box .list_b dd:before {content: ''; display: block; width: 1px; height: 43px;background: #dbdbdb; position: absolute; left: 40px; top: -10px;}
.msec03 article.at2 .bd_box .lb1 {border-top-left-radius: 10px; border-top-right-radius: 10px;}
.msec03 article.at2 .bd_box .lb2 {border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
.msec03 a.vm_btn {font-size: 14px; color: #a0a0a0; text-align: right; margin-top: 16px;}

/*게시물이 없을때*/
.msec03 article.at2 .bd_box .no_board dd:before {display: none;}
.msec03 article.at2 .bd_box .no_board {padding: 0;}
.msec03 article.at2 .bd_box .no_board dd {padding-left: 0; display: block; text-align: center; line-height: 125px;}


	/*msec03 호버효과*/