/*common*/
.float_l {float: left}
.float_r {float: right}
.pc_hide {display: none}
.serif {font-family:'NotoSerifKr-Regular', serif !important;}

/*header*/
#header {width: 100%; padding: 20px 0 18px; box-sizing: border-box; background-color: #fff; height: 80px; border-bottom: 1px solid #fff; position: fixed; top: 0; left: 0; z-index: 10; background: none; min-width: 1180px}
#header:hover {background: rgba(40,40,40,0.6)}
#header.active {background-color: rgba(40,40,40,0.6)}
#header .layout {zoom : 1}
#header .layout:after {clear: both; content: ''; display: block}
#header .logo {width: 110px; height: 45px; float: left; margin-right: 170px}
#header .logo>a {background-position: 0px 0; width: 100%; height: 100%}
#header .gnb_pc {float: left; zoom : 1; margin-top: 5px}
#header .gnb_pc:after {clear: both; content: ''; display: block}
#header .gnb_pc>li {float: left; margin-right: 82px}
#header .gnb_pc>li:last-child {margin-right: 0}
#header .gnb_pc>li>a {font-size: 16px; color: #fff; font-weight: 300}
#header .gnb_pc.depth1 .depth2 {position: absolute; top: 96px; z-index: 50; text-align: center; display: none}

#header .gnb_pc.depth1 .depth2>li {margin-bottom: 25px}
#header .gnb_pc.depth1 .depth2>li>a {color: #fff; font-weight: 300; font-size: 16px}
#header .gnb_pc.depth1 .depth2.mlA1 {margin-left: -13px}
#header .gnb_pc.depth1 .depth2.mlA2 {margin-left: -28px}
#header .gnb_pc.depth1 .depth2.mlA3 {margin-left: -7px}
#header .gnb_pc.depth1 .depth2.mlA5 {margin-left: -7px}

#header .gnb_bg {width: 100%; /*height: 380px;*/ background-color: rgba(40,40,40,0.6); position: absolute; top: 80px; z-index: 5; height: 0}

#header .gnb_pc.depth1 .depth2.active {animation: gnb1 0.5s ease-in forwards}
#header .gnb_bg.active {animation: gnb2 0.5s ease-in forwards}

@keyframes gnb1{
	from {opacity: 0}
	to {opacity: 1}
}

@keyframes gnb2{
	from {height: 0}
	to {height: 400px}
}

#header .util {float: right; margin-top: 3px}
#header .util .btn_login {width: 87px; height: 28px; border: 1px solid #fff; color: #fff; font-size: 16px; border-radius: 20px; display: inline-block; line-height: 28px; text-align: center; margin-right: 29px}
#header .util .btn_login:hover {text-decoration: none}
#header .util .lang {font-weight: 600; font-size: 16px; color: #fff; margin-right: 30px; width: 85px; height: 30px; text-align: center; line-height: 30px; border: 1px solid #fff; border-radius: 25px; vertical-align: top; margin-top: 1px; cursor: pointer; display: inline-block}
#header .util .lang:hover, #header .util .lang:active, #header .util .lang:focus {text-decoration: none}
#header .util .lang>option {color: #000}
#header .util .btn_menu {width: 23px; height: 20px; background-position: 0px -46px; cursor: pointer; margin-top: 6px}

/*container*/
#container .mainVisual {position: relative; width: 100%; height: 740px; position: relative; min-width: 1180px}
#container .mainVisual div[class*="main0"] {position: relative; width: 100%; height: 100%; min-width: 1180px}
#container .mainVisual .main01 {background: url(/img/mainvisual.png) no-repeat}
#container .mainVisual .main02 {background: url(/img/mainvisual02.png) no-repeat; background-size: cover; }
#container .mainVisual .txt {width: 707px; height: 265px; position: absolute; top: 93px; left: 0; box-sizing: border-box; padding: 40px 0 40px 190px}

#container .mainVisual div[class*="main0"] {padding-top: 166px; box-sizing: border-box; width: 100%; text-align: center; min-width: 1180px}

#container .wrap_mainVisual .wrap_txt {position: absolute; top: 169px; width: 100%;}
#container .wrap_mainVisual .wrap_txt>p {width: 100%; text-align: center; color: #fff}
#container .wrap_mainVisual .wrap_txt .tit {font-size: 45px; color: #fff; text-shadow: 2px 2px 23px rgba(40,51,40,0.8); font-weight: 300}
#container .wrap_mainVisual .tit>span {font-weight: 500}
#container .wrap_mainVisual .wrap_txt .exp {font-size: 22px; color: #fff; margin-top: 10px; text-shadow: 2px 2px 32px rgba(13,26,30,0.7); font-weight: 300}

