@charset "utf-8";

/*본고딕 100,300,400,500,700,900로 사용가능*/

@media only screen and (min-width: 981px) and (max-width: 1250px) {

/* 헤더 */
.header_wrap h1 a				{background:url('/en/_img/web/comn/logo_w.png') no-repeat 0 50% / 115px auto !important; margin-left:20px;}
.header_wrap p.top_menu			{margin-right:20px;}
.header_wrap p.top_menu	a		{font:300 20px/24px "Noto Sans KR", sans-serif !important;}

.header_wrap ul.top_menu > li p				{padding:0 2px !important;}
.header_wrap ul.top_menu > li p a			{display:inline-block; font:200 19px/24px "Noto Sans KR", sans-serif !important; color:#fff; transition:0.3s}
.header_wrap ul.top_menu > li.ir p a		{width:85px !important}
.header_wrap ul.top_menu > li.bio p a		{width:115px !important;}

.w_header ul.top_menu > li p			{padding:0 2px !important;}
.w_header ul.top_menu > li p a			{font:200 19px/24px "Noto Sans KR", sans-serif !important;}

.header_ov ul.top_menu > li p			{padding:0 2px !important;}
.header_ov ul.top_menu > li p a			{font:200 19px/24px "Noto Sans KR", sans-serif !important;}


.w_header						{background:#fff; border-bottom:1px solid #e5e5e5 !important; transition:1s;}
.w_header h1 a					{display:inline-block; width:132px; height:49px; background:url('/en/_img/web/comn/logo.png') no-repeat 0 50% / 115px auto !important; transition:1s;}
.w_header p.top_menu a			{font-weight:300; color:#222;}
.w_header p.top_menu a:hover	{transition:0.3s !important;}

.header_ov h1 a								{display:inline-block; width:132px; height:49px; background:url('/en/_img/web/comn/logo.png') no-repeat 0 50% / 115px auto !important;}


h2			{font:400 32px/38px "Noto Sans KR", sans-serif !important; transition:0.5s}

#smn ul.smn_list li					{padding:0 40px !important; transition:0.5s}
#smn ul.smn_list li a				{height:60px; font:300 17px/17px "Noto Sans KR", sans-serif !important;}
#smn ul.smn_list li a:after			{content:""; position:absolute; left:-3px !important; left:-40px !important; width:100%; padding:0 40px !important;}
#smn ul.smn_list li a:hover			{color:#3e9f6c;}
#smn ul.smn_list li a:hover:after	{width:100%; padding:0 40px !important;}
#smn ul.smn_list li a.on			{font:400 17px/17px "Noto Sans KR", sans-serif !important; color:#3e9f6c; position:relative;}
#smn ul.smn_list li a.on:after		{content:""; position:absolute; left:-3px !important; left:-40px !important; width:100%; padding:0 40px !important;}


.smn_fixed								{position:fixed; top:0px; left:0; z-index:99;}
.smn_fixed ul.smn_list li a:after		{bottom:-3px !important;}
.smn_fixed ul.smn_list li a.on:after	{bottom:-3px !important;}

/* 푸터 */
#footer	.footer_wrap				{padding:40px 0 !important;}
#footer .footer_wrap .f_logo		{margin:10px 10px 0 20px !important; background:url('/en/_img/web/comn/logo_f.png')no-repeat 0 50% / 130px !important;}
#footer .footer_wrap .f_copy		{width:80% !important; font:300 15px/24px "Noto Sans KR", sans-serif !important;}



}



@media only screen and (min-width: 981px) {

.web	{display:block !important;}
.mobile {display:none}
.tablet	 {display:none}


#wrap	{width:100%; padding:0; margin:0;}


/* 헤더 */
#header		{width:100%; position:fixed; z-index:999; top:0; left:0; height:100px; border-bottom:1px solid rgba(255, 255, 255, 0.5); transition:0.3s;}
#header_s	{width:100%; position:absolute; z-index:999; top:0; left:0; height:100px; border-bottom:1px solid rgba(255, 255, 255, 0.5); transition:0.3s;}

.header_wrap								{max-width:1100px; margin:0 auto; overflow:hidden; padding:25px 0; transition:1s !important;}
.header_wrap h1								{float:left; margin-left:10px;}
.header_wrap h1 a							{display:inline-block; width:132px; height:49px; background:url('/en/_img/web/comn/logo_w.png') no-repeat 0 0;}
.header_wrap ul.top_menu					{float:right;overflow:hidden;/* margin-top:11px; */text-align:center;}
.header_wrap ul.top_menu > li				{float:left;text-align:center;padding-top:2px; margin-left:28px;/* margin-top: 11px; */padding: 12px 0;}
.header_wrap ul.top_menu > li:nth-child(3)	{width:94px;}
.header_wrap ul.top_menu > li.ir			{width:85px;}
.header_wrap ul.top_menu > li:last-child	{padding:0 10px;}
.header_wrap ul.top_menu > li p				{padding:0 5px;}
.header_wrap ul.top_menu > li p a			{display:inline-block; font:200 21px/24px "Noto Sans KR", sans-serif; color:#fff; transition:0.3s}
.header_wrap ul.top_menu > li p a:hover		{color:#51ae7d;}
.header_wrap ul.top_menu > li.en_kr			{margin-left:20px; padding-top:0px; margin-top:10px;}
.header_wrap ul.top_menu > li.en_kr a		{display:inline-block; border-radius:20px; border:1px solid #fff; padding:5px 10px 6px 27px; background:url('/en/_img/web/comn/kr_en.png') no-repeat 8px 50%; font:200 14px/15px "Noto Sans KR", sans-serif; color:#fff; opacity:0.9;  transition:0.3s}

.w_header									{background:#fff; border-bottom:1px solid #e5e5e5 !important; transition:1s;}
.w_header h1 a								{display:inline-block; width:132px; height:49px; background:url('/en/_img/web/comn/logo.png') no-repeat 0 0; transition:1s;}
.w_header ul.top_menu > li p a				{font-weight:200; color:#222;}
.w_header ul.top_menu > li p a:hover		{transition:0.2s !important;}
.w_header ul.top_menu > li.en_kr a			{border:1px solid #222; color:#222; opacity:0.9; background:url('/en/_img/web/comn/kr_en_on.png') no-repeat 8px 50%; }
.w_header ul.top_menu > li.en_kr a:hover	{color:#fff; transition:0.3s; background:#222 url('/en/_img/web/comn/kr_en.png') no-repeat 8px 50%; }

.header_ov									{background:#fff; height:313px !important; transition:0.3s !important; border-bottom:1px solid #e5e5e5 !important;}
.header_ov h1 a								{display:inline-block; width:132px; height:49px; background:url('/en/_img/web/comn/logo.png') no-repeat 0 0;}
.header_ov ul.top_menu > li p a				{font-weight:200 !important; color:#222 !important;}
.header_ov ul.top_menu > li p a:hover		{color:#3e9f6c !important;}
.header_ov ul.top_menu > li p a.on			{color:#3e9f6c !important}
.header_ov ul.top_menu > li.en_kr a			{border:1px solid #222; color:#222; opacity:0.9; background:url('/en/_img/web/comn/kr_en_on.png') no-repeat 8px 50%; }
.header_ov ul.top_menu > li.en_kr a:hover	{color:#fff; transition:0.3s; background:#222 url('/en/_img/web/comn/kr_en.png') no-repeat 8px 50%; }



ul.depth2_nav					{display:none; margin:32px 0 0 0 ; padding-top:7px; position:relative;}
ul.depth2_nav.twolength			{margin:20px 0 0 0 !important;}
ul.depth2_nav:before			{content:""; position:absolute; top:0; left:50%; margin-left:-10px; z-index:5; width:20px; height:2px; background:#51ae7d}
ul.depth2_nav li				{margin:8px 0; width:100%; text-align:center;}
ul.depth2_nav li a				{display:inline-block; font:300 15px/18px "Noto Sans KR", sans-serif; color:#888; transition:0.2s; letter-spacing:-0.5px}
ul.depth2_nav li a:hover		{color:#feae01 !important}


h2			{width:100%; text-align:center; font:400 35px/40px "Noto Sans KR", sans-serif; color:#fff; padding:155px 0 50px 0; background:url('/en/_img/web/comn/smn_bg.jpg')no-repeat 50% 50% / cover; transition:0.5s}

#smn								{width:100%; background:#fff; text-align:center; border-bottom:3px solid #e5e5e5;}
#smn .smn_select					{max-width:1100px; margin: 0 auto;}


#smn ul.smn_list					{max-width:1100px; text-align:center; margin: 0 auto;}
#smn ul.smn_list li					{display:inline-block; padding:0 55px; transition:0.5s}
#smn ul.smn_list li a				{display:inline-block;  height:65px; box-sizing:border-box; padding-top:23px; font:300 18px/18px "Noto Sans KR", sans-serif; color:#999; position:relative; transition:0.5s}
#smn ul.smn_list li a:after			{content:""; position:absolute; bottom:-3px; left:-55px; width:100%; padding:0 55px; border-bottom:0px solid #4fc4ba; transition:0.18s;}
#smn ul.smn_list li a:hover			{color:#3e9f6c;}
#smn ul.smn_list li a:hover:after	{width:100%; padding:0 55px; border-bottom:3px solid #51ae7d;}
#smn ul.smn_list li a.on			{font:400 18px/18px "Noto Sans KR", sans-serif; color:#3e9f6c; position:relative;}
#smn ul.smn_list li a.on:after		{content:""; position:absolute; bottom:-3px; left:-55px; width:100%; padding:0 55px; border-bottom:3px solid #51ae7d;}


.smn_fixed								{position:fixed; top:0px; left:0; z-index:99;}
.smn_fixed ul.smn_list li a:after		{bottom:-3px !important;}
.smn_fixed ul.smn_list li a.on:after	{bottom:-3px !important;}

/* 푸터 */
#footer								{width:100%; background:#333;}
#footer	.footer_wrap				{max-width:1100px; margin:0 auto; padding:40px 0; overflow:hidden;}
#footer .footer_wrap .f_logo		{float:left; width:159px; height:60px; margin:15px 40px 0 0; background:url('/en/_img/web/comn/logo_f.png')no-repeat 0 0;}
#footer .footer_wrap .f_copy		{float:left; font:300 16px/28px "Noto Sans KR", sans-serif; color:#999;}
#footer .footer_wrap .f_copy span	{display:block; margin-top:15px; color:#666;}





}





/********** 타블렛 **********/
@media only screen and (min-width: 640px) and (max-width: 980px) {
.tablet {display:block !important;}
.mobile {display:none}
.web	{display:none}

/* 헤더 */
#header	{width:100%; padding:15px 20px; box-sizing:border-box;background:#51ae7d; overflow:hidden;}

#header h1				{float:left;}
#header h1 a			{display:inline-block; width:85px; height:32px; background:url('/en/_img/ta/comn/logo_w.png') no-repeat 0 50% / 85px auto;}
#header p.kr_en			{float:right; padding-right:45px; text-align:right; position:relative;}
#header p.kr_en	a img	{width:30px;}
#header p.kr_en a span	{position:absolute; text-align:center; bottom:-2px; right:40px; padding:5px 0; width:22px; border-radius:15px; background:#fff; font:400 11px/12px "Noto Sans KR", sans-serif; color:#51ae7d;}

.fixed_menu				{position:fixed; right:10px; top:7px; width:48px; height:48px; background:#51ae7d; z-index:999; transition:0.3s;}
.fixed_menu a			{display:inline-block; width:100%; height:100%; position:relative;}
.fixed_menu a span		{display:block; position:absolute; width:30px; height:2px; background:#fff;}
.fixed_menu a span.one	{top:13px; left:9px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.fixed_menu	a span.two	{top:23px; left:9px; -webkit-transition: all 0.3s; transition: all 0.3s;}
.fixed_menu a span.thr	{top:33px; left:9px; -webkit-transition: all 0.5s; transition: all 0.5s;}

.fixed_view	{background:#51ae7d; transition:0.5s; opacity:0.5; top:7.5px;}

h2		{width:100%; text-align:center; font:400 30px/40px "Noto Sans KR", sans-serif; color:#fff; padding:40px 0; background:url('/en/_img/ta/comn/smn_bg.jpg')no-repeat 50% 50% / cover; transition:0.5s}

#smn							{width:100%; height:50px; white-space:nowrap; overflow:auto;}
#smn ul.smn_list				{min-height:50px; width:100%; display:table; box-sizing:border-box; border-bottom:2px solid #ddd;}
#smn ul.smn_list li				{display:table-cell; vertical-align:middle; color:#777; text-align:center; padding:0 25px;}
#smn ul.smn_list li a			{display:block; position:relative; height:100%; font:400 17px/18px "Noto Sans KR", sans-serif; color:#999;}
#smn ul.smn_list li a.on		{font:400 17px/18px "Noto Sans KR", sans-serif; color:#3e9f6c;}
#smn ul.smn_list li a.on:after	{content:""; position:absolute; bottom:-17px; left:-25px; z-index:9; width:100%; padding:0 25px; border-bottom:2px solid #51ae7d;}


.left_menu				{position:absolute; top:0; right:0; overflow:auto; width:100%; height:100%; background:#51ae7d; z-index:900;}
.left_menu .left_top	{width:100%; height:62px; background:url('/en/_img/ta/comn/logo_w.png') no-repeat 20px 16px / 85px auto;}

.menu_list_box							{width:100%; display:table;}
.menu_list_box02						{max-height:420px; padding-bottom:20px; display:table-cell; vertical-align:middle;}
.menu_list_box_wrap						{max-height:420px; box-sizing:border-box; overflow-y:scroll; height:auto; -ms-overflow-style:none;}
.menu_list_box_wrap::-webkit-scrollbar {display:none;}

.menu_list								{width:100%;}
.menu_list li.one						{width:100%; text-align:center; margin:20px 0;}
.menu_list li.one a						{display:inline-block; font:500 28px/38px "Noto Sans KR", sans-serif; color:#fff;}
.menu_list li.big						{width:100%; text-align:center; margin:20px 0;}
.menu_list li.big:first-child			{margin:0 0 20px 0;}
.menu_list li.big a						{position:relative; display:inline-block; padding:0 28px;font:500 28px/38px "Noto Sans KR", sans-serif; color:#fff;}
.menu_list li.big a.on:after			{content:""; position:absolute; top:50%; right:0px; width:10px; background:#fff; height:2px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.on:before			{content:""; position:absolute; top:50%; right:8px; width:10px; background:#fff; height:2px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.off:after			{content:""; position:absolute; top:50%; right:0px; width:12px; background:#fff; height:2px; transform:rotate(-45deg); -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.off:before			{content:""; position:absolute; top:50%; right:8px; width:12px; background:#fff; height:2px; transform:rotate(45deg); -webkit-transition: all 0.5s; transition: all 0.5s;}

.menu_list li.big ul					{width:100%; padding-bottom:10px;}
.menu_list li.big ul li					{width:100%; margin:15px 0;}
.menu_list li.big ul li a				{font:400 18px/28px "Noto Sans KR", sans-serif; color:#e3f0e9;}




/* 푸터 */
#footer								{width:100%; padding:30px 20px; box-sizing:border-box; background:#333;}
#footer	.footer_wrap				{}
#footer .footer_wrap .f_copy		{font:300 15px/24px "Noto Sans KR", sans-serif; color:#999;}
#footer .footer_wrap .f_copy span	{display:block; margin-top:15px; color:#666;}


	
}







/********** 모바일 **********/
@media only screen and (max-width: 640px) {	
.mobile {display:block !important;}
.tablet {display:none}
.web	{display:none}

/* 헤더 */
#header	{width:100%; padding:12px 15px; box-sizing:border-box; background:#51ae7d; overflow:hidden;}

#header h1				{float:left;}
#header h1 a			{display:inline-block; width:65px; height:26px; background:url('/en/_img/mo/comn/logo_w.png') no-repeat 0 50% / 65px auto;}
#header p.kr_en			{float:right; padding-right:38px; text-align:right; position:relative;}
#header p.kr_en	a img	{width:25px;}
#header p.kr_en a span	{position:absolute; text-align:center; bottom:-2px; right:32px; padding:4px 0; width:19px; border-radius:15px; background:#fff; font:500 10px/11px "Noto Sans KR", sans-serif; color:#51ae7d; letter-spacing:-0.5px;}


.fixed_menu				{position:fixed; right:5px; top:5px; width:42px; height:42px; background:#51ae7d; z-index:999; transition:0.3s;}
.fixed_menu a			{display:inline-block; width:100%; height:100%; position:relative;}
.fixed_menu a span		{display:block; position:absolute; width:26px; height:2px; background:#fff;}
.fixed_menu a span.one	{top:11px; left:8px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.fixed_menu	a span.two	{top:20px; left:8px; -webkit-transition: all 0.3s; transition: all 0.3s;}
.fixed_menu a span.thr	{top:29px; left:8px; -webkit-transition: all 0.5s; transition: all 0.5s;}

p.menu_on a span		{width:30px;}
p.menu_on a span.one	{transform:rotate(45deg); -webkit-transition: all 0.5s; transition: all 0.5s; top:17px;}
p.menu_on a span.two	{opacity:0;  -webkit-transition: all 0.3s; transition: all 0.3s}
p.menu_on a span.thr	{transform:rotate(-45deg); -webkit-transition: all 0.5s; transition: all 0.5s; top:17px;}

.fixed_view	{background:#51ae7d; opacity:0.5; transition:0.4s; top:5.5px;}

h2		{width:100%; text-align:center; font:400 17px/21px "Noto Sans KR", sans-serif; color:#fff; padding:15px 0; background:#555; transition:0.5s}

#smn							{width:100%; height:46px; white-space:nowrap; overflow:auto;}
#smn ul.smn_list				{min-height:46px; width:100%; display:table; box-sizing:border-box; border-bottom:2px solid #ddd;}
#smn ul.smn_list li				{display:table-cell; vertical-align:middle; color:#777; text-align:center; padding:0 15px;}
#smn ul.smn_list li a			{display:block; position:relative; height:100%; font:400 15px/16px "Noto Sans KR", sans-serif; color:#999;}
#smn ul.smn_list li a.on		{font:400 15px/16px "Noto Sans KR", sans-serif; color:#3e9f6c;}
#smn ul.smn_list li a.on:after	{content:""; position:absolute; bottom:-16px; left:-15px; z-index:9; width:100%; padding:0 15px; border-bottom:2px solid #51ae7d;}


.left_menu				{position:absolute; top:0; right:0; overflow:auto; width:100%; height:100%; background:#51ae7d; z-index:900;}
.left_menu .left_top	{width:100%; height:50px; background:url('/en/_img/mo/comn/logo_w.png') no-repeat 15px 14px / 65px auto;}

.menu_list_box							{width:100%; display:table;}
.menu_list_box02						{max-height:420px; padding-bottom:20px; display:table-cell; vertical-align:middle;}
.menu_list_box_wrap						{max-height:420px; box-sizing:border-box; overflow-y:scroll; height:auto; -ms-overflow-style:none;}
.menu_list_box_wrap::-webkit-scrollbar {display:none;}


.menu_list								{width:100%;}
.menu_list li.one						{width:100%; text-align:center; margin:20px 0;}
.menu_list li.one a						{display:inline-block; font:500 28px/38px "Noto Sans KR", sans-serif; color:#fff;}
.menu_list li.big						{width:100%; text-align:center; margin:20px 0;}
.menu_list li.big:first-child			{margin:0 0 20px 0;}
.menu_list li.big a						{position:relative; display:inline-block; padding:0 34px 0 22px;font:500 24px/30px "Noto Sans KR", sans-serif; color:#fff;}
.menu_list li.big a.on:after			{content:""; position:absolute; top:50%; right:0px; width:10px; background:#fff; height:2px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.on:before			{content:""; position:absolute; top:50%; right:8px; width:10px; background:#fff; height:2px; -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.off:after			{content:""; position:absolute; top:50%; right:0px; width:12px; background:#fff; height:2px; transform:rotate(-45deg); -webkit-transition: all 0.5s; transition: all 0.5s;}
.menu_list li.big a.off:before			{content:""; position:absolute; top:50%; right:8px; width:12px; background:#fff; height:2px; transform:rotate(45deg); -webkit-transition: all 0.5s; transition: all 0.5s;}

.menu_list li.big ul					{width:100%; padding-bottom:10px;}
.menu_list li.big ul li					{width:100%; margin:15px 0;}
.menu_list li.big ul li a				{font:400 18px/22px "Noto Sans KR", sans-serif; color:#e3f0e9;}


/* 푸터 */
#footer								{width:100%; padding:30px 20px; box-sizing:border-box; background:#333; text-align:center;}
#footer	.footer_wrap				{}
#footer .footer_wrap .f_copy		{font:300 12px/18px "Noto Sans KR", sans-serif; color:#999;}
#footer .footer_wrap .f_copy span	{display:block; margin-top:15px; color:#666;}




}