@charset "UTF-8";
@import url('font.css');

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, input,
blockquote, pre, abbr, address, cite, code, del, dfn, em, img,
ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, footer, header, hgroup,
menu, nav, section, summary, time, mark, audio, video, button {margin:0; padding:0;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block;}
li {list-style-type:none;}
img, fieldset, iframe {border:0; border:none;}
table {border-collapse:collapse; border-spacing:0; width:100%;}
caption {display:none;}
caption, th, td {vertical-align:middle;}
legend {color:#000;}
img {max-width:100%; vertical-align:middle;}
li img, dd img {vertical-align:middle;}
input, select,textarea {vertical-align:middle;}
abbr, acronym {border-bottom:1px dotted; cursor: help;}
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
em, i, address {font-style:normal;}
a {color:#000; text-decoration:none;}


input[type="checkbox"],
input[type="radio"] {
	margin-right:5px;
}

input[type="submit"],
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="search"],
textarea {
	-webkit-appearance:none; 
}

input[type="submit"],
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="search"] {
	height:35px;
}

input[type="submit"],
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
input[type="tel"],
input[type="search"],
textarea,
select {
	font-family:inherit;
	font-size:100%;
	line-height:1;
	color:#262626;
	padding:10px;
	border:1px solid #cacaca; 
}

textarea {
	width:100%; height:100px;
	resize:none;
	box-sizing:border-box;
}

input[type=button], button {
	cursor:pointer;
	background:none;
	border:0;
	font-family:inherit;
	vertical-align:middle; 
 }

 button span {position:relative;}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal; 
}