#container .wrap_mainVisual .wrap_cir {position: absolute; top: 408px; left: 50%; margin-left: -390px; width: 780px; height: 256px}
#container .wrap_mainVisual .txt {width: 245px; height: 245px; border-radius: 50%; margin-right: 20px; display: inline-block; vertical-align: middle; position: relative; padding: 0; overflow: hidden; }
#container .wrap_mainVisual .txt:last-child {margin-right: 0}
#container .wrap_mainVisual .wrap_cir div[class*="cir"] {width: 100%; height: 100%; text-align: center; color: #fff}
#container .wrap_mainVisual .cir:hover {transform: scale(1.08); transition: transform 0.2s ease-in-out;}
#container .wrap_mainVisual .txt01 {background: url(/img/cir01.png) #0968aa 50% top; background-size: cover}
#container .wrap_mainVisual .txt02 {background: url(/img/cir02.png) #569f4b 50% top; background-size: cover}
#container .wrap_mainVisual .txt03 {background: url(/img/cir03.png) #b3b3b3 50% top; background-size: cover}

#container .wrap_mainVisual .txt div[class*="icon"] {margin: 46px auto 0}
#container .wrap_mainVisual .txt01 .cir>.icon {background-position: 0px -71px; width: 54px; height: 54px;}
#container .wrap_mainVisual .txt02 .cir>.icon {background-position: -58px -71px; width: 56px; height: 38px; margin-top: 54px; margin-bottom: 9px}
#container .wrap_mainVisual .txt03 .cir>.icon {background-position: -119px -71px; width: 51px; height: 56px; margin-top: 41px}
#container .wrap_mainVisual .txt .tit {font-size: 23px; margin-top: 12px; font-weight: 500}
#container .wrap_mainVisual .cir02 .tit {margin-top: 18px}
#container .wrap_mainVisual .cir03 .tit {margin-top: 14px}
#container .wrap_mainVisual .exp {font-size: 14px; margin-top: 12px; line-height: 1.5; font-weight: 300}

#container .wrap_mainVisual .bx-wrapper .bx-pager {top: 44% !important; bottom: auto; right: 190px; width: auto;}
#container .bx-wrapper .bx-pager-item {display: block; margin-bottom: 25px}
#container .bx-wrapper .bx-pager-item>a {width: 21px; height: 23px; background: url(/img/pager.png) no-repeat}
#container .bx-wrapper .bx-pager-item>a.active {background: url(/img/pager.active.png) no-repeat}
#container .bx-wrapper .bx-controls .bx-controls-direction {display: none}


/*sec01*/
#container .sec {padding: 80px 0 95px; min-width: 1180px}
#container .sec .layout {padding: 0 30px; box-sizing: border-box}

#container .sec .first {width: 100%; height: 275px; position: relative}
#container .sec .first .slide {width: 100%; height: 100%; position: relative}
#container .sec .first .bx-wrapper {height: 100% !important}
#container .sec .first .bx-wrapper .bx-viewport {height: 100% !important}
#container .sec .first .bx-wrapper .bx-controls .bx-pager {position: absolute; width: auto; height: 30px; right: 68px; bottom: 30px; font-size: 28px; font-weight: 100; color: #fff }
#container .sec .first .page>div {float: left; width: 50%; height: 100%}
#container .sec .first .page {zoom : 1; height: 100%;}
#container .sec .first .page:after {clear: both; content: ''; display: block}
#container .sec .first .page .left {box-sizing: border-box; padding: 48px 50px 48px 70px; position: relative; height: 100%;}
#container .sec .first .p01 .left {background: url(/img/wave_pattern01.png) repeat;}
#container .sec .first .p02 .left {background: url(/img/wave_pattern02.png) repeat;}
#container .sec .first .p03 .left {background: url(/img/wave_pattern03.png) repeat;}
#container .sec .first .page .left p {color: #fff; font-weight: 300}
#container .sec .first .page .tit {font-size: 35px; font-weight: 500; position: relative}
#container .sec .first .page .tit:after {content: ''; position: absolute; width: 55px; height: 3px; left: 3px; bottom: -3px; background-color: #fff; }
#container .sec .first .page .exp {margin-top: 23px; font-size: 16px; text-overflow: ellipsis; height: 93px; overflow: hidden}
#container .sec .first .page .right .pager {position: absolute; width: auto; height: auto; bottom: 30px; right: 68px; font-size: 22px; color: #fff; line-height: 1}



