@charset "utf-8";
@import url('../css/aos.css');

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 200;
    src: local('Noto Sans Thin'), local('NotoSans-Thin'),
    url(../fonts/NotoSansKR-Thin-Hestia.eot),
    url(../fonts/NotoSansKR-Thin-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Thin-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Thin-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 300;
    src: local('Noto Sans Light'), local('NotoSans-Light'),
    url(../fonts/NotoSansKR-Light-Hestia.eot),
    url(../fonts/NotoSansKR-Light-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Light-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Light-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 400;
    src: local('Noto Sans DemiLight'), local('NotoSans-DemiLight'),
    url(../fonts/NotoSansKR-DemiLight-Hestia.eot),
    url(../fonts/NotoSansKR-DemiLight-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-DemiLight-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-DemiLight-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 500;
    src: local('Noto Sans Regular'), local('NotoSans-Regular'),
    url(../fonts/NotoSansKR-Regular-Hestia.eot),
    url(../fonts/NotoSansKR-Regular-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Regular-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Regular-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 600;
    src: local('Noto Sans Medium'), local('NotoSans-Medium'),
    url(../fonts/NotoSansKR-Medium-Hestia.eot),
    url(../fonts/NotoSansKR-Medium-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Medium-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Medium-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 700;
    src: local('Noto Sans Bold'), local('NotoSans-Bold'),
    url(../fonts/NotoSansKR-Bold-Hestia.eot),
    url(../fonts/NotoSansKR-Bold-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Bold-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Bold-Hestia.otf) format('opentype');
}

@font-face {
    font-family: 'noto';
    font-style: normal;
    font-weight: 800;
    src: local('Noto Sans Black'), local('NotoSans-Black'),
    url(../fonts/NotoSansKR-Black-Hestia.eot),
    url(../fonts/NotoSansKR-Black-Hestia.eot?#iefix) format('embedded-opentype'),
    url(../fonts/NotoSansKR-Black-Hestia.woff) format('woff'),
    url(../fonts/NotoSansKR-Black-Hestia.otf) format('opentype');
}

html,body,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,ul,ol,li,dl,dt,dd,table,caption,tbody,tfoot,thead,tr,th,td,fieldset,fo7m,label,legend,input,button,textarea,select{margin:0;padding:0}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block;margin:0;padding:0}
legend{display:block;overflow:hidden;position:absolute;width:1px;height:1px;font-size:1px;line-height:0;text-indent:-999em;white-space:nowrap; }
fieldset,img,table,caption,tbody,tfoot,thead,tr,th,td,button,hr{border:0 none}
img{vertical-align:sub;}
body li{*vertical-align:top}
ul li{list-style:none; padding:0; margin:0;}
table{border-collapse:collapse}
caption{visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
button{overflow:visible;border:0 none;cursor:pointer}
button::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="reset"]::-moz-focus-inner {padding: 0;border: 0 none}
a { text-decoration:none; color:#31333f;  }
address,
em { font-style:normal }
body,input,select,textarea,button,h1,h2,h3,h4,h5,h6 { font-family: 'noto'; font-size:16px; color: #31333f; font-weight: 400;text-decoration: none; }
a:hover,a:link, a:visited{ text-decoration: none;}


/**************************************************************************************************************
	공통
**************************************************************************************************************/
.mb0 { margin-bottom:0 !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 }
.mb70 { margin-bottom:70px !important }
.mb75 { margin-bottom:75px !important }
.mb80 { margin-bottom:80px !important }
.mb90 { margin-bottom:90px !important }
.mr30 { margin-right:30px !important; }
.mr40 { margin-right:40px !important; }
.mr100 { margin-right:100px !important; }
.blue { color:#009bdf !important; }
.blue2 { color:#3f5cff !important; }
.white { color:#fff !important; }
.green { color:#049d42 !important; }
.red { color:#ff1966 !important; }
.gray { color:#8b8b8b !important; }
.black { color:#444 !important; }
.yellow { color:#ffe950 !important; }
.under { text-decoration:underline !important }
.f11 { font-size:11px !important }
.f14 { font-size:14px !important }
.f15 { font-size:15px !important }
.f16 { font-size:16px !important }
.f18 { font-size:18px !important }
.f20 { font-size:20px !important }
.f21 { font-size:21px !important }
.f24 { font-size:24px !important }
.f26 { font-size:26px !important }
.clear { clear:both; }
.fl { float:left !important }
.fr { float:right !important }
.w30 { width:30% !important }
.w35 { width:35% !important }
.w40 { width:40% !important }
.w45 { width:45% !important }
.w50 { width:50% !important }
.w53 { width:53% !important }
.w55 { width:55% !important }
.w60 { width:60% !important }
.w70 { width:70% !important }
.w65 { width:65% !important }
.pdt10 { padding-top:10px !important; }
.pdt15 { padding-top:15px !important; }
.pdt20 { padding-top:20px !important; }
.pdt25 { padding-top:25px !important; }
.pdt30 { padding-top:30px !important; }
.pdt40 { padding-top:40px !important; }
.pdt50 { padding-top:50px !important; }
.pdt60 { padding-top:60px !important; }
.pdt70 { padding-top:70px !important; }
.pdb10 { padding-bottom:10px !important; }
.pdb15 { padding-bottom:15px !important; }
.pdb20 { padding-bottom:20px !important; }
.pdb25 { padding-bottom:25px !important; }
.pdb30 { padding-bottom:30px !important; }
.pdb40 { padding-bottom:40px !important; }
.pdb50 { padding-bottom:50px !important; }
.pdb60 { padding-bottom:60px !important; }
.pdb70 { padding-bottom:70px !important; }
.pdb0 { padding-bottom:0 !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }
.text-left { text-align:left !important; }
.clear:after { display: block; content: ''; clear: both; }
.fl { float:left; }
.fr { float:right; }
form { padding:0; margin:0; }
input[type="checkbox"], input[type="radio"],select { vertical-align:middle }
img { max-width:100%;}
.hidden { position: absolute; left: -9999px; }
bold, strong { font-weight: 600; }
* { box-sizing: border-box;  -webkit-overflow-scrolling: touch; }
.block { display: block; width:100%;}
.ib { display: inline-block; vertical-align: middle; }

body { -webkit-text-size-adjust: 100%; background:none; }
/***********************************************************************************************
	MODAL
***********************************************************************************************/
.hidden { overflow:hidden; }
.modal-backdrop {position: fixed; top:0; right:0; bottom:0; left:0; background:#000; z-index:7500; opacity:.7; filter:alpha(opacity=70);}
.modal {display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:8000; overflow:auto; -webkit-overflow-scrolling:touch; outline:0; }
.modal-dialog {position:relative; width:auto;margin:0 auto 15px;  padding:0 15px; margin-top:30px !important; }
.modal-content {position:relative; background-color:#fff; outline:none;  overflow:hidden;  border-radius:8px; box-shadow:0 0 15px 0 rgba(0, 0, 0, 0.1); }
.modal-header {	overflow: hidden; padding:15px 15px 0 0;}
.modal-header .close {  float:right; width:35px; height:36px; background: url(../img/common/modal_close.png) no-repeat 0 0; text-align:left ; text-indent: -9999px }
.modal-body { }
.modal-body .privacy { padding:20px; font-size:13px; line-height: 1.6; }
.modal-body .txt-box { padding:20px 0;}
.modal-body .txt { text-align: center; }
.modal-body .title { padding:5px 10px 20px; font-size:20px; color: #222; margin-bottom: 15px; padding-bottom: 15px; text-align: center; border-bottom: 1px solid #ddd; }

/***********************************************************************************************
	Form
***********************************************************************************************/
.inp {height:45px; border:1px solid #cfd8e2; border-radius:0; padding-left: 12px; font-size:14px; background: #fff; color: #31333f; -webkit-appearance:none; box-shadow:none; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; outline:none; }
.inp:disabled { background: #efefef; }
.select {height:45px; border:1px solid #cfd8e2; border-radius:0; padding: 0 40px 0 12px; font-size:14px; background: #fff url(../img/common/bu_select.png) no-repeat 100% 50%; color: #31333f; -webkit-appearance:none; box-shadow:none; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; outline:none; cursor: pointer;}
.select:invalid  { color: #b9bcc6 !important;}
.select [disabled] { color: #b9bcc6;}
.select option { color: #2a3c60 !important;}
.textarea { border:1px solid #cfd8e2; border-radius:0; padding:6px 12px; font-size:14px; background: #fff; color: #31333f; -webkit-appearance:none; box-shadow:none; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; outline:none;  resize:none; }
::selection { color:#b9bcc6; } 
select::-ms-expand { display: none; }
::-webkit-input-placeholder { color: #b9bcc6;}
::-moz-placeholder { color: #b9bcc6; }
:-ms-input-placeholder { color: #b9bcc6; }
:-moz-placeholder { color: #b9bcc6; }
label { cursor: pointer; }
.inp:focus,
.select:focus{ border: 1px solid #3f5cff; }
.radio { position: absolute; left: -9999px; }
.radio + em { display: inline-block; vertical-align: middle; width:20px; height: 20px; border:2px solid #9e9fa2; border-radius:100%; position: relative; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; cursor: pointer;}
.radio + em + span { display: inline-block; vertical-align: middle; font-size:14px;  margin:-2px 0 0 5px;}
.radio + em:before { content: ''; position: absolute;left: 3px; top:3px; right:3px; bottom:3px; border-radius:100%; background: #3f5cff; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transform: scale(0.2); -webkit-transform: scale(0.2); opacity:0;}
.radio:checked + em { border-color:#3f5cff;  }
.radio:checked + em:before { transform: scale(1); -webkit-transform: scale(1); opacity:1; }

.btn { display: inline-block; vertical-align: middle; height:45px; line-height: 42px; text-align: center; border-radius:45px;font-size:18px; color: #fff;padding:0 35px; font-weight: 500; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; }
.btn.btn-s { height: 26px; line-height: 24px; padding:0 19px; font-size:13px; }
.btn.btn-m { height: 32px; line-height: 30px; padding:0 15px; font-size:14px; }
.btn.btn-l { height: 45px; line-height: 43px; padding:0 35px; font-size:18px; }
.btn-black { background: #31333f; border-color:#31333f;  }
.btn-gray { background: #9093a0; border-color:#9093a0;  }
.btn-gray2 { background: #c9cbd5; border-color:#c9cbd5;  }
.btn-blue { background: #3f5cff; border-color:#3f5cff;  }
.btn-gray-line {  border: 1px solid #b9bcc6; color: #b9bcc6; background: none; }
.btn-black-line {  border: 1px solid #31333f; color: #31333f; background: none; }
.btn-blue-line {  border: 1px solid #3f5cff; color: #3f5cff; background: none; }

.checkbox { position: absolute; left: -9999px; }
.checkbox + em { display: inline-block; vertical-align: middle; width:18px; height: 18px; border-radius:3px;  transition: all 0.3s ease; -webkit-transition: all 0.3s ease; cursor: pointer; border: 2px solid #8f9197; background-position: 50% 50%}
.checkbox + em + span  {display: inline-block; vertical-align: middle; font-size:13px; margin:-2px 0 0 6px; cursor: pointer; }
.checkbox:checked + em { border-color:#3f5cff; background:#3f5cff url(../img/common/ico_checkbox.png) no-repeat 50% 50% !important;}
.checkbox:disabled + em { background-color:#f0f0f0; }
.checkbox:checked:disabled + em { background-color:#f0f0f0; border-color:#e1e1e1; background-image:url(../img/bu_checkbox2_disabled.png)}


/***********************************************************************************************
	Common
***********************************************************************************************/
body { word-break: keep-all; word-wrap: break-word; background: #fff; }
.inner { max-width:1200px; margin: 0 auto;   }

#s-header { height:100px; position: relative; z-index:1000; }
h1 { position: absolute; left: 30px; top:30px; }
#s-gnb{  position: absolute; right:30px; top:0; } 
#s-gnb > ul:after { display: block; content: ''; clear: both; }
#s-gnb > ul > li {float:left; position: relative;  }
#s-gnb .btn-dep1 { display: block; height:100px; line-height: 100px; font-size:19px; color: #fff; padding: 0 35px; position: relative;}
#s-gnb .btn-dep1 span { display:block; font-size:13px; position:absolute; top:25px; left:20px; right:20px; text-align:center; }
#s-gnb .btn-dep1:before { content:''; position: absolute; left: 0; right:0; bottom:0; height:0; background: #b6ce57; opacity:0; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; }
#s-gnb > ul > li:hover .btn-dep1:before {  height:5px; opacity:1; }
#s-gnb .dep2 { display: none; position: absolute; left: 0; right:0; top:100px; height: 190px; padding-top:15px; z-index:10; padding-left: 40px; }
#s-gnb .btn-dep2 { display: block; font-size:15px; line-height: 26px; color: #fff; font-family: 'noto'; font-weight: 200; white-space: nowrap; transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
#s-gnb .btn-dep2:hover { color: #d9ec8d; }
#s-header .bg-menu { position: absolute; left: 0; right:0; top:100px; height:190px; display:none; background: rgba(2,25,23,0.7);  }

.hd_admin { position: fixed; bottom: 10px; left: 10px; z-index:1000;}
.hd_admin a { padding: 0 20px; display: inline-block; line-height: 35px; background: #008b44; z-index: 999; color: #fff; transition: background-color 0.3s ease-out; }
.hd_admin a i { padding-left:-2px; }
.hd_admin a:hover, .hd_admin a:focus { background:#8aa51f; }

#s-footer { padding:30px 0; background: #474747; margin-top:120px;  }
#s-footer .inner { position: relative; padding-left: 130px; }
#s-footer .logo { position: absolute; left: 0; top:0; }
#s-footer .info { font-size:12px; color: #9a9898; line-height: 1.7; margin-bottom:5px; }
#s-footer .info a {color:#ddd;}
#s-footer .info li {display:inline-block; }
#s-footer .info li:after {content:'|';margin:0 11px 0 14px;}
#s-footer .info li:last-child:after { content:'';margin:0; }

html,body,#s-wrap,.bx-wrapper,.bx-viewport,.visual-box { height: 100% !important; }
.visual-wrap { position: fixed; left: 0; right:0; top:0; bottom:0; }
.visual-box div { height: 100%; }
.visual-wrap .bg1 { background: url(../img/main/visual1.jpg) no-repeat 50% 50%; background-size:cover; }
.visual-wrap .bg2 { background: url(../img/main/visual2.jpg) no-repeat 50% 50%; background-size:cover; }
.visual-wrap .bg3 { background: url(../img/main/visual3.jpg) no-repeat 50% 50%; background-size:cover; }
/* .main-box { position: absolute; left: 0; right:0; top:0; bottom:0; text-align: center; z-index:100; }*/
.main-box > div { display: table ;width:100%; height: 100%; }
.main-box > div > div{ display: table-cell; vertical-align: middle; text-align: center; }
.main-box .t1 { font-size:41px; color: #fff; font-weight: 700; padding-bottom: 30px; position: relative; }
.main-box .t1:before { content: ''; position: absolute;bottom:0; left: 50%; margin-left: -40px; width:80px; height: 0px; background: #fff; }
.main-box .t2 { font-size:22px; color: #fff; font-weight: 300; margin-bottom: 40px; }
.main-box a { display: inline-block; vertical-align: top; width:140px; height: 45px; line-height: 43px; font-size:16px; color: #fff; border: 1px solid #fff; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; }
.main-box a img { vertical-align: middle;  margin:-3px 0 0 7px;}
.main-box a:hover { background-color:rgba(0,0,0,0.2);}
.main-btns { position: absolute; left: 50%; bottom:0; margin-left: -300px; border-left: 1px solid #fff; z-index:100; }
.main-btns a { float:left; width:200px; height: 50px; line-height: 48px; font-size:18px; color: rgba(255,255,255,0.5); text-align: center; border: 1px solid #fff; border-bottom: 0; border-left: 0; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
.main-btns a:hover { color: #fff; background-color:rgba(255,255,255,0.2); }




.sub-visual { margin-top:-100px;  height: 340px; background: url(../img/common/bg_header.jpg) no-repeat 50% 50%; background-size:cover; text-align: center; }
.sub-visual h2 { padding-top:140px; color: #fff;  }
.sub-visual h2 small { font-size:24px; }
.sub-visual h2 strong { display: block; font-size:67px; font-weight: 600; }

.sub-nav { text-align: center; height: 60px; border-bottom: 1px solid #ddd; margin-bottom: 100px;  }
.sub-nav a { display: inline-block; vertical-align: top; line-height: 59px; font-size:18px; color: #666666;   transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
.sub-nav a + a { padding-left: 25px; margin-left: 24px; position: relative;}
.sub-nav a + a:before { content: ''; position: absolute; left: 0; top:21px; width:1px; height: 18px; background: #cccccc;}
.sub-nav a.active {color: #008b44; font-weight: 600; }
.sub-nav a:hover {color: #8aa51f; font-weight: 600; }

h3 { text-align: center; font-size:40px; font-weight: 700; color: #222; position: relative; padding-bottom: 80px; margin-bottom: 70px; }
h3:before { content: ''; position: absolute; left: 50%; bottom:0; width:1px; background: #222; height:58px; }
.desc { text-align: center; color:#777; margin:-50px 0 50px; word-break:keep-all; }


.sub1-1-1{ background: url(../img/sub1/img1_1.png) repeat-x 50% 0; height: 379px;  }
.sub1-1-1 p { padding-top:50px; text-align: center;}
.sub1-1-2 { text-align: center; margin-top:-85px; }
.sub1-1-3 { text-align: center; padding-top:30px;  }  

.sub1-3-1{ background: url(../img/sub1/img3.png) repeat-x 50% 0; height: 339px;  }
.sub1-3-2 .body { position: relative; padding-bottom:100px; max-width:1200px; margin:0 auto; }
.sub1-3-2 .body:before { content: ''; position: absolute; left: 50%; top:0; bottom:0; width:1px; background: #cd9e72; }
.sub1-3-2 .body .article:after { display: block; content: ''; clear: both; }
.sub1-3-2 .body .article > div { position: relative; width:50%; margin-top:75px; }
.sub1-3-2 .body .article > div:after { content: ''; position: absolute; left: 0; top:29px; width:62px; height:1px; background: #008b44; }
.sub1-3-2 .body .article > div:before { content: ''; position: absolute; top:20px; left:-9px; background: url(../img/sub1/ico_history.png) no-repeat 0 0; width:18px; height: 18px; z-index:2; }
.sub1-3-2 .body .fr { padding:0 10px 0 80px; }
.sub1-3-2 .body h4 { font-size:37px; color: #171717; font-weight: 700; margin-bottom: 5px;}
.sub1-3-2 .body p {font-size:15px;color: #666; margin-bottom: 7px; }
.sub1-3-2 .body .fl { text-align: right; padding-right:80px; }
.sub1-3-2 .body .article .fl:before { left: inherit; right:-9px; }
.sub1-3-2 .body .article .fl:after { left: inherit; right:0; }

#map1 { height:550px; margin-bottom: 40px;  }
.sub1-6-2 { text-align: center; font-size:16px; line-height: 2; color: #333333; }
.sub1-6-2 strong { display: block; font-size:42px; font-weight: 700; margin-bottom: 30px; }

.sub2-1-1{ background: url(../img/sub2/img1_1.png) repeat-x 50% 0; height: 379px; margin-bottom: 70px; }
.sub2-1-1 p { text-align: center; padding-top:165px; }

.sub2-2-1{ background: url(../img/sub2/img2_1.png) repeat-x 50% 0; height: 379px; margin-bottom: 70px; }
.sub2-2-1 p { text-align: center; padding-top:160px; }

.sub2-3-2{ background: url(../img/sub2/img3_2.png) repeat-x 50% 0; height: 379px; margin:70px 0; }
.sub2-3-2 p { text-align: center; padding-top:120px; }		 

.sub3-1-1{ background: url(../img/sub3/img1_1.png) repeat-x 50% 0; height: 639px;margin-bottom: 100px;}
.sub3-1-1 p { text-align: center; padding-top:60px; }

.sub3-4-1{ background: url(../img/sub3/img4_1.png) repeat-x 50% 0; height: 553px;margin-bottom: 70px;}
.sub3-4-1 p { text-align: center; padding-top:70px; }
.sub3-4-2 { margin-bottom: 120px; }

.sub4-1-1 { margin-bottom: -60px; position:relative; z-index:100;}
.sub4-1-2{ background: url(../img/sub4/img1_1.png) repeat-x 50% 0; height:639px;margin-bottom: 70px;}
.sub4-1-2 p { text-align: center; padding-top:110px; }

.prd-list { width:1200px; margin: 0 auto; }
.prd-list .list:after { display: block; content: ''; clear: both; }
.prd-list .list {display:flex; flex-wrap:wrap; justify-content:center; align-content:flex-start; align-items:stretch; }
.prd-list .list li { /*float: left;*/ width:50%; margin-bottom:40px;  }
.prd-list .list li:nth-child(odd) { padding-right:20px; }
.prd-list .list li:nth-child(even) { padding-left:20px; }
.prd-list .list li .box { padding-left: 229px; position: relative; }
.prd-list .list li .box .img { position: absolute; left: 0; top:15px; }
.prd-list .list li .box .img img { max-width:200px; }
.prd-list .list li .box .img-big { display:none; }
.prd-list .list li .box .info { font-size:14px; line-height: 1.7;  }
.prd-list .list li .box .info .tit { font-size:33px; color: #033333; font-weight: 700; margin-bottom: 10px; }
.prd-list .list li .box .info .tit strong { display: inline-block; vertical-align: middle; position: relative; padding:0 4px; font-weight: 700;}
.prd-list .list li .box .info .tit strong:before { content: ''; position: absolute; left: 0; right:0; bottom:10px; height: 7px; border-radius:7px; background: #78a772; }
.prd-list .list li .box .info .tit strong em { display: inline-block; position: relative; z-index:2;}
.prd-list .list li .box .info .t1 { margin-bottom: 15px; }
.prd-list .list li .box .info .t2 { margin-bottom: 20px; }
.prd-list .list li .box .info .s-tit { padding-left: 17px; font-size:18px; font-weight: 600; color: #278015; margin-bottom: 4px; position: relative; line-height: 1; }
.prd-list .list li .box .info .s-tit:before { content: ''; position: absolute; left: 0; top:4px; width:10px; height: 10px; border-radius:100%; border: 2px solid #6c801d;}
.prd-list .list li .box .info .btn-view { display: inline-block; width:128px; height: 40px; line-height: 38px; text-align: center; font-size:14px; color: #333; background: #ebefdc; border: 1px solid #ccc; }

.sub5-1-1{ background: url(../img/sub5/img1_1.png) repeat-x 50% 0; height: 379px;}
.sub5-1-1 p { text-align: center; padding-top:140px; }
.sub5-1-2 { margin-bottom: 120px; }

.column-list { width:1200px; margin: 0 auto;}
.column-list .list:after { display: block; content: ''; clear: both; }
.column-list .list li { width:570px;  position: relative; margin: 0 auto 50px; }
.column-list .list li:nth-child(even) { float:right; }
.column-list .list li .box { border: 1px solid #ccc; position: relative; height: 347px; padding:20px 0 0  240px; }
.column-list .list li .box .img { position: absolute; left: 0; top:0; }
.column-list .list li .box .info { position: relative; height: 307px; }
.column-list .list li .box .info .tit { font-size:24px; line-height: 1.3; color: #222; position: relative; padding-top:11px; font-weight: 600; margin-bottom: 20px; }
.column-list .list li .box .info .tit:before { content: ''; position: absolute; left: 0; top:0; width:38px; height: 4px; background: #333; }
.column-list .list li .box .info .turn {height: 187px;overflow-y: auto; }
.column-list .list li .box .info .turn::-webkit-scrollbar {width: 5px;background-color:#fff;}
.column-list .list li .box .info .turn::-webkit-scrollbar-track {width: 3px;background-color:#ddd;}
.column-list .list li .box .info .turn::-webkit-scrollbar-thumb {width: 3px;background-color:#999;}
.column-list .list li .box .info .turn a { display: inline-block; vertical-align: top; width:42px; height: 22px; text-align: center; line-height: 20px; border: 1px solid #ccc; font-size:13px; color: #333; margin-bottom: 4px; transition:all 0.3s ease; -webkit-transition:all 0.3s ease; }
.column-list .list li .box .info .turn a:hover { background: #8aa51f; border-color:#8aa51f; color: #fff; }
.column-list .list li .box .info .writer { position: absolute; left: 0; bottom:0px; font-size:16px; word-break:keep-all; }

.news-list { width:780px;margin: 0 auto; }
.news-list .list { border-top:2px solid #333; margin-bottom:30px; }
.news-list .list li { padding:30px 18px; border-bottom: 1px solid #ccc; }
.news-list .list li .box a { display: block; }
.news-list .list li .box a .in { display: table; width:100%;  }
.news-list .list li .box a .in .img { display: table-cell; width:255px; vertical-align: middle;}
.news-list .list li .box a .in .img img { width:255px; height: 170px; }
.news-list .list li .box a .in .info { display: table-cell; vertical-align: middle; padding-left: 20px; }
.news-list .list li .box a .in .info strong { display: block; font-size:20px; color: #222; font-weight: 700; margin-bottom: 15px; }
.news-list .list li .box a .in .info .text {font-size:14px; color: #777; line-height: 20px; max-height: 60px; overflow: hidden; margin-bottom: 20px;  }
.news-list .list li .box a .in .info .date { font-size:14px; color: #777;  }
.news-list .list li .box a .in .info .date span + span:before { content: '|'; margin:0 10px;}

.news-list .list-paper { border-top:2px solid #333; margin-bottom:30px; }
.news-list .list-paper li { padding:18px; border-bottom: 1px solid #ccc; }
.news-list .list-paper li .box a { display: block; }
.news-list .list-paper li .box a .in { display: table; width:100%;  }
.news-list .list-paper li .box a .in .info { display: table-cell; vertical-align: middle; }
.news-list .list-paper li .box a .in .info strong { display:inline-block; width:calc(100% - 80px); font-size:20px; line-height: 30px; color: #222; font-weight: 700; }
.news-list .list-paper li .box a .in .info .text { font-size:14px; color: #777; line-height: 20px; max-height: 60px; overflow: hidden; margin-bottom: 20px;  }
.news-list .list-paper li .box a .in .info .date { display:inline-block; float:right; font-size:14px; line-height: 30px; color: #777;  }
.news-list .list-paper li .box a .in .info .date span + span:before { content: '|'; margin:0 10px;}

/*교육동영상 class 분리*/
.video-list { width:780px; margin: 0 auto; }
.video-list .list { border-top:2px solid #333; margin-bottom:30px; }
.video-list .list li { padding:30px 18px; border-bottom: 1px solid #ccc; }
.video-list .list li .box a { display: block; }
.video-list .list li .box a .in { display: table; width:100%;  }
.video-list .list li .box a .in .img { display: table-cell; width:255px; vertical-align: middle;}
.video-list .list li .box a .in .img iframe { width: 384px;height: 228px; }
.video-list .list li .box a .in .info { display: table-cell; vertical-align: top; padding-left: 20px; }
.video-list .list li .box a .in .info strong { display: block; font-size:20px; color: #222; font-weight: 700; margin-bottom: 15px; }
.video-list .list li .box a .in .info .text {font-size:14px; color: #777; line-height: 20px; max-height: 60px; overflow: hidden; margin-bottom: 20px;  }
.video-list .list li .box a .in .info .date { font-size:14px; color: #777;  }
.video-list .list li .box a .in .info .date span + span:before { content: '|'; margin:0 10px;}


/* #wr_link2 { display:none; } */


h5 { text-align:center; font-size:30px; color:#576aa0; padding-bottom:15px; position:relative;  font-weight:700; margin-bottom:60px; }
h5:before { content:''; position:absolute; left:50%; bottom:0; margin-left:-13px; width:26px; height:4px; background:#576aa0; }

.after-list { width:1200px; margin:0 auto; }
.after-list > ul:after { display:block; content:''; clear:both; }
.after-list > ul { margin:0 -11px; }

.after-list > ul li { float:left; width:384px; height:400px; text-align:center; margin:0 11px;  }
.after-list > ul li a { display:block; }
.after-list > ul li .img { margin-bottom:15px; position:relative; }
.after-list > ul li .img img { width:384px; height:246px; }
.after-list > ul li .img p { position:absolute; left:0; right:0; bottom:0; padding:16px 0; text-align:center; background:rgba(0,0,0,0.7); color:#fff; font-size:14px; }
.after-list > ul li .txt { font-size:18px; color:#333; }

.btn-m { display:none; position: absolute; right:10px; top:10px; margin-top:0; padding:3px 4px 0 5px; }
.btn-m span { display:block;height:2px; width:27px; background:#fff; transition:all 0.3s ease; -webkit-transition:all 0.3s ease;  }
.btn-m span:nth-child(2) { width:22px; margin:6px 0 6px 5px;}
	
.all-menu { position:fixed;  width:300px; right:-300px; top:0; bottom:0;  transition: all 0.3s ease; -webkit-transition: all 0.3s ease; background:#273e0d; z-index:1000;}	
.all-menu .head  { z-index:20; position:relative; }
.all-menu .head .logo { display:none; }
.all-menu .head .btn-close { position:absolute; right:15px; top:15px; width:27px; height: 27px; background:url(/img/common/btn_all_close.png)no-repeat 50% 50%;  background-size:27px auto; transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition-delay: 0.3s; -webkit-transition-delay: 0.3s; }
body.mobile .all-menu .head .btn-close { transform: rotate(180deg)}
.all-menu .body { position: absolute; left: 0; right:0; top:0; bottom:0; overflow: auto; padding-top:60px; }
.all-menu .body .menu { position: static; transform: translateY(0); -webkit-transform: translateY(0)}
.all-menu .body .menu > ul { display: block; }
.all-menu .body .menu > ul > li { display: block; width:auto; }
.all-menu .body .menu .dep2 { display: none; margin:0 -15px; padding:015px; background:rgba(255,255,255,0.1); }
.all-menu .body .menu .btn-dep1 { padding-left:15px; display:block;  font-size:20px; padding:10px 15px; color:#fff; }
.all-menu .body .menu .btn-dep1 span { display:block; font-size:13px; }
.all-menu .body .menu .dep2 .btn-dep2 { font-size:14px; color:#eee; display:block; padding:6px 15px; }


body.fixed .all-menu { right:0; }

.sub1-1 { width:100%; margin:0 auto; }
.sub1-1.pc { max-width:860px; }
.play .player { position:relative; width: 100%; padding-bottom: 56.25%; height: 0; background: #000; margin-bottom:30px; }
.play .player iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; }

.sub1-2 { max-width:1126px; width:100%; margin:0 auto; position:relative;}
.sub1-2 .play { position: absolute; width:calc(50% + 20px); left:calc(50% - 20px); z-index:50px; }
.sub1-2 .play .player { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; background: #000; margin-bottom:30px; }
.sub1-2 .play .player iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; }

.sub3-1-3 { padding:230px 15px; background:url(/img/sub3/new_bg.png) no-repeat 50% 50%; background-size:cover; text-align:center; }
.sub3-1-4 { margin:-40px 0 100px; text-align:center; }
.sub3-1-4 .mobile { margin-top:60px; }

.sub7-1-1{ background: url(../img/sub7/img1_1.png) repeat-x 50% 0; height: 379px; margin-bottom: 70px; }
.sub7-1-1 p { text-align: center; padding-top:165px; }


.m { display:none; }
.sub1-4-2 { display:none; }

a.btn_b02, .btn_b02 { display: inline-block; background: #008b44; padding: 0 20px; color: #fff; text-decoration: none; border: 0; border-radius: 0; font-weight: normal; font-size:16px; vertical-align: middle; }
a.btn_b02 i, .btn_b02 i { padding-left:-2px; }
a.btn_b02:hover, .btn_b02:hover,
a.btn_b02:focus, .btn_b02:focus { background:#8aa51f; }
.after-list .bo_fx,
.sub1-3-2 .bo_fx { display:block; width:100%; margin-bottom:30px; }

.pg_page, .pg_current {display:inline-block;vertical-align:middle;border:1px solid #ddd;}
.pg_page {color:#555;font-size:16px;height:30px;line-height:26px;padding:0 5px;min-width:30px;text-decoration:none;border-radius:3px;transition:all 0.3s ease-out;}
.pg_page:hover,
.pg_start:hover, .pg_prev:hover, .pg_end:hover, .pg_next:hover {background-color:rgba(138,165,31,0.3); border-color:rgba(138,165,31,0.3);}
.pg_current {display:inline-block;background:#008b44;border-color:#008b44;color:#fff;font-weight:bold;height:30px;line-height:26px;padding:0 10px;min-width:30px;border-radius:3px;box-shadow: none;transition: all 0.3s ease-out; }
.pg_current:hover { background:#8aa51f; border-color:#8aa51f; }

#bo_w,
#bo_v { max-width:1200px; width:100%; margin:0 auto; padding:0 15px; }

@media all and (max-width:1200px) {
	.pc { display:none; }
	.m { display:block; margin:0 auto; }
	#s-header { height:45px; position:fixed; left:0; right:0; top:0; z-index:1000; background:rgba(0,0,0,0.5); }
	.btn-m { display:block; }
	#s-gnb { display:none; }
	h1 { left:20px; top:10px; }
	h1 img { height:25px; }
	.main-box .t1 { font-size:24px; }
	.main-box .t2 { font-size:13px; margin-bottom: 15px;}
	.main-btns { left:0; right:0; bottom:0; width:auto; margin:0; }
	.main-btns a { width:33.3333%; }
	.sub-visual h2 small { font-size:16px; }
	.sub-visual h2 strong { font-size:40px; }
	.sub-visual { margin-top:0; height:170px; }
	.sub-visual h2 { padding-top:60px; }
	.sub-nav { height:40px; margin-bottom:25px; }
	.sub-nav a { font-size:12px; line-height:40px; }
	.sub-nav a + a { padding-left:7px; margin-left:6px; }
	.sub-nav a + a:before { top:14px; height:14px; }
	h3 { font-size:30px; margin-bottom:40px; padding-bottom:40px; }
	h3:before { height:25px; }
	.desc { font-size:14px; margin:-30px 0 30px; padding:0 18px;}


	.sub1-1-1 { padding:40px 20px 110px; height:auto; }
	.sub1-1-1 p { padding:0; }
	.sub1-1-3 { padding:0 20px; }
	.sub1-2 { padding:0 20px; }
	.sub1-2 .play { position:relative; width:100%; left:0; z-index:50px; }

	.sub1-3-2 .head { padding:60px 10px; }
	.sub1-3-2 .head div { float:none; width:auto; font-size:24px; text-align: center;}
	.sub1-3-2 .body:before { left:20px; top:-30px; }
	.sub1-3-2 .body .article .fl:before { left:-8px; right:inherit; }
	.sub1-3-2 .body .article .fl:after { right:inherit; left:-1px;}
	.sub1-3-2 .body { padding:0 20px 50px;}
	.sub1-3-2 .body .article > div { float:none; width:auto; text-align: left; padding:0 0 0 50px; margin-top:30px; }
	.sub1-3-2 .body .article > div:after { width:40px; }
	.sub1-3-2 .body h3 { font-size:30px; padding-top:8px; }
	.sub1-3-2 .body dl { font-size:13px; margin-bottom: 10px; }
	.sub1-3-2 .body .fl dt { float:left; margin:0 15px 0 0; }
	.sub1-3-2 .body .fl dd { float:none; }
	.sub1-3-2 .body .article:last-child dl:last-child { margin-bottom:0; padding-bottom: 60px; }
	.sub1-3-2 .body .article > div.fr { float:left !important; }
	.sub1-3-1 { height:200px; position:relative; z-index:10; }
	
	.sub1-4 { overflow:auto  }
	.sub1-4-2 { display:block; font-size:11px;  color:#777; padding-top:10px; text-align:center; }
	.sub1-5 { padding:0 15px; }
	#map1 { height:250px; }
	.sub1-6-2 strong { font-size:30px; }
	.sub1-6-2 { font-size:12px; letter-spacing:-1px; padding-left:10px; padding-right:10px;  }
	.sub2-1-1 { padding:100px 10px; height:auto; background-size:cover; }
	.sub2-1-1 p { padding:0; }
	.sub2-1-2 { padding:0 15px; }
	.sub2-2-1 { padding:70px 15px; height:auto; background-size:cover;  }
	.sub2-2-1 p { padding:0; }
	h5 { font-size:18px; margin-bottom:25px; }
	.after-list { width:auto; }
	.after-list ul { margin:0; padding:0 10px;  }
	.after-list ul li { float:none; width:100%; margin:0 0 30px; height:auto; }
	.after-list ul li .img img { width:100%; height:auto; }
	.sub2-3-1,
	.sub2-3-3 { padding:0 15px; }
	.sub2-3-2 { margin:20px 0; padding:80px 15px; background-size:cover;  height:auto; }
	.sub2-3-2 p{ padding:0; }
	.sub3-1-2 { padding:0 15px; }
	.sub3-1-1 { height:auto; padding:50px 15px; background-size:cover; }
	.sub3-1-1 p { padding:0; }
	.sub3-1-3 { padding:70px 15px; background-size:cover; }
	.sub3-3-1  { padding:0 15px 30px; }
	.sub3-4-1 { padding:70px 15px; height:auto; background-size:cover; }
	.sub3-4-1 p { padding:0; }
	.sub3-4-2 { padding:0 15px; margin-bottom:40px; }
	.sub3-4-3 { padding:0 15px; }
	.sub4-1-2 { height:auto; padding:70px 15px; }
	.sub4-1-2 p { padding:0; }
	.prd-list { width:auto; }
	.prd-list .list {display:block;}
	.prd-list .list li { float:none; width:100%;}
	.prd-list .list li:nth-child(odd),
	.prd-list .list li:nth-child(even) {padding:0 15px;}
	.prd-list .list li .box { padding-left:120px; }
	.prd-list .list li .box .img img { width:110px; }
	.prd-list .list li .box .info .tit { font-size:20px; }
	.prd-list .list li .box .info { font-size:13px; }
	.prd-list .list li .box .info .t1 { word-break:keep-all; }
	.sub4-3-1  { padding:0 15px; }
	.sub5-1-1 { height:auto; padding:70px 15px; }
	.sub5-1-1 p { padding:0; }
	.sub5-1-2 { padding:0 15px; }
	.sub5-2-1 { padding:0 15px; }
	.column-list { width:auto; padding: 0 20px 30px;  }
	.column-list .list li { float:none !important; width:100%; height:auto;  }
	.column-list .list li .box .img img { width:100px; }
	.column-list .list li .box { padding:10px 10px 10px 110px; height:auto; }
	.column-list .list li .box .info .tit { font-size:16px; }
	.column-list .list li .box .info { height:auto; padding-bottom:70px; }
	.column-list .list li .box .info .writer { font-size:13px; }
	.news-list{  width:auto; }
	.news-list .list li .box a .in { display:block; }
	.news-list .list li .box a .in .img { display:block; width:auto; margin-bottom:10px; }
	.news-list .list li .box a .in .img img { width:auto; height:100px; }
	.news-list .list li .box a .in .info { display:block; padding-left:0; }
	.news-list .list li .box a .in .info strong { font-size:17px; margin-bottom:10px;  }
	.news-list .list li .box a .in .info .text { font-size:13px; margin-bottom:10px;  }
	.news-list .list li .box a .in .info .date{ font-size:13px; }
	.news-list .list-paper li .box a .in { display:block; }
	.news-list .list-paper li .box a .in .info { display:block; padding-left:0; }
	.news-list .list-paper li .box a .in .info strong { font-size:17px; line-height:24px; }
	.news-list .list-paper li .box a .in .info .text { font-size:13px; margin-bottom:10px; line-height:24px; }
	.news-list .list-paper li .box a .in .info .date{ font-size:13px; line-height:24px; }
	.video-list{  width:auto; }
	.video-list .list li .box a .in .info strong { font-size:17px; margin-bottom:10px;  }
	.video-list .list li .box a .in .info .text { font-size:13px; margin-bottom:10px;  }
	.video-list .list li .box a .in .info .date{ font-size:13px; }
	.sub7-1-1 { padding:100px 10px; height:auto; background-size:cover; }
	.sub7-1-1 p { padding:0; }
	.sub7-1-2 { padding:0 15px; }
	
	#s-footer { margin-top:90px; text-align:center; }
	#s-footer .inner { padding:0; }
	#s-footer .logo { position:static; margin-bottom:10px; }
	#s-footer .logo img { height:35px; }
	#s-footer .info { font-size:10px; line-height:1.3; }
}	


@media all and (max-width:640px) {
	.prd-list .list li { width:100%; }

	.video-list .list li .box a .in { display:block; }
	.video-list .list li .box a .in .img { display:block; position: relative; width: 100%; padding-bottom: 56.25%; height: 0; background: #000; margin-bottom:10px; }
	.video-list .list li .box a .in .img iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 100%; max-height: 100%; }
	.video-list .list li .box a .in .info { display:block; padding-left:0; }

}