input::-webkit-input-placeholder {color:#c9c9c9;}
input:-moz-placeholder {color:#c9c9c9;}
input::-moz-placeholder {color:#c9c9c9;}
input:-ms-input-placeholder {color:#c9c9c9;}

input::-moz-selection {color:#000;}
input::selection {color:#000;}

textarea::-webkit-input-placeholder {color:#c9c9c9;}
textarea:-moz-placeholder {color:#c9c9c9;}
textarea::-moz-placeholder {color:#c9c9c9;}
textarea:-ms-input-placeholder {color:#c9c9c9;}


input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
button {outline:0;}



/*기본 설정값*/
.mb0 {margin-bottom:0 !important;}.mb5 {margin-bottom:5px !important;}.mb10 {margin-bottom:10px !important;}.mb15 {margin-bottom:15px !important;}.mb20 {margin-bottom:20px !important;}.mb25 {margin-bottom:25px !important;}.mb30 {margin-bottom:30px !important;}.mb35 {margin-bottom:35px !important;}.mb40 {margin-bottom:40px !important;}.mb45 {margin-bottom:45px !important;}.mb50 {margin-bottom:50px !important;}.mb55 {margin-bottom:55px !important;}.mb60 {margin-bottom:60px !important;}.mb65 {margin-bottom:65px !important;}.mb70 {margin-bottom:70px !important;}.mb75 {margin-bottom:75px !important;}.mb80 {margin-bottom:80px !important;}.mb85 {margin-bottom:85px !important;}.mb90 {margin-bottom:90px !important;}.mb95 {margin-bottom:95px !important;}.mb100 {margin-bottom:100px !important;}
.mr20 {margin-right:20px !important;}
.mt0 {margin-top:0 !important;}.mt5 {margin-top:5px !important;}.mt10 {margin-top:10px !important;}.mt15 {margin-top:15px !important;}.mt20 {margin-top:20px !important;}.mt25 {margin-top:25px !important;}.mt30 {margin-top:30px !important;}.mt35 {margin-top:35px !important;}.mt40 {margin-top:40px !important;}.mt45 {margin-top:45px !important;}.mt50 {margin-top:50px !important;}.mt55 {margin-top:55px !important;}.mt60 {margin-top:60px !important;}.mt65 {margin-top:65px !important;}.mt70 {margin-top:70px !important;}.mt75 {margin-top:75px !important;}.mt80 {margin-top:80px !important;}.mt85 {margin-top:85px !important;}.mt90 {margin-top:90px !important;}.mt95 {margin-top:95px !important;}.mt100 {margin-top:100px !important;}
.pb0 {padding-bottom:0 !important;}.pb5 {padding-bottom:5px !important;}.pb10 {padding-bottom:10px !important;}.pb15 {padding-bottom:15px !important;}.pb20 {padding-bottom:20px !important;}.pb25 {padding-bottom:25px !important;}.pb30 {padding-bottom:30px !important;}.pb35 {padding-bottom:35px !important;}.pb40 {padding-bottom:40px !important;}.pb45 {padding-bottom:45px !important;}.pb50 {padding-bottom:50px !important;}.pb55 {padding-bottom:55px !important;}.pb60 {padding-bottom:60px !important;}.pb65 {padding-bottom:65px !important;}.pb70 {padding-bottom:70px !important;}.pb75 {padding-bottom:75px !important;}.pb80 {padding-bottom:80px !important;}.pb85 {padding-bottom:85px !important;}.pb90 {padding-bottom:90px !important;}.pb95 {padding-bottom:95px !important;}.pb100 {padding-bottom:100px !important;}
.pt0 {padding-top:0 !important;}.pt5 {padding-top:5px !important;}.pt10 {padding-top:10px !important;}.pt15 {padding-top:15px !important;}.pt20 {padding-top:20px !important;}.pt25 {padding-top:25px !important;}.pt30 {padding-top:30px !important;}.pt35 {padding-top:35px !important;}.pt40 {padding-top:40px !important;}.pt45 {padding-top:45px !important;}.pt50 {padding-top:50px !important;}.pt55 {padding-top:55px !important;}.pt60 {padding-top:60px !important;}.pt65 {padding-top:65px !important;}.pt70 {padding-top:70px !important;}.pt75 {padding-top:75px !important;}.pt80 {padding-top:80px !important;}.pt85 {padding-top:85px !important;}.pt90 {padding-top:90px !important;}.pt95 {padding-top:95px !important;}.pt100 {padding-top:100px !important;}

.w100p {width:100%;}


/*
=====================
1: Base Setting
2: Common Setting
3: Main
4: Contents
5: Mypage
=====================
*/






.owl-dots {position: absolute; left: 50%; bottom: 150px; margin-left: -860px; width: 1720px; }
.owl-dots .owl-dot {display: inline-block; vertical-align: middle; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background-color: #fff; opacity:.3; -webkit-transition: all 0.3s; transition: all 0.3s;}
.owl-dots .owl-dot.active {width: 12px; height: 12px; opacity:1;}


.owl-nav {}
.owl-nav > * {font-size: 0; z-index: 10; position: absolute;  top: 50%; margin-top: -72px; width: 72px; height: 72px; font-size: 0; background-repeat: no-repeat; background-position: 0 0; background-size: cover; cursor:pointer;}
.owl-prev {left: -160px; background-image: url(../images/ico_slide_next.png); transform:rotate(180deg);}
.owl-next {right: -160px; background-image: url(../images/ico_slide_next.png);}



/* 1: Base Setting
=========================================================================================== */
.ta-r {text-align:right !important;}
.ta-l {text-align:left !important;}
.ta-c {text-align:center !important;}

.va-t {vertical-align:top !important;}
.va-n {vertical-align:middle !important;}
.va-b {vertical-align:bottom !important;}

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


.blind {display:none;}
.clear {clear:both; height:0;}


.c-black {color:#000 !important;}
.c-red {color:#ce000 !important;}
.c-white {color: #fff !important;}
.c-blue {color: #38a0ff !important;}
.c-blue2 {color: #38a0ff !important;}


.pr-mb1 {margin-bottom: 110px;}



.f-en {font-family: serif;}

iframe[name='google_conversion_frame'] {border:0; width:0; height:0; padding:0; margin:0; position:absolute; z-index:-1; visibility:hidden;}


 /* 2: Common Setting
=========================================================================================== */

/*IR 기법 아이콘 세트*/
.i-aft{position: relative;display: inline-block;vertical-align: baseline;*display: inline;*zoom: 1;}
.i-aft:after{content:""; position: absolute; left: 0;top: 50%;display: inline-block;overflow: hidden;width: 0;height: 0;content: '';text-align: left;text-indent: -9999px;background-repeat: no-repeat;*display: inline;*zoom: 1;}
.i-set{display: inline-block;overflow: hidden;text-align: left;vertical-align: baseline;text-indent: -9999px;line-height: 0;background-repeat: no-repeat;*display: inline;*zoom: 1;}


.i-aft.i_arr1 {padding-right: 15px;}
.i-aft.i_arr1:after {left: auto; right: 0; margin-top: -5px; width: 6px; height: 10px; background-image: url(../images/ico_arr_r1_s.png); background-position: 0 0;}
.i-aft.i_arr2 {padding-right: 15px;}
.i-aft.i_arr2:after {left: auto; right: 0; margin-top: -5px; width: 6px; height: 10px; background-image: url(../images/ico_arr_r1_s_bk.png); background-position: 0 0;}




/* 2-1: Basic
=========================== */
html {width:100%; font-size:62.5%;}
body {width:100%; font-family: 'Noto Sans KR', sans-serif; color:#5a5a5a; font-weight: normal; font-size:16px; line-height:1.2; -webkit-text-size-adjust: 100%; }
.inr-c {max-width:1720px; margin:0 auto;}
.inr-c2 {max-width:1320px; margin:0 auto;}


#wrap {}


/*버튼*/
.btn-bot {margin-top:40px; text-align: center;}
.btn-pk {
	display:inline-block; *display:inline-block; *zoom:1; padding:12px 10px;  border: 0;
	color:#fff; font-weight: 700; font-size:24px; line-height: 1; text-align: center; font-weight: normal;
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
	border-radius: 0;
	transition:all .3s ease; -webkit-transition:all .3s ease; -moz-transition:all .3s ease; -o-transition:all .3s ease;
}
input.btn-pk {color: #fff; border: 0; height: auto; min-width:200px; font-size: 21px; padding: 15px 30px; cursor:pointer;}

.mw100p {min-width:200px;}


.btn-pk.b {padding: 18px 25px; font-size: 16px;}
.btn-pk.n {padding: 12px 20px; font-size: 14px;}

.btn-pk.white {border: 1px solid #fff; color: #fff;}
.btn-pk.black {border: 1px solid #2f2f2f; color: #fff; background-color: #2f2f2f;}
.btn-pk.blue {border: 1px solid #38a0ff; color: #fff; background-color: #38a0ff;}





/*탭*/
.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;}


.tab.ty1 {margin-bottom: 30px;}
.tab.ty1 ul {}
.tab.ty1 li {margin-left: 10px;}
.tab.ty1 li:first-child {margin-left: 0;}
.tab.ty1 li p,
.tab.ty1 li a {display: block; font-size: 16px; line-height: 1; color: #999; text-align: center; background-color: #f3f4f8;}
.tab.ty1 li a span {position: relative; display: block; min-width:80px; text-align: center; font-weight: 700; padding: 14px 20px;}
.tab.ty1 li.on {}
.tab.ty1 li.on a {color: #38a0ff; background-color: #ebf5ff;}


.tab.ty2 {;}
.tab.ty2 ul {}
.tab.ty2 li {border: 1px solid #eee; margin: 1px;}
.tab.ty2 li a {display: block; padding: 18px 20px; font-weight: 400; font-size: 16px; color: #000;}
.tab.ty2 li.on {border-color: #38a0ff;}
.tab.ty2 li.on a {background-color: #38a0ff; color: #fff;}


/* 2-2: Layout
=========================== */
#wrap {overflow:hidden; word-break:keep-all; word-wrap:break-word;}

#header {z-index:102; position:fixed; left: 0; top: 0; width: 100%; border-bottom: 1px solid rgba(255,255,255,.4); -webkit-transition: all 0.3s; transition: all 0.3s;}

#header .rgh {position: absolute; right: 0; top: 24px;}
#header .rgh ul {padding: 10px 0;}
#header .rgh li a {display: block; font-size: 12px; padding:  5px 15px; color: #fff;}

.lst_rangs {display: none; position: absolute; width: 100px; background-color: #38a0ff;}
.btn_rangs {position: relative; width: 100px; height: 40px; padding: 10px 16px; color: #38a0ff; font-size: 12px; text-align: left; box-sizing:border-box; border: 2px solid #38a0ff;}
.btn_rangs:after {content:""; position: absolute; right: 15px; top: 50%; margin-top: -3px; width: 8px; height: 6px; background-image: url(../images/ico_rang_arr.png); background-position: center center; background-repeat: no-repeat; -webkit-transition: all 0.3s; transition: all 0.3s;}

.btn_contact {display: inline-block; vertical-align: top; width: 100px; height: 40px; line-height: 20px; padding: 8px 16px; color: #38a0ff; font-size: 12px; text-align: center; box-sizing:border-box; border: 2px solid #38a0ff;}


#header .rgh.open .lst_rangs {display: block;}
#header .rgh.open .btn_rangs:after {transform:rotate(180deg);}


.logo {z-index:0; float: left; display:inline-block; width:250px; height:90px; line-height: 90px; vertical-align:top;}
.logo:after {content:""; clear:both; display:block;}
.logo a {display:block; width:100%; height:100%; font-size:0; vertical-align:top;}

.btn_gnb_close {display: none;}
.btn_gnb {
	display: none;
	z-index:10;
	position: absolute;
	right:4%; top:0;
	width: 30px; height: 60px;
	cursor: pointer;
	margin: 0 auto;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
.btn_gnb span {
	position: absolute;
	top: 50%;
	display: block;
	width: 90%;
	height: 2px;
	margin-top: -1.5px;
	background-color: #fff;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.btn_gnb span:after,
.btn_gnb span:before {
	content: "";
	position: absolute; left:0;
	width: 120%;
	height: 100%;
	background-color: #fff;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
.btn_gnb span:after {-webkit-transform: translateY(7px); transform: translateY(7px);}
.btn_gnb span:before { -webkit-transform: translateY(-7px); transform: translateY(-7px);}


.gnbbox {margin-left: 250px; margin-right: 210px; text-align: right; }
.gnbbox > a {display: inline-block; vertical-align: middle; font-size: 12px; color: #fff; margin-left: 10px; padding: 0 10px; border: 1px solid #fff; line-height: 38px;}
.gnb {font-size: 0; display: inline-block; vertical-align: middle;}
.gnb > li {position: relative; display:inline-block; *display:inline; *zoom:1; vertical-align: top;}
_::-moz-svg-foreign-content, :root .gnb li {float: left;}
.gnb > li:first-child {margin-left:0;}
.gnb > li > a {
	display:block; text-align: center;
	font-weight: 700; font-size: 18px; line-height: 90px; color:#fff;
	-webkit-transition: all 0.1s;
	-moz-transition: all 0.1s;
	-o-transition: all 0.1s;
	transition: all 0.1s;
}
.gnb > li > a > span {
	position: relative; min-width:80px; 
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
	padding: 0 30px;
}
.gnb > li > a > span:after {
	content:""; z-index: -1; position: absolute; left: 50%; bottom: 50%; width: 0; height: 0; background-color: #38a0ff;
	 -webkit-transition: all 0.3s; transition: all 0.3s;
}
.gnb > li.on > a > span:after,
.gnb > li:hover > a > span:after {left: 0; bottom: 0; width: 100%; height: 100%;}


.gnb .depth2 {
	z-index: -9999; visibility: hidden; position: absolute; left: 0; top: 90px; 
	width: 100%; background-color: #38a0ff; 
	-webkit-transition: transform 0.25s linear, opacity .3s linear, visibility .3s linear; transition: transform 0.25s linear, opacity .3s linear, visibility .3s linear;
	opacity:0; transform: translateY(20px);
}
.gnb .depth2 ul {padding: 10px 0;}
.gnb .depth2 li a {display: block; padding: 10px 20px; font-size: 14px; text-align: center; color: #fff;}
.gnb .depth2 li:hover a {background-color: rgba(0,0,0,.1);}


.gnb > li.ovr .depth2 {z-index:1; visibility: visible; opacity:1; transform: translateY(0);}



#header.scroll {background-color: #fff; box-shadow:0 0 5px rgba(0,0,0,.1);}
#header.scroll .logo {background-image: url(../images/logo_bk.png); background-position: 0 center; background-repeat: no-repeat;}
#header.scroll .logo img {visibility: hidden;}
#header.scroll .gnbbox > a {color: #000; border-color: #000;}
#header.scroll .gnb > li > a {color: #000;}
#header.scroll .gnb > li.on > a {color: #fff;}
#header.scroll .rgh {border-color: #000;}
#header.scroll .gnb > li:hover > a {color: #fff;}


/*footer*/
#footer {padding:50px 0 40px; background-color:#242424;}
#footer p {font-size: 14px; margin: 5px 0; line-height: 1.5; color: #666;}
#footer .foo_logo {margin-bottom: 25px;}
#footer .foo_logo > div {display: inline-block; vertical-align: bottom; margin-right: 80px;}
#footer .foo_logo > ul {display: inline-block; vertical-align: bottom;}
#footer .foo_logo li {display: inline-block; vertical-align: middle;}
#footer .foo_logo a {display: block; font-size: 14px; line-height: 1; color: #fff; opacity:.5; padding-left: 10px; margin-left: 10px; border-left: 1px solid #333;}
#footer .foo_logo li:first-child a {border-left: 0; padding-left: 0; margin-left: 0;}
#footer .foo_txt {position: relative;}
#footer .foo_txt .r {position: absolute; right: 0; bottom: 0;}
#footer .foo_txt .r .btn-pk {min-width:170px; text-align: center; color: #999; margin-left: 5px;}
#footer .foo_txt .r .btn-pk:hover {background-color: #000; border-color: #000;}
#footer .copy {overflow:hidden; margin-top: 25px; padding-top: 25px; font-size: 13px; border-top: 1px solid rgba(255,255,255,.1);}
#footer .copy a {float: right; display: inline-block; vertical-align: middle; padding: 3px 10px; margin-left: 10px; color: #fff; font-weight: 300; background-color: #000; opacity:.6;}




.inr-c {position: relative; z-index: 1;}


.hd_tit1 {position: relative; margin-bottom: 30px; font-size: 16px; color: #333; line-height: 1.5;}
.hd_tit1 .h_tit1 {font-weight: 700; font-size: 48px; line-height: 1.2; letter-spacing:-0.0325em;}
.hd_tit1 .h_tit2 {margin-bottom: 15px; font-size: 21px;}
.hd_tit1 .rgh {position: absolute; right: 0; top: 35px; font-size: 15px; line-height: 1;}
.hd_tit1 .rgh a {font-size: 16px; color: #333;}


.h_tit0 {font-size: 32px; font-weight: 700; margin-bottom: 40px; color: #333;}
.h_tit1 {font-size: 24px; font-weight: 700; margin-bottom: 20px; color: #333;}
.h_tit2 {font-size: 22px; font-weight: 700; margin-bottom: 25px; color: #333;}

.i-txt {display: inline-block; vertical-align: middle; font-weight: 700; font-size: 12px; height: 25px; line-height: 25px; padding: 0 10px; border: 1px solid #fff; border-radius: 5px;}
.i-txt.black {border-color: #000; color: #000;}
.i-txt.red {border-color: #DC3C32; color: #DC3C32;}
.i-txt.blue {border-color: #ebf5ff; color: #38a0ff; background-color: #ebf5ff;}
.i-txt.gray {border-color: #f3f4f8; color: #999; background-color: #f3f4f8;}


/*메인*/
.container.main {}


.bxMain {position: relative; left: 0; top: 0; width: 100%; height: 100vh; background-color: #f7f7f7; }
.bxMain .item {position: relative; height: 100vh;}
.bxMain .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.bxMain .bg span {display: block; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.bxMain .cont {position: absolute; left: 0; bottom: 0; width: 100%; bottom: 230px; color: #fff;}

.txt_st1 {}
.txt_st1 .tit1 {position: relative; margin-bottom: 20px; font-size: 62px; line-height: 1.2; }
.txt_st1 .txt {font-size: 16px; line-height: 1.6;}


.tit_st2 {color: #000;}
.tit_st2 .ico {margin-bottom: 10px;}
.tit_st2 .tit1 {font-weight: 700; font-size: 40px; margin-bottom: 15px; line-height: 1.2;}
.tit_st2 .tit2 {font-weight: 700; font-size: 24px; margin-bottom: 15px; line-height: 1.2;}
.tit_st2 .txt {font-size: 14px; line-height: 1.5;}



.area_notice {padding: 25px 0; font-size: 14px; color: #fff; background-color: #0E050A;}
.area_notice .i-txt {margin-right: 10px;}
.area_notice a {position: relative; display: inline-block; vertical-align: middle; padding-left: 15px; margin-left: 10px; color: #fff;}
.area_notice a:after {content:"/"; position: absolute; left: 0;}
.area_notice a.first {padding-left: 0; margin-left: 0;}
.area_notice a.first:after {content:none;}
.area_notice .rgh {position: absolute; right: 0; top: 50%; margin-top: -8px;}


.main_cont.area1 {padding-top: 110px; padding-bottom: 150px;}


.lst_prd1 {font-size: 0; margin-bottom: 40px;}
.lst_prd1 .col {position: relative; padding-right: 50%;}
.lst_prd1 .col .img {overflow:hidden; position: relative; height: 0; padding-bottom: 66.3%; }
.lst_prd1 .col .img span:after {content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.1);}
.lst_prd1 .col .img img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s; transition: all 0.3s;}
.lst_prd1 .col .cont {position: absolute; right: 0; top: 0; width: 45%; padding-top: 50px;}
.lst_prd1 .col a:hover .img img {transform:scale(1.2);}


.tit_st1 .ico {margin-bottom: 5px; font-size: 21px; color: #38a0ff;}
.tit_st1 .tit1 {padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #eeeeee; font-weight: 700; font-size: 32px; color: #333;}
.tit_st1 .txt {font-size: 16px; line-height: 1.5; color: #767676;}


.thumb_img {}
.thumb_img ul {font-size: 0; width: 102%;}
.thumb_img li {position: relative; display: inline-block; vertical-align: top; width: 18%; margin-right: 2%;}
.thumb_img .img {position: relative; height: 0; padding-bottom: 100%; background-repeat: no-repeat; background-position: center center;}
.thumb_img .img:after {content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); -webkit-transition: all 0.3s; transition: all 0.3s;}
.thumb_img a {z-index: 1; position: absolute; left: 0; top: 0; display: table; width: 100%; height: 100%; text-align: center;}
.thumb_img a span {position: relative; display: table-cell; vertical-align: middle; font-size: 24px; color: #fff;}
.thumb_img a i {position: relative; display: block; margin: 0 auto; margin-top: 20px; width: 44px; height: 44px; border: 2px solid #fff; border-radius: 50%; -webkit-transition: all 0.3s; transition: all 0.3s;}
.thumb_img a i:after {content:"+"; position: absolute; left: 0; top: 0; width: 100%; text-align: center; font-size: 40px; color: #fff; line-height: 38px;}

.thumb_img li:hover .img:after {background-color: rgba(56,160,255,.6);}
.thumb_img li:hover a i {background-color: #fff;}
.thumb_img li:hover a i:after {color: rgb(56,160,255);}


.main_cont.area2 {position: relative; padding-top: 160px; padding-bottom: 150px; color: #000; background-image: url(../images/img_main2.jpg); background-size: cover; background-repeat: no-repeat; background-attachment: fixed;}
.main_cont.area2 .inr-c2 {position: relative; z-index: 1;}
.main_cont.area2:after {content:""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(255,255,255,.2);}
.main_cont.area2 .hd_tit1 .rgh a {color: #000;}


.txt_st2 {font-size: 16px; line-height: 1.5;}
.txt_st2 .tit1 {margin-bottom: 80px; font-weight: 700; font-size: 48px; line-height: 1.2;}


.lst_bind {}
.lst_bind > .col {display: inline-block; vertical-align: top; margin-right: 7%;}
.lst_bind > .col p {margin-bottom: 25px; font-weight: 700; font-size: 18px; color: #9db5ec;}
.lst_bind > .col li {line-height: 1.5; margin-bottom: 3px;}


.lst_dot1 {}
.lst_dot1 li {position: relative; padding-left: 10px; font-size: 16px; margin-bottom: 10px; color: #444;}
.lst_dot1 li:after {content:"·"; position: absolute; left: 0; top: 0; font-weight: 700;}



.main_cont.area3 {padding-top: 120px; padding-bottom: 120px; background: #efefef url(../images/img_bg3.jpg) 0 bottom no-repeat; background-size: auto 100%;}
.main_cont.area3 .imgs {text-align: right; padding-top: 50px; position: relative; right: -10%;}

.main_cont.area3 .list {}
.main_cont.area3 .list ul {font-size: 0; width: 105%;}
.main_cont.area3 .list li {position: relative; display: inline-block; vertical-align: top; width: 28.33%; margin-right: 5%;}
.main_cont.area3 .list li .img img {width: 100%;}
.main_cont.area3 .list li .txt {z-index: 1; padding: 20px 30px 25px; background-color: #fff; font-size: 16px; border-top: 2px solid #38a0ff; -webkit-transition: all 0.3s; transition: all 0.3s;}
.main_cont.area3 .list li .txt p {position: relative; font-weight: 700; font-size: 24px; color: #333;}
.main_cont.area3 .list li .txt strong {display: block; margin-bottom: 10px; font-size: 16px; color: #38a0ff;}



.main_cont.area4 {position: relative; height: 500px;}
.main_cont.area4 .bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-repeat: no-repeat; background-position: center center; background-image: url(../images/img_main4.jpg);}
.main_cont.area4 .inr-c2 {display: table; width: 100%; height: 100%; text-align: left;}
.main_cont.area4 .inr-c2 > div {position: relative; display: table-cell; vertical-align: top; padding-top: 95px; color: #fff;}
.main_cont.area4 .txt_st2 .tit1 {margin-bottom: 20px;}
.main_cont.area4 .btns {margin-top: 30px;}


.main_cont.area5 {position: relative; padding-top: 120px; padding-bottom: 100px;}
.main_cont.area5 .inr-c2 {position: relative;}
.main_cont.area5 .tab {margin-bottom: 50px;}
.main_cont .a_link {position: absolute; right: 0; top: -70px; padding-right: 20px; display: block; font-size: 14px; color: #000; line-height: 20px;}
.main_cont .a_link span:after {content:""; position: absolute; right: 0; top: 50%; margin-top: -6px; width: 15px; height: 12px; background: url(../images/ico_arr_r2.png) right center no-repeat;}


.lst_news {}
.lst_news > div > .item {display: inline-block; vertical-align: top; width: 310px; margin-right: 30px; }
.lst_news .item {box-sizing:border-box; padding: 24px;}
.lst_news .txt {padding: 0 0 20px;}
.lst_news .txt .icon {margin-bottom: 20px;}
.lst_news .txt .h1 {overflow:hidden; margin-bottom: 10px; height: 84px; font-weight: 700; font-size: 20px; line-height: 28px; color: #333333;}
.lst_news .txt .t1 {overflow:hidden; height:60px; font-size: 14px; line-height: 20px; color: #787878;}
.lst_news .botm {height: 40px; border-top: 1px solid #E6E6E6;}
.lst_news .botm p {font-size: 14px; color: #787878; line-height: 40px; background-position: right center; background-image: url(../images/ico_arr_r1_bk.png); background-repeat: no-repeat;}


.lst_news.active .item {opacity:0;}





/******컨텐츠시작******/
#container.sub {padding-bottom: 120px;}

.spot {height: 600px; margin-bottom: 30px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.spot .inr-c2 {position: relative; height: 100%;}
.spot .txt {z-index: 1; position: absolute; left: 0; bottom: 80px; color: #fff;}
.spot .txt .tit1 {margin-bottom: 50px; font-weight: 700; font-size: 54px; line-height: 1.2;}
.spot .txt li {display: inline-block; vertical-align: top; margin-right: 35px; opacity:.6; border-bottom: 1px solid transparent;}
.spot .txt li a {display: block; padding: 8px 0; font-size: 18px; color: #fff;}
.spot .txt li.on {opacity:1; border-color: #fff;}

.spot.spot1 {background-image: url(../images/spot/spot1.jpg);}
.spot.spot2 {background-image: url(../images/spot/spot2.jpg);}
.spot.spot3 {background-image: url(../images/spot/spot3.jpg);}
.spot.spot4 {background-image: url(../images/spot/spot4.jpg);}


.sub_tit {padding: 80px 0; text-align: center;}
.sub_tit .tit1 {margin-bottom: 40px; font-weight: 700; font-size: 40px; color: #333;}
.sub_tit .tab.ty2 .n3 li {min-width:200px;}


.box_txt {position: relative; height: 400px; margin-bottom: 60px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.box_txt .inr-c2 {position: relative; height: 100%;}
.box_txt .inr-c2 .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: 55px 40px 0; background-color: #fff; box-sizing:border-box; display: table;}
.box_txt .txt .h1 {display: table-cell; vertical-align: middle; width: 30%; padding: 0 40px 0 0; font-weight: 700; font-size: 36px; color: #333; line-height: 1;}
.box_txt .txt .t1 {display: table-cell; vertical-align: bottom; font-size: 16px; color: #666; line-height: 1.3;}


.bind_n2.line-bot {position: relative;}
.bind_n2.line-bot:after {content:""; position: absolute; left: 0; bottom: 0; width: 95%; height: 1px; background-color: #eee;}

.bind_n2.non {width: 100%;}
.bind_n2.non.line-bot:after {width: 100%;}

.bind_n2 {padding: 70px 0; font-size: 0; width: 105%;}
.bind_n2 .col {display: inline-block; vertical-align: top; width: 45%; margin-right: 5%;}
.bind_n2 .box img {width: 100%;}

.bind_n3 {padding: 70px 0; font-size: 0; width: 103%;}
.bind_n3 .col {display: inline-block; vertical-align: top; width: 30.33%; margin-right: 3%;}




.area_idea {overflow:hidden;}
.area_idea .lft {position: relative; float: left; width: 50%; text-align: right;}
.area_idea .lft img {width: 100%; max-width:950px;}
.area_idea .lft .txt {position: absolute; left: 60px; bottom: 60px; text-align: left; font-size: 21px; color: #fff;}
.area_idea .lft .h1 {font-weight: 700; font-size: 32px; margin-bottom: 10px;}
.area_idea .rgh {float: right; width: 45%; font-size: 16px; color: #3c322d; line-height: 1.6;}
.area_idea .rgh > div {max-width:660px;}
.area_idea .rgh .h1 {position: relative; padding-top: 35px; padding-bottom: 35px; margin-bottom: 55px; font-weight: 700; font-size: 24px; line-height: 1.3; color: #333; border-bottom: 2px solid #ebebeb;}
.area_idea .rgh .h1:after {content:""; position: absolute; left: 0; bottom: -2px; width: 170px; height: 2px; background-color: #38a0ff;}
.area_idea .rgh .t1 span {display: block; max-width:660px;}
.area_idea .c-blue {font-size: 1.3em;}


/*핵심가치*/
.box_bind {margin-top: 90px; text-align: center;}
.box_bind li {display: inline-block; vertical-align: top; margin: 0 1%; width: 31%; font-size: 16px; line-height: 1.5;}
.box_bind li .img {margin-left: auto; margin-right: auto; margin-bottom: 30px; position: relative; width: 80%; height: 0; padding-bottom: 80%; border: 1px solid #38a0ff; border-radius: 50%;}
.box_bind li .img > div {position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%);}
.box_bind li .img .t {margin-top: 20px;}
.box_bind li .img p {margin-top: 20px;}

.box_bind ul.ty1 li .img {border: 0; margin-bottom: 0; width: 90%; padding-bottom: 0; height: auto; margin-bottom: 30px;}
.box_bind ul.ty1 li p.h1 {margin-bottom: 15px; color: #666; font-size: 22px; font-weight: 700; line-height: 1.2;}

.box_bind ul.ty2 li .img p {color: #fff; font-size: 22px; font-weight: 700;}
.box_bind ul.ty2 li .img p.t2 {margin-top: 0; font-size: 16px; white-space:nowrap;}
.box_bind ul.ty2 li:nth-child(1) .img {border-color: #6ccf9f; background-color: #6ccf9f;}
.box_bind ul.ty2 li:nth-child(2) .img {border-color: #60d8e2; background-color: #60d8e2;}
.box_bind ul.ty2 li:nth-child(3) .img {border-color: #47afe2; background-color: #47afe2;}



/*오시는길*/
.area_contact {}
.area_contact .map {overflow:hidden; position: relative; height: 540px; margin-bottom: 60px; border: 1px solid #eee;}
.area_contact .mapin {position: absolute; left: 50%; top: 50%; margin-left: -660px; margin-top: -270px; width: 1320px; height: 540px;}
.area_contact .inr-c2 {max-width:1056px;}


.area_contact .cont {}
.area_contact .cont .tit {position: relative; padding-bottom: 25px; margin-bottom: 40px; border-bottom: 2px solid #ddd;}
.area_contact .cont .tit .h1 {font-size: 26px; font-weight: 700; color: #333;}
.area_contact .cont .tit .h1 span {position: relative; display: block; padding-left: 60px; }
.area_contact .cont .tit .h1 span:after {content:""; position: absolute; left: 0; bottom: 0; width: 46px; height: 45px; background: url('../images/sub/ico_contact1.png') 0 bottom no-repeat;}
.area_contact .cont .tit .rgh {position: absolute; right: 0; bottom: 25px;}
.area_contact .cont .tit .rgh p {display: inline-block; vertical-align: bottom; font-size: 16px; color: #333; margin-left: 30px;}
.area_contact .cont .txt {padding: 0 10px; font-size: 16px; line-height: 1.5; color: #666;}
.area_contact .cont .txt strong {display: block; margin-bottom: 10px; font-weight: 700; font-size: 20px; color: #333;}
.area_contact .cont .txt p {overflow:hidden; margin-bottom: 10px;}
.area_contact .cont .txt p span:first-child {float: left; display: block; width: 145px; color: #333; font-weight: 600;}


.area_history {}
.area_history .lft {position: relative; }
.area_history .lft img {animation:opy 1s ease-in; -webkit-transition: all 0.1s; transition: all 0.1s;}
.area_history .lft .im1{}
.area_history .lft .im2 {position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
.area_history .rgh .inner {position: relative; max-width:660px; }
.area_history .rgh .h1 {padding-top: 0; padding-bottom: 50px; margin-bottom: 30px;}
.area_history .rgh .h1:after {content:none;}
.area_history .r1 {margin-bottom: 30px;}
.area_history .r1 span {display: block;}
.area_history .r1 span:first-child {font-weight: 700; font-size: 20px;}
.area_history .r1 span:last-child {margin-left: 20px;}
.area_history .r1 span em {font-weight: 700;}


.area_history .slider_btn {z-index: 3; position: absolute; left: 0; top: 40px;}
.area_history .slider_btn button {width: 32px; height: 32px;}

@keyframes opy {
  from {opacity: 0;}
  to {opacity: 1;}
}

/*R&D*/
.area_rnd {}
.area_rnd ul {font-size: 0; width: 104%;}
.area_rnd li {overflow:hidden; display: inline-block; vertical-align: top; width: 29.33%; margin-right: 4%; height: 860px; text-align: center; border: 3px solid #000; border-radius: 20px; box-sizing:border-box;}
.area_rnd li .icon {overflow:hidden;margin: 10% 10% 0; border-radius: 20px;}
.area_rnd li .h1 {position: relative; padding-top: 40px; padding-bottom: 40px; margin-bottom: 30px; font-weight: 700; font-size: 32px; color: #6f6f6f;}
.area_rnd li .h1:after {content:""; position: absolute; left: 50%; bottom: 0; width: 50px; height: 3px; margin-left: -25px;}
.area_rnd li .t1 {font-size: 18px; color: #6f6f6f; line-height: 1.5;}

.area_rnd li:nth-child(1) {border-color: #f37f2c;}
.area_rnd li:nth-child(2) {border-color: #91cf3e;}
.area_rnd li:nth-child(3) {border-color: #3ba7e4;}

.area_rnd li:nth-child(1) .h1:after {background-color: #f37f2c;}
.area_rnd li:nth-child(2) .h1:after {background-color: #91cf3e;}
.area_rnd li:nth-child(3) .h1:after {background-color: #3ba7e4;}


.area_rnd .t1 a {display: block; margin-bottom: 10px; }
.area_rnd .t1 a span {display: inline-block; vertical-align: top; width: 100%; max-width:245px; padding: 14px 0; font-size: 17px; color: #fff; border-radius: 5px; background-color: #f37f2c;}


.area_rnd li:nth-child(2) .t1 a span {background-color: #91cf3e;}
.area_rnd li:nth-child(3) .t1 a span {background-color: #3ba7e4;}



.tbl_basic {}
.tbl_basic table {font-size: 16px; color: #333; line-height: 1.5; border-top: 1px solid #e5e5e5;}
.tbl_basic tr {border-bottom: 1px solid #e5e5e5;}
.tbl_basic td {height: 25px; padding: 10px; font-size: 14px; border: 1px solid #e5e5e5;}
.tbl_basic th {height: 25px; padding: 10px; background-color: #f8f8f8; border: 1px solid #e5e5e5;}
.tbl_basic p {font-size: 14px; color: #666;}

.tbl_basic table.list {text-align: center; }
.tbl_basic td.subject {text-align: left; padding-left: 20px; height: 30px;}

.tbl_basic col.num {width: 120px;}
.tbl_basic col.day {width: 200px;}


/*인사제도*/
.lst_system {}
.lst_system li {display: table; width: 100%; table-layout:fixed;}
.lst_system li > div {display: table-cell; vertical-align: middle;}
.lst_system li > div.img {width: 170px;}
.lst_system li > div.tx {position: relative; padding-left: 35px; font-size: 16px; color: #666;}
.lst_system li > div.tx:after {content:"▶"; position: absolute; left: 0; top: 50%; transform:translateY(-50%);}
.lst_system li > div.tx .h1 {margin-bottom: 10px;}
.lst_system li > div.tx .h1 span {font-weight: 700; margin-right: 10px; font-size: 1.25em;}

.lst_system li:nth-child(1) > div.tx:after {color: #87ceed;}
.lst_system li:nth-child(2) > div.tx:after {color: #4bb4e0;}
.lst_system li:nth-child(3) > div.tx:after {color: #0099cb;}
.lst_system li:nth-child(4) > div.tx:after {color: #0081b7;}
.lst_system li:nth-child(5) > div.tx:after {color: #00679f;}




/*복리후생*/
.lst_welfare {}
.lst_welfare ul {font-size: 0; width: 101%;}
.lst_welfare li {display: inline-block; vertical-align: top; width: 32.33%; margin-right: 1%; margin-bottom: 1%; border-radius: 10px; background-color: #f3f4f8;}
.lst_welfare li > div {display: table; table-layout:fixed; width: 100%; height: 140px; padding-left: 15%; box-sizing:border-box;}
.lst_welfare li > div > div {display: table-cell; vertical-align: middle;}
.lst_welfare li .img {width: 80px; padding-right: 20px;}
.lst_welfare li p {font-size: 18px; font-weight: 700; color: #333;}



.lst_step {}
.lst_step ul {font-size: 0;}
.lst_step li {position: relative; display: inline-block; vertical-align: top; width: 16.666%;}
.lst_step .bg {z-index: 1; position: absolute; right: -10px; top: 0; width: 100%; height: 100%; background-color: #fff; border-radius: 40px; border: none;}
.lst_step li > div {z-index: 1; position: relative; height: 320px; box-sizing:border-box; border: 7px solid #616161; text-align: center; border-radius: 40px; font-size: 14px; color: #666; line-height: 1.4;}
.lst_step li .ico {padding-top: 50px; margin-bottom: 20px;}
.lst_step li .h1 {margin-bottom: 20px; font-size: 12px; font-weight: 700; color: #616161;}
.lst_step li .h1 span {display: block; font-size: 21px; margin-bottom: 5px;}


.lst_step li:after {content:""; z-index: 2; position: absolute; right: -30px; top: 50%; margin-top: -33px; width: 54px; height: 54px; border: 6px solid #fff; border-radius: 50%; background-image: url(../images/sub/ico_step_arr.png); background-repeat: no-repeat; background-position: center center;}
.lst_step li:before {content: ""; z-index: 2; position: absolute; right: -38px; top: 50%; margin-top: -40px; width: 31px; height: 66px; border: 7px solid #000; border-radius: 0 100px 100px 0;}


.lst_step li:nth-child(1) {z-index: 6;}
.lst_step li:nth-child(2) {z-index: 5;}
.lst_step li:nth-child(3) {z-index: 4;}
.lst_step li:nth-child(4) {z-index: 3;}
.lst_step li:nth-child(5) {z-index: 2;}
.lst_step li:nth-child(6) {z-index: 1;}


.lst_step li:nth-child(1):after {background-color: #fc4b00;}
.lst_step li:nth-child(1):before {border-color: #fc4b00;}
.lst_step li:nth-child(1) > div {border-color: #fc4b00;}
.lst_step li:nth-child(1) .h1 {color: #fc4b00;}
.lst_step li:nth-child(2):after {background-color: #ff8200;}
.lst_step li:nth-child(2):before {border-color: #ff8200;}
.lst_step li:nth-child(2) > div {border-color: #ff8200;}
.lst_step li:nth-child(2) .h1 {color: #ff8200;}
.lst_step li:nth-child(3):after {background-color: #ffd100;}
.lst_step li:nth-child(3):before {border-color: #ffd100;}
.lst_step li:nth-child(3) > div {border-color: #ffd100;}
.lst_step li:nth-child(3) .h1 {color: #ffd100;}
.lst_step li:nth-child(4):after {background-color: #39f0fd;}
.lst_step li:nth-child(4):before {border-color: #39f0fd;}
.lst_step li:nth-child(4) > div {border-color: #39f0fd;}
.lst_step li:nth-child(4) .h1 {color: #39f0fd;}
.lst_step li:nth-child(5):after {background-color: #4795ff;}
.lst_step li:nth-child(5):before {border-color: #4795ff;}
.lst_step li:nth-child(5) > div {border-color: #4795ff;}
.lst_step li:nth-child(5) .h1 {color: #4795ff;}

.lst_step li:nth-child(6):after {content:none;}
.lst_step li:nth-child(6):before {content:none;}


/*안전보건환경*/
.area_safe1 {padding-bottom: 100px;}

.lst_number {}
.lst_number li {position: relative; padding-left: 50px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 20px; font-weight: 700; font-size: 16px; color: #333;}
.lst_number li span {position: absolute; left: 0; top: 50%; margin-top: -17.5px; width: 35px; height: 35px; font-size: 15px; color: #fff; text-align: center; line-height: 35px; border-radius: 50%; background-color: #38a0ff; border-radius: 50%;}


.area_safe2 {padding: 120px 0; background-color: #f8f8f8;}
.area_safe2 .tab {margin-bottom: 60px;}

.box_safe1 {position: relative; margin-bottom: 70px;}
.box_safe1 .txt {position: absolute; left: 10%; bottom: 0; width: 80%; padding: 20px 95px; box-sizing:border-box; font-size: 16px; line-height: 1.5; background-color: rgba(0,0,0,.5); color: #fff;}


.lst_safe1 {font-size: 0;}
.lst_safe1 ul {}
.lst_safe1 > ul > li {display: inline-block; vertical-align: top; width: 47%;}
.lst_safe1 > ul > li:first-child {margin-right: 6%;}
.lst_safe1 li .img {text-align: center; margin-bottom: 65px;}
.lst_safe1 li .img p {font-size: 16px; color: #333; margin-top: 20px;}
.lst_safe1 li .txt {}
.lst_safe1 li .h1 {padding-bottom: 20px; margin-bottom: 20px; font-weight: 700; font-size: 21px; color: #333; border-bottom: 1px solid #e1e1e1;}
.lst_safe1 li .h1 span {display: block; /*padding-left: 35px; background: url(../images/sub/ico_try.png) 0 center no-repeat;*/}


.lst_safe2 li {display: table; width: 100%; table-layout:fixed; margin-bottom: 20px;}
.lst_safe2 li > div {display: table-cell; vertical-align: middle; padding-left: 5%;}
.lst_safe2 li > div:first-child {padding-right: 5%; padding-left: 0;}
.lst_safe2 li .h1 {font-weight: 700; font-size: 21px; color: #222; margin-bottom: 30px;}

.lst_safe2.ty2 li > div:first-child {width: 60%; padding-right: 0;}
.lst_safe2.ty2 .img span {display: inline-block; vertical-align: top; width: 48%; text-align: center; font-size: 16px; color: #333; }
.lst_safe2.ty2 .img img {display: block; margin-bottom: 10px;}
.lst_safe2.ty2 .txt:first-child {margin-bottom: 70px;}
.lst_safe2.ty2 .txt .h1 {padding-bottom: 20px; margin-bottom: 20px; font-weight: 700; font-size: 21px; color: #333; border-bottom: 1px solid #e1e1e1;}

.pr0 {padding-right: 0 !important;}


/*게시판*/
.bbs_view {}
.bbs_view .tit {padding: 30px 30px; border-bottom: 1px solid #eee; border-top: 1px solid #e0e0e0; font-size: 12px; color: #999; background-color: #fbfbfb;}
.bbs_view .tit .h1 {margin-bottom: 10px; font-weight: 700; font-size: 20px; color: #333;}
.bbs_view .tit .t1 span {display: inline-block; vertical-align: middle; padding: 0 10px; border-left: 1px solid #eee;}
.bbs_view .tit .t1 span:first-child {border-left: 0; padding-left: 0;}
.bbs_view .cont {padding: 50px 30px; min-height:250px; font-size: 16px; line-height: 1.6; color: #666; border-bottom: 1px solid #e0e0e0; white-space:pre-line;}

.bbs_view .fz {font-size: 16px;}

.bbs_view .botm {font-size: 16px; color: #666;}
.bbs_view .botm > div {padding: 18px 30px; border-bottom: 1px solid #eee;}
.bbs_view .botm > div > span {display: block;}
.bbs_view .botm > div > span.h {float: left; width: 60px; background-position: right center; background-repeat: no-repeat;}
.bbs_view .botm > div > span.t {margin-left: 125px;}	 
.bbs_view .botm > div:nth-child(1) > span.h {background-image: url(../images/ico_tbl_prev.png);}
.bbs_view .botm > div:nth-child(2) > span.h {background-image: url(../images/ico_tbl_next.png);}


/*paging*/
.pagenation {position:relative; padding-top: 40px;}
.pagenation ul {text-align:center;}
.pagenation li {
	display:inline-block;
	text-align:center;
	vertical-align:middle;
	font-size:14px; line-height:normal;
}
.pagenation li a {display:block; width: 30px; line-height: 20px; padding: 5px 0; text-align: center; border: 1px solid #fff; color:#999; }
.pagenation li.on strong,
.pagenation li.on a {display: block; color: #fff; border-color: #38a0ff; background-color: #38a0ff;}
.pagenation li.prev a {margin-right: 10px; color: #333;}
.pagenation li.next a {margin-left: 10px; color: #333;}




.scrollTopBtn {
  display: inline-block;
  background-color: #38a0ff;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 50%;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s, opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
  background-image: url(../images/ico_scrolltop.png) ;
  background-repeat: no-repeat;
  background-position: center 45%;
  background-size: 20px auto;
}
.scrollTopBtn:hover {
  cursor: pointer;
  background-color: #333;
}
.scrollTopBtn:active {
  background-color: #555;
}
.scrollTopBtn.show {
  opacity: .7;
  visibility: visible;
}
.scrollTopBtn.show.show2 {
	bottom: 300px !important;
}




/**/
.tbl_photo {}
.tbl_photo ul {font-size: 0; width: 103%;}
.tbl_photo li {display: inline-block; vertical-align: top; width: 30.33%; margin-right: 3%; margin-bottom: 40px;}
.tbl_photo .img {position: relative; height: 0; padding-bottom: 60%;}
.tbl_photo .img img {position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.tbl_photo .txt {padding-top: 20px;}
.tbl_photo .h1 {overflow:hidden; white-space: nowrap; text-overflow: ellipsis; height: 24px; margin-bottom: 15px; font-weight: 700; font-size: 20px; color: #333;}
.tbl_photo .t1 {font-size: 14px; line-height: 1.5; color: #787878; overflow: hidden; text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}



.area_contact {}
.area_contact .col {margin-bottom: 20px;}
.area_contact .col p {font-size: 16px; color: #222; margin-bottom: 10px;}
.area_contact .col.c2 {display: flex;}
.area_contact .col.c2 > div {flex:1; margin-left: 3%;}
.area_contact .col.c2 > div:first-child {margin-left: 0;}
.area_contact .inp_txt {box-sizing:border-box; height: 45px;}
.area_contact .textarea1 {height: 200px;}
.area_contact label {font-size: 14px; color: #000;}

.d-ib {display: inline-block; vertical-align: top;}
.d-ib .lst_system li {width: auto; max-width:100%;}
.maw1 {max-width:1110px; margin: 0 auto;}

.area.login .area_contact {max-width:1000px; margin: 0 auto;}


.alert-info {margin-top: 10px; padding: 10px; font-size: 12px; border: 1px solid #eee; background-color: #f9f9f9;}



/******************************************************************************************/
@media (max-width:1780px){
	.inr-c {margin-left: 4%; margin-right: 4%;}

	.owl-dots {left: 4%; width: 92%; margin-left: 0;}
}

@media (max-width:1380px){
	.inr-c2 {margin-left: 4%; margin-right: 4%;}

	.main_cont.area4 .inr-c2 {width: 92%;}
	.lst_news {padding: 0 80px;}
	.owl-prev {left: 0;}
	.owl-next {right: 0;}
}

@media (max-width:1440px){
	.main_cont.area4:after {width: 55%;}
	.main_cont.area4:before {left: 55%;}


	.main_cont.area3 .imgs {right: -2%;}
	.main_cont.area3 .list li .txt a:after {width: calc(100% - 61px);}
	.main_cont.area3 .list li .txt i {width: 60px;}
	.main_cont.area3 .list li:hover .txt i {height: 60px; margin-bottom: -30px;}
}

@media (max-width:1300px){
	#header .gnbbox {margin-left: 150px;}
	.gnb > li > a > span {padding: 0 20px;}

	
	.lst_step ul {padding-left: 40px; padding-right: 40px;}
	.lst_step li {width: 33.33%;}
	.lst_step li:nth-child(n+4) {top: -7px;}
}

@media (max-width:1140px){
	.gnb {white-space:nowrap;}
	.gnb > li > a > span {padding: 0 10px;}


	.lst_welfare li {width: 32.33%;}

	.main_cont.area3 .imgs  {text-align: center; padding-top: 2em;}
}

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

	#header .gnbbox {display: block !important;}

	/* Animate */
	html:not(.old-ie) .animate-element {-webkit-transition:visibility 1.1s ease, opacity 1.1s ease, transform 1.1s ease;transition:visibility 1.1s ease, opacity 1.1s ease, transform 1.1s ease}
	html:not(.old-ie) .fadeIn{visibility:hidden;opacity:0}
	html:not(.old-ie) .fadeIn.animated, html:not(.old-ie) body.is_mobile .fadeIn{visibility:visible;opacity:1}
	html:not(.old-ie) .fadeInUp{position:relative;visibility:hidden;opacity:0;transform: translateY(110px)}
	html:not(.old-ie) .fadeInUp.animated, html:not(.old-ie) body.is_mobile .fadeInUp{visibility:visible;opacity:1;transform: translateY(0)}
	html:not(.old-ie) .fadeInDown{position:relative;visibility:hidden;opacity:0;transform: translateY(-110px)}
	html:not(.old-ie) .fadeInDown.animated, html:not(.old-ie) body.is_mobile .fadeInDown{visibility:visible;opacity:1;transform: translateY(0)}
	html:not(.old-ie) .fadeInRight{position:relative;visibility:hidden;opacity:0;transform: translateX(-110px)}
	html:not(.old-ie) .fadeInRight.animated, html:not(.old-ie) body.is_mobile .fadeInRight{visibility:visible;opacity:1;transform: translateX(0)}
	html:not(.old-ie) .fadeInLeft{position:relative;visibility:hidden;opacity:0;transform: translateX(110px)}
	html:not(.old-ie) .fadeInLeft.animated, html:not(.old-ie) body.is_mobile .fadeInLeft{visibility:visible;opacity:1;transform: translateY(0)}


}


 @supports (-ms-ime-align:auto){
	.main_cont.area2 {background-attachment: scroll;}
}

/*Ie 10/11*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none){
	 .main_cont.area2 {background-attachment: scroll;}
}