#container .sec .first .p01 .right {background: url(/img/sec01_01.png) no-repeat; background-size: cover}
#container .sec .first .p02 .right {background: url(/img/sec01_02.png) no-repeat; background-size: cover}
#container .sec .first .p03 .right {background: url(/img/sec01_03.png) no-repeat; background-size: cover}
#container .sec .first div[class*="btn_"] {width: 19px; height: 33px; position: absolute; top: 45%; cursor: pointer}
#container .sec .first .btn_prev {background-position: -144px -154px; left: 30px}
#container .sec .first .btn_next {background-position: -119px -154px; right: 30px}

/*sec02*/
#container .sec .second {width: 100%; height: 342px; zoom: 1; margin-top: 30px}
#container .sec .second:after {clear: both; content: ''; display: block}
#container .sec .second>div {float: left}
#container .sec .second .notice {width: 498px; height: 100%; background-color: #e5e5e5; box-sizing: border-box; padding: 34px; margin-right: 10px}
#container .sec .second .notice .tit {font-size: 25px; position: relative; width: 100%; border-bottom: 2px solid #aaa; padding-bottom: 8px; font-weight: 600; color: #454545;}
#container .sec .second .notice .more {width: 17px; height: 17px; background-position: -119px -192px; position: absolute; right: 0; cursor: pointer; top: 2px; }
#container .sec .second .notice>ul {margin-top: 24px; width: 100%; }
#container .sec .second .notice>ul>li {margin-bottom: 15px; position: relative}
#container .sec .second .notice>ul>li .date {position: absolute; right: 0; font-size: 18px; color: #393939}
#container .sec .second .notice>ul>li>a {font-size: 18px; display: inline-block; width: 70%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color: #393939}

#container .sec .second .info {width: 712px; height: 100%;}
#container .sec .second .info p {color: #fff; width: 100%; text-align: center}
#container .sec .second .info .tit {font-size: 25px; margin-top: 76px; font-weight: 500}
#container .sec .second .info .exp {margin-top: 7px; font-size: 16px}
#container .sec .second .info .up {zoom : 1; height: 232px}
#container .sec .second .info .up:after {clear: both; content: ''; display: block}
#container .sec .second .info .up>a {width: 350px; height: 100%; float: left; overflow: hidden; position: relative; display: inline-block}
#container .sec .second .info .up .work {background: url(/img/sec02_01.png) no-repeat; margin-right: 10px}
#container .sec .second .info .up .ask {background: url(/img/sec02_02.png) no-repeat;}

#container .sec .second .info .up .move {width: 100%; height: 100%; position: absolute; top: 0; left: -351px; background-color: rgba(5,75,120,0.5)}
#container .sec .second .info .up .move>p {color: #fff; font-size: 35px; text-align: center; margin-top: 89px}
#container .sec .second .info .up .move>p>span {width: 39px; height: 20px; background-position: 0 -129px; margin-left: 12px; margin-top: 16px}

#container .sec .second .info .up>a:hover, #container .sec .second .info .up>a:focus, #container .sec .second .info .up>a:active {text-decoration: none}
#container .sec .second .info .up>a:hover>p {opacity: 0; transition: opacity 0.4s linear; -webkit-transition: opacity 0.4s linear}
#container .sec .second .info .up>a:hover .move {transform: translateX(351px); -ms-transform: translateX(351px);
-webkit-transform: translateX(351px);
-moz-transform: translateX(351px);
-o-transform: translateX(351px); transition: all 0.4s linear; -webkit-transition: all 0.4s linear;}

#container .sec .second .info .down .question {width: 100%; height: 100px; margin-top: 10px}
#container .sec .second .info .down .question>a {background-color: #0a69ab; color: #fff; font-size: 25px; font-weight: 600; text-align: center; line-height: 100px; cursor: pointer; display: inline-block; width: 100%; height: 100%}
#container .sec .second .info .down .question>a:hover, #container .sec .second .info .down .question>a:active, #container .sec .second .info .down .question>a:focus {text-decoration: none}

#container .sec .gt01 {position: absolute; width: 48px; height: 48px; background: url(/img/sp01.png) no-repeat; top: -52px; right: 30px;}
#container .sec .gt02 {position: absolute; width: 48px; height: 48px; background: url(/img/sp02.png) no-repeat; top: 30px; right: -85px;}


/*footer*/
#footer {width: 100%; padding: 47px 0 36px; background-color: #535353; color: #fff; font-weight: 300; box-sizing: border-box; min-width: 1180px}
#footer a {color: #fff}
#footer .layout {padding: 0 30px; box-sizing: border-box; zoom : 1}
#footer .layout:after {clear: both; content: ''; display: block}
#footer .left {float: left}
#footer .left>ul {zoom : 1}
#footer .left>ul:after {clear: both; content: ''; display: block}
#footer .left ul li {float: left; margin-right: 16px; font-size: 16px; position: relative}
#footer .left ul li:after {position: absolute; content: ''; width: 1px; height: 13px; background-color: #fff; top: 6px; right: -10px}
#footer .left ul li:last-child:after {display: none}
#footer .left>p {font-size: 16px; margin-top: 6px}

#footer .right {float: right; zoom : 1}
#footer .right:after {clear: both; content: ''; display: block}
#footer .right .personal {font-size: 16px; margin-right: 16px; position: relative; display: inline-block; width: 122px; vertical-align: middle; font-weight: 500}
#footer .right .personal:after {content: ''; position: absolute; width: 1px; height: 13px; top: 6px; right: -4px; background-color: #fff}
#footer .right .family {font-size: 16px; width: 100px; height: 28px; background: url(/img/arrow_w.png) no-repeat 98% 45%; color: #fff; border: none; display: inline-block; vertical-align: top; cursor: pointer; position: relative}
#footer .right .family>option {color: #000; }
#footer .right .f_list {position: absolute; top: -256px; background-color: #fff; width: 165px; border: 1px solid #ccc; left: -4px; display: none; box-sizing: border-box;}
#footer .right .f_list.active {display: block}
#footer .right .f_list>li {border-bottom: 1px solid #f4f4f4; width: 100%}
#footer .right .f_list>li:hover {background-color: #f4f4f4}
#footer .right .f_list>li>a {text-align: left; color: #000; width: 100%; display: inline-block; font-size: 16px; font-weight: 400; padding: 0 5px; box-sizing: border-box;}

#footer .right .f_logo {width: 110px; height: 45px; background-position: -144px 0; float: right; margin-top: 10px}


/*--------------영문--------------*/
#header.eng .logo>a {background-position: 0 -285px}
#header.eng .gnb_pc>li:last-child {width: 110px; text-align: center; margin-left: 30px}

#container.eng .wrap_mainVisual .wrap_txt .tit {font-weight: 500}
#container.eng .wrap_mainVisual .wrap_cir {width: 890px; margin-left: -445px}
#container.eng .wrap_mainVisual .txt {width: 260px; height: 260px}
#container.eng .wrap_mainVisual .txt div[class*="icon"] {margin-top: 42px}
#container.eng .wrap_mainVisual .txt .cir .exp {font-size: 16px}
#container.eng .wrap_mainVisual .txt02 .cir>.icon {margin-bottom: 11px; margin-top: 49px}
#container.eng .wrap_mainVisual .wrap_cir>div:last-child .tit {margin-top: 7px}
#container.eng .wrap_mainVisual .txt03 .cir>.icon {margin-bottom: 7px}
#container.eng .wrap_mainVisual .wrap_cir>div:last-child .cir .exp {margin-top: 11px}

#container.eng .first {padding: 100px 0; background-color: #eeeeee}
#container.eng .first .sec {zoom : 1; height: auto; padding: 0}
#container.eng .first .sec:after {clear: both; content: ''; display: block}
#container.eng .first .sec>div {float: left; width: 600px}
#container.eng .first .sec .left {margin-right: 19px}
#container.eng .first .sec .left .title {font-size: 40px; color: #282828; font-weight: 600; }
#container.eng .first .sec .left .title:after {width: 55px; height: 3px; background-color: #282828; content: ''; display: block;}
#container.eng .first .sec .left .exp {margin-top: 14px; font-size: 24px; color: #282828; font-weight: 500}
#container.eng .first .sec div[class*='img0'] {position: relative; width: 600px}
#container.eng .first .sec div[class*='img0'] .name {font-size: 24px; font-weight: 500; color: #fff; position: absolute}
#container.eng .first .sec .img01 {height: 379px; background: url(/img/e_main01.png) no-repeat; margin-top: 39px}
#container.eng .first .sec .img01 .name {top: 28px; right: 30px}
#container.eng .first .sec .right {margin-top: 78px}
#container.eng .first .sec .img02 {height: 269px; background: url(/img/e_main02.png) no-repeat; }
#container.eng .first .sec .img02 .name {left: 29px; bottom: 29px}
#container.eng .first .sec .img03 {height: 234px; background: url(/img/e_main03.png) no-repeat; margin-top: 20px}
#container.eng .first .sec .img03 .name {top: 31px; left: 28px}

#container.eng .second {padding: 104px 0 108px}
#container.eng .second a[class*='menu0'] {display: inline-block; width: 290px; height: 367px; margin-right: 20px; position: relative; vertical-align: top; position: relative}
#container.eng .second a[class*='menu0']>p {position: absolute; bottom: 27px; left: 30px; font-weight: 500; font-size: 24px; color: #fff}
#container.eng .second a[class*='menu0']>span {width: 38px; height: 20px; background-position: 0 -129px; position: absolute; bottom: 30px; right: 30px}
#container.eng .second a:hover, #container.eng .second a:focus, #container.eng .second a:active {text-decoration: none}
#container.eng .second .menu01 {background: url(/img/e_m01.png) no-repeat}
#container.eng .second .menu02 {background: url(/img/e_m02.png) no-repeat}
#container.eng .second .menu03 {background: url(/img/e_m03.png) no-repeat}
#container.eng .second .menu04 {background: url(/img/e_m04.png) no-repeat; margin-right: 0;}

/*footer*/
#footer.eng .right .f_list {top: -210px; left: -22px; width: 149px}
#footer.eng .right .f_logo {background-position: -145px -285px}


/*200224_팝업*/
.popup {position: fixed; left: 0; top: 0; width: 500px; z-index: 10; background-color: #fff; box-shadow: 4px 3px 15px rgba(0,0,0,.4);}
.popup .content {padding: 8px 8px 45px; width: 100%; box-sizing: border-box}
.popup .header {position: relative; margin-bottom: 45px; width: 100%; height: 60px; background: url(/img/gradient.jpg) no-repeat;}
.popup .header span {position: absolute; left: 11px; top: 11px; width: 98px; height: 40px; background: url(/img/popup_logo.png) no-repeat; overflow: hidden; line-height: 99999px}
.popup p {width: 100%; text-align: center}
.popup .tit {margin-bottom: 25px; font-size: 26px; font-weight: 600;}
.popup .txt {margin-bottom: 65px; font-size: 14px;}
.popup .grey {position: relative; margin: 0 auto 43px; width: 444px; /* min-height: 345px; */ background-color: #e5e5e5; box-sizing: border-box; padding: 30px;}
.popup .grey:before {content: '- 아 래 -'; display: block; font-size: 14px; text-align: center; letter-spacing: 4px; position: absolute; top: -40px; left: 50%; margin-left: -36.8px}
.popup .grey ul>li {position: relative; padding-left: 50px; margin-bottom: 12px; font-size: 14px;}
.popup .grey ul>li:last-child {padding: 0}
.popup .grey ul>li>span {font-weight: 600; position: absolute; left: 0;}
.popup .grey ul>li:last-child>span {position: relative}
.popup .grey ul>li .exp {font-size: 12px; font-weight: 600; margin: 7px 0; text-align: left; padding-left: 6px}
.popup .grey ul>li>ul {padding-left: 6px}
.popup .grey ul>li>ul>li {margin-bottom: 10px; font-size: 14px; padding: 0}
.popup .name {line-height: 1; font-size: 16px; font-weight: 600; margin-bottom: 15px}
.popup .addr {font-size: 14px;}

.popup .footer {width: 100%; height: 30px; background-color: #bfbfbf; box-sizing: border-box; padding: 8px 20px; position: relative}
.popup .footer #ck {width: 13px; height: 13px; border: 1px solid #000; background-color: #fff; margin-right: 6px; vertical-align: top; display: inline-block; margin-top: 2px}
.popup .footer label {font-size: 12px; line-height: 1; vertical-align: top; display: inline-block; margin-top: 2px}
.popup .footer .btn_close {position: absolute; right: 20px; top: 8px; font-size: 14px; line-height: 1}
.popup .footer .btn_close:before {content: 'X'; display: inline-block; margin-right: 7px; vertical-align: top; line-height: 1}


@media screen and (max-width: 800px){
	.layout {width: 100%; padding: 0 10px; box-sizing: border-box}
	.sp_com {background:url(/img/m_sp_com.png) no-repeat 0 0; background-size: 300px 300px}
	.pc_hide {display: block}
	.m_Non {display: none !important}
	
	/*header*/
	#header {padding: 12px 0; height: 50px; min-width: auto}
	#header .logo {width: 67px; height: 29px; margin-right: 0}
	#header .util {display: none}
	#header .m_menu {width: 17px; height: 17px; background-position: 0 -29px; float: right; margin-top: 3px}
	
	#header .m_gnb {width: 100%; background-color: #fff; position: absolute; left: 0; top: -12px; display: none}
	#header .m_gnb .header {border-bottom: 1px solid #c9c9c9; padding: 12px 25px; box-sizing: border-box; zoom : 1}
	#header .m_gnb .header:after {clear: both; content: ''; display: block}
	#header .m_gnb .header .logo {width: 67px; height: 28px; background-position: -141px 0;}
	#header .m_gnb .btn_close {width: 18px; height: 18px; background-position: -33px -68px; float: right; margin-top: 7px}
	
	#header .m_gnb .depth1>li {position: relative}	
	#header .m_gnb .depth1 a {font-size: 13px; color: #2e2e2e; display: inline-block; padding: 10px 26px; width: 100%; height: 100%; box-sizing: border-box; border-bottom: 1px solid #c9c9c9; }
	#header .m_gnb .depth1 a:hover, #header .m_gnb .depth1 a:focus, #header .m_gnb .depth1 a:active {text-decoration: none}
	#header .m_gnb .depth1 .depth2 {background-color: #f2f2f2; display: none}
	#header .m_gnb .depth1>li.active .depth2 {display: block}
	#header .m_gnb .depth1 .depth2>li>a {border-bottom: 1px solid #c9c9c9;}
	#header .m_gnb .depth1 .depth2>li>a:hover, #header .m_gnb .depth1 .depth2>li>a:focus, #header .m_gnb .depth1 .depth2>li>a:active {text-decoration: none}
	#header .m_gnb .depth1 .depth2>li>a.active {font-weight: 600}
	#header .m_gnb .depth1 .depth2>li>a:hover, #header .m_gnb .depth1 .depth2>li>a:focus, #header .m_gnb .depth1 .depth2>li>a:active {text-decoration: none}
	#header .m_gnb .depth1>li>span[class*='btn_slide'] {position: absolute; right: 30px}
	#header .m_gnb .depth1>li .btn_slideDown {width: 9px; height: 9px; background-position: -47px -47px; top: 14px}
	#header .m_gnb .depth1>li .btn_slideUp {width: 9px; height: 1px; background-position: -60px -47px; top: 18px; display: none}
	#header .m_gnb .depth1>li.active .btn_slideDown {display: none}
	#header .m_gnb .depth1>li.active .btn_slideUp {display: inline-block}
	
	#header .m_gnb .bottom {width: 100%; zoom : 1; height: 40px}
	#header .m_gnb .bottom:after {clear: both; content: ''; display: block}
	#header .m_gnb .bottom>a {display: block; float: left; width: 100%; font-size: 13px; text-align: center; line-height: 40px}
	#header .m_gnb .bottom .goToSitemap {background-color: #0968aa; color: #fff}
	#header .m_gnb .bottom .language {background-color: #539e49; color: #fff}
	#header .m_gnb_bg {width: 100%; height: 100%; position: fixed; background-color: rgba(0,0,0,0.5); z-index: -1; display: none}
	
	
	/*container*/
	#container .mainVisual {width: 100%; height: 303px; min-width: auto}
	#container .mainVisual div[class*="main0"] {padding-top: 95px; min-width: auto}
	#container .mainVisual .main01 {background: url(/img/m_main.png) no-repeat 50% top; background-size: cover}
	#container .mainVisual .main02 {background: url(/img/m_main02.png) no-repeat 50% top; background-size: cover; }
	#container .wrap_mainVisual .wrap_txt {top: 97px}
	#container .wrap_mainVisual .wrap_txt .tit {font-size: 18px; font-weight: 600; text-shadow: 5px 2px 14px rgba(40,51,51,0.7)}
	#container .wrap_mainVisual .tit>span {font-weight: 600}
	#container .wrap_mainVisual .wrap_txt .exp {font-size: 12px; font-weight: 400}
	
	#container .wrap_mainVisual .wrap_cir {width: 282px; height: 86px; margin-left: -137px; top: 182px}
	
	#container .wrap_mainVisual .txt {width: 85px; height: 85px; margin-right: 10px; }
	#container .wrap_mainVisual .txt01 {background: url(/img/m_cir01.png) no-repeat 50% top; background-size: cover}
	#container .wrap_mainVisual .txt02 {background: url(/img/m_cir02.png) no-repeat 50% top; background-size: cover}
	#container .wrap_mainVisual .txt03 {background: url(/img/m_cir03.png) no-repeat 50% top; background-size: cover}
	
	#container .wrap_mainVisual .txt .tit {font-size: 11px; margin-top: 6px}
	#container .wrap_mainVisual .txt .exp {display: none}
	
	#container .wrap_mainVisual .txt01 .cir>.icon {margin-top: 21px; background-position: -21px -256px; width: 24px; height: 24px}
	#container .wrap_mainVisual .txt02 .cir>.icon {margin-top: 22px; background-position: -60px -256px; width: 26px; height: 19px; margin-bottom: 3px}
	#container .wrap_mainVisual .txt03 .cir>.icon {margin-top: 20px; background-position: -91px -256px; width: 22px; height: 23px}
	
	#container .wrap_mainVisual .bx-wrapper .bx-pager{right: 19px; top: 35% !important; z-index: 1}
	#container .bx-wrapper .bx-pager-item {margin-bottom: 15px}
	#container .bx-wrapper .bx-pager-item>a {width: 15px; height: 13px; background: url(/img/m_pager.png) no-repeat; background-size: contain}
	#container .bx-wrapper .bx-pager-item>a.active {width: 15px; height: 20px; background: url(/img/m_pager.active.png) no-repeat; background-size: contain}
	
	/*sec*/
	#container .sec {padding: 10px 0 21px; min-width: auto}
	#container .sec .layout {padding: 0 10px}
	#container .sec .first {width: 100%; height: 171px}
	#container .sec .first .page .left {padding: 22px 21px}
	#container .sec .first .page .left p.tit {font-size: 18px; font-weight: 600}
	#container .sec .first .page .tit:after {width: 27px; left: 0; bottom: -5px}
	#container .sec .first .page .exp {font-size: 12px; margin-top: 15px; height: auto; overflow: hidden; text-overflow: ellipsis; }
	#container .sec .first .page .left p {font-weight: 400}
	#container .sec .first .p01 .left {background: url(/img/m_wave_p1.png) repeat}
	#container .sec .first .p02 .left {background: url(/img/m_wave_p2.png) repeat}
	#container .sec .first .p03 .left {background: url(/img/m_wave_p3.png) repeat}
	
	#container .sec .first .p01 .right {background: url(/img/m_sec01_01.png) no-repeat; background-size: cover}
	#container .sec .first .p02 .right {background: url(/img/m_sec01_02.png) no-repeat; background-size: cover}
	#container .sec .first .p03 .right {background: url(/img/m_sec01_03.png) no-repeat; background-size: cover}
	
	#container .sec .first .bx-wrapper .bx-controls .bx-pager {display: none}
	#container .sec .first .page .left .pager {bottom: 12px; right: -92%; width: 44px; height: 17px  }
	#container .sec .first .page .right .pager {display: none}
	#container .sec .first div[class*="btn_"] {width: 11px; height: 17px; top: 50%; margin-top: -9px}
	#container .sec .first .btn_prev {left: 6px; background-position: -21px -29px}
	#container .sec .first .btn_next {right: 6px; background-position: -33px -29px}
	
	#container .sec .second {height: auto; margin-top: 10px}
	#container .sec .second>div {float: none; }
	#container .sec .second .notice {width: 100%; padding: 17px 15px; }
	#container .sec .second .notice .more {background-position: -234px -29px; width: 13px; height: 13px; right: 1px}
	#container .sec .second .notice .tit {font-size: 15px; font-weight: 500; border-bottom-width: 1px; padding-bottom: 6px}
	#container .sec .second .notice>ul>li {margin-bottom: 8px}
	#container .sec .second .notice>ul>li>a {font-size: 13px;}
	#container .sec .second .notice>ul>li .date {font-size: 13px}
	
	#container .sec .second .info {width: 100%; margin-top: 10px; height: auto}
	#container .sec .second .info .up {height: 110px}
	#container .sec .second .info .up>a {width: 48%;}
	#container .sec .second .info .up .work {margin-right: 6px; background: url(/img/m_sec02_01.png) no-repeat; background-size: cover}
	#container .sec .second .info .up .ask {margin-right: 6px; background: url(/img/m_sec02_02.png) no-repeat; background-size: cover}
	#container .sec .second .info .tit {margin-top: 46px; font-size: 15px}
	#container .sec .second .info .down .question {height: 47px;}
	#container .sec .second .info .down .question>a {line-height: 47px; font-size: 13px}
	
	
	/*footer*/
	#footer {padding: 20px 0; height: auto; min-width: auto}
	#footer .layout {padding: 0 18px}
	#footer .layout>div {float: none}
	#footer .left ul li {font-size: 12px; margin-top: 3px}
	#footer .left ul li:first-child {width: 100%; margin-top: 0}
	#footer .left ul li:first-child:after {display: none}
	#footer .left ul li:after {height: 8px; top: 4px}
	#footer .left>p {font-size: 12px; margin-top: 3px}
	#footer .right .personal {font-size: 12px; width: 95px}
	#footer .right .personal:after {height: 8px; top: 4px}
	#footer .right .family {font-size: 12px; width: 75px; background: url(/img/m_arrow.png) no-repeat 91% 54%; background-size: 10%; height: auto; vertical-align: middle}
	#footer .right .f_list {top: -293px; left: -10px; width: 115px}
	#footer .right .f_list>li {padding: 7px 0}
	#footer .layout .right .etc {margin-top: 7px; display: inline-block}
	#footer .right .f_list>li>a {font-size: 12px}
	
	#footer .right .f_logo {width: 66px; height: 27px; background-position: -70px 0; margin-top: 12px}
	
	
	
	/*---------영문----------*/
	#header.eng .logo>a {background-position: 0 -187px}
	
	#container.eng .wrap_mainVisual .wrap_cir {width: 282px; margin-left: -141px}
	#container .wrap_mainVisual .wrap_txt {top: 84px}
	#container.eng .wrap_mainVisual .txt {width: 85px; height: 85px}
	#container .wrap_mainVisual .wrap_cir {top: 186px}
	#container.eng .wrap_mainVisual .txt div[class*="icon"] {margin-top: 21px}
	#container.eng .wrap_mainVisual .txt02 .cir>.icon {margin-top: 22px; margin-bottom: 4px}
	#container.eng .wrap_mainVisual .txt03 .cir>.icon {margin-bottom: 0}
	
	#container.eng .first {padding: 37px 0}
	#container.eng .first .sec>div {float: none; width: 100%}
	#container.eng .first .sec .left {margin-right: 0}
	#container.eng .first .sec .left .title {font-size: 18px;}
	#container.eng .first .sec .left .title:after {width: 28px; height: 2px; margin-top: 6px}
	#container.eng .first .sec .left .exp {font-size: 13px; margin-top: 15px}
	#container.eng .first .sec div[class*='img0'] {width: 100%; margin-top: 18px}
	#container.eng .first .sec div[class*='img0'] .name {font-size: 13px; font-weight: 600; right: 15px; top: 21px; left: auto; bottom: auto}
	#container.eng .first .sec .img01 {height: 185px; background: url(/img/m_e_main01.png) no-repeat; background-size: cover}
	#container.eng .first .sec .right {margin-top: 15px}
	#container.eng .first .sec .img02 {height: 195px; background: url(/img/m_e_main02.png) no-repeat; background-size: cover}
	#container.eng .first .sec .img03 {height: 195px; background: url(/img/m_e_main03.png) no-repeat; background-size: cover}
	
	#container.eng .second {padding: 35px 0 39px}
	#container.eng .second a[class*='menu0'] {width: 47.5%; margin-right: 10px; height: 180px; margin-bottom: 13px}
	#container.eng .second a[class*='menu0']:nth-child(2n+2) {margin-right: 0}
	#container.eng .second a[class*='menu0']>p {font-size: 14px; left: 20px; bottom: auto; top: 14px}
	#container.eng .second a[class*='menu0']>span {width: 25px; height: 12px; background-position: -234px -256px; bottom: 15px; right: 15px}
	
	
	/*footer*/
	#footer.eng .right .f_list {width: 115px; top: -270px; left: -19px}
	#footer.eng .right .f_logo {background-position: -123px -188px}
	
	
	/*popup*/
	.popup {width: 300px}
	.popup .content {padding: 5px 5px 20px}
	.popup .header {height: 40px; margin-bottom: 20px}
	.popup .header span {background-size: contain; width: 40px; width: 55px}
	.popup .tit {font-size: 16px; margin-bottom: 15px}
	.popup .txt {font-size: 12px; margin-bottom: 40px}
	.popup .grey {width: 100%; height: auto; padding: 25px; margin-bottom: 20px}
	.popup .grey:before {top: -30px; margin-left: -33.24px; font-size: 12px}
	.popup .grey ul>li {padding-left: 40px; font-size: 12px}
	.popup .grey ul>li>ul>li {font-size: 12px}
	.popup .name {margin-bottom: 5px; font-size: 14px}
	.popup .addr {font-size: 12px}
	.popup .footer .btn_close {font-size: 12px; top: 10px}
	
	
	
	
	
}