/* 나눔스퀘어라운드 웹폰트 v1.11 https://github.com/innks/NanumSquareRound */
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 300;
  src: local("./fonts/NanumSquareRoundL"), /* computer */
    url("./fonts/NanumSquareRoundL.eot"), /* IE9 Compat Modes */
    url("./fonts/NanumSquareRoundL.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/NanumSquareRoundL.woff2") format("woff2"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundL.woff") format("woff"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundL.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 400;
  src: local("./fonts/NanumSquareRoundR"), /* computer */
    url("./fonts/NanumSquareRoundR.eot"), /* IE9 Compat Modes */
    url("./fonts/NanumSquareRoundR.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/NanumSquareRoundR.woff2") format("woff2"), /* Modern Browsers */    
    url("./fonts/NanumSquareRoundR.woff") format("woff"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundR.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 700;
  src: local("./fonts/NanumSquareRoundB"), /* computer */
    url("./fonts/NanumSquareRoundB.eot"), /* IE9 Compat Modes */
    url("./fonts/NanumSquareRoundB.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/NanumSquareRoundB.woff2") format("woff2"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundB.woff") format("woff"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundB.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face {
  font-family: "NanumSquareRound";
  font-style: normal;
  font-weight: 800;
  src: local("./fonts/NanumSquareRoundEB"), /* computer */
    url("./fonts/NanumSquareRoundEB.eot"), /* IE9 Compat Modes */
    url("./fonts/NanumSquareRoundEB.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("./fonts/NanumSquareRoundEB.woff2") format("woff2"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundEB.woff") format("woff"), /* Modern Browsers */
    url("./fonts/NanumSquareRoundEB.ttf") format("truetype"); /* Safari, Android, iOS */
}
@font-face{
	font-family:'NotoSans';
	font-style:normal;
	font-weight: 400;
	src:url('./fonts/NotoSansCJKkr-Light.eot');
	src:local('※'),
		url('./fonts/NotoSansCJKkr-Light.woff') format('woff'),
		url('./fonts/NotoSansCJKkr-Light.woff2') format('woff2'),
		url('./fonts/NotoSansCJKkr-Light.otf') format('opentype');
}
@font-face{
	font-family:'NotoSans';
	font-style:normal;
	font-weight: 500;
	src:url('./fonts/NotoSansCJKkr-Regular.eot');
	src:local('※'),
		url('./fonts/NotoSansCJKkr-Regular.woff') format('woff'),
		url('./fonts/NotoSansCJKkr-Regular.woff2') format('woff2'),
		url('./fonts/NotoSansCJKkr-Regular.otf') format('opentype');
}
@font-face{
	font-family:'NotoSans';
	font-style:normal;
	font-weight: 600;
	src:url('./fonts/NotoSansCJKkr-Medium.eot');
	src:local('※'),
		url('./fonts/NotoSansCJKkr-Medium.woff') format('woff'),
		url('./fonts/NotoSansCJKkr-Medium.woff2') format('woff2'),
		url('./fonts/NotoSansCJKkr-Medium.otf') format('opentype');
}
@font-face{
	font-family:'NotoSans';
	font-style:normal;
	font-weight: 900;
	src:url('./fonts/notokr-Bold.eot');
	src:local('※'),
		url('./fonts/notokr-Bold.woff') format('woff'),
		url('./fonts/notokr-Bold.woff2') format('woff2'),
		url('./fonts/notokr-Bold.otf') format('opentype');
}



html, body, div, dl, dt, dd, ul, ol, li, p, h1, h2 ,h3, h4, h5, h6{margin: 0;padding: 0;list-style: none;font-family: "NanumSquareRound","NotoSans","맑은 고딕","Malgun Gothic","Nanum Gothic","나눔 고딕",sans-serif;font-size: 15px;color: #666666;word-break: break-word;}
a{text-decoration: none;color: #666;}
img{max-width: 100%;border: 0;vertical-align: middle;}
select{font-family: "NanumSquareRound";border: 1px solid #d6d6d6;vertical-align: middle;}
input{font-family: "NanumSquareRound";vertical-align: middle;margin: 0;padding: 0;}
textarea{font-family: "NanumSquareRound";vertical-align: middle;width:calc(100% - 60px);padding:30px;border:1px solid #dcdcdc;color:#666666;font-size:15px;resize: none;}
table{border-collapse: separate;border-collapse: collapse;width: 100%;table-layout: fixed;}
table caption{width: 0;height: 0;overflow: hidden;position: absolute;top: -9999px;left: -9999px;}
body { width: 100%;font-size: 12px; }
tfoot {display: none;}
pre{word-wrap: break-word;white-space: pre-wrap;min-height:50px;}

.clearfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;line-height: 0;font-size: 0;}
.txc{text-align: center !important;}
.txl{text-align: left !important;}
.txr{text-align: right !important;}
.fl{float:left !important;}
.fr{float:right !important;}
.blue-font{color:#003edc;}

.mtp0{margin-top:0 !important}
.mtp50{margin-top: 50px !important;}
.th-left{text-align:left;}
.ml0{margin-left: 0 !important;}
.ml10{margin-left: 10px !important;}
.ml20{margin-left: 20px !important;}
.ml30{margin-left: 30px !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;}
.mt30{margin-top: 30px !important;}
.mt40{margin-top: 40px !important;}
.mt50{margin-top: 50px !important;}

#wrap{width: 100%;max-width: 1900px;margin: 0 auto;}
.area{width: 100%;margin: 0 auto; max-width: 1200px;}

.skip_nav{position:relative;width:100%;z-index:99999;}
.skip_nav a{position:absolute;left:0;top:-1000px;display:block;width:100%;padding:10px 0 14px; font-style:normal; font-variant:normal;text-align:center;font-size:13px; font-family:'nsrb';color:#ffffff;background:#4e90d0;}
.skip_nav a:active,
.skip_nav a:focus{top:0;text-decoration:none;color:#ffffff;}



.ht-con{padding: 0 7%;border-bottom: 1px solid #f5f5f5;margin: 0 auto;}
.ht-con #logo{float: left;margin-top: 6px;}
.ht-con div{margin-left: 15px;float: left;}
.ht-con div a{line-height: 42px;line-height: 42px;display: inline-block;padding-left: 25px;background: url(../images/ht-con_icon.png) no-repeat left 13px;}
.ht-con ul{float: right;}
.ht-con ul li{margin-left: 22px;float: left;}
.ht-con ul li a{display: inline-block;height: 42px;line-height: 42px;}
/*
.hc-con{position: relative;padding: 40px 7%;text-align: center;background: url(../images/sub/hc-con_bg.png) no-repeat center top;background-size: cover;}
*/
.hc-con{position: relative;padding: 0 7%;text-align: center;background: #1f8cdd;overflow: hidden;}

.hc-con .area{height: auto;}
.hc-con .close{position: absolute;background: url(../images/pop_close.jpg) no-repeat center center;width: 48px;height: 41px;right: 7%;top: 0;text-indent: -999em;}
.hc-con .area > div{position: absolute;bottom: 10px;right: 7%; color: #fff; font-size: 14px;}
.hc-con .text-con{padding: 21px 160px 21px 0;position: relative;text-align: left; width: 540px; margin: 0 auto; display: block;background: url(../images/pic.png) no-repeat right center;}
.hc-con .text-con > div img{max-width: 100%;}

.hc-con2{background: url(../images/hc_con2_bg.gif) no-repeat center;background-size: cover;}
.hc-con2 .text-con{text-align: center;width: auto;padding: 30px 0;background: none;}
.hc-con2 .area > div{color: #000000;}


.hc-con .text-con > p{margin-top: 20px;color: #fff;display: inline-block;background: url(../images/pgo.png) no-repeat right center;padding-right: 20px;}


.hb-con{padding: 0 7%;position: relative;margin: 0 auto;height: 90px;}
.hb-con #logo2{float: left;line-height: 90px;}
.hb-con .func-a{float: right;}
.hb-con .func-a .member-link{float: left;margin-top: 34px;}
.hb-con .func-a .member-link li{float: left;}
.hb-con .func-a .member-link li:first-child{border-right: 1px solid #c1c1c1;}
.hb-con .func-a .member-link li a{display: block;padding: 0 5px;font-size: 14px;line-height: 18px;color: #666666;background:url(../images/sub/login.gif) no-repeat left 1px ;padding-left:18px;}
.hb-con .func-a .func-link{float: left;margin-top: 18px;margin-left: 10px;width: 97px;position: relative;}
.hb-con .func-a .func-link li{float: left;}


.hb-con #menu-con{position: absolute;left: 50%;margin-left: -335px;width: 870px;}
#menu-con > ul > li{position: relative;height: 90px;float: left;/* margin-right: 5px; */}
#menu-con > ul > li > a{padding: 0 61px;line-height: 90px;display: inline-block;min-width: 60px;text-align: center;position: relative;}
#menu-con > ul > li > a:hover:after{content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 4px;background: #07a7e3;}
#menu-con > ul > li > a > span{display: block;font-size: 22px;color: #000;font-weight: bold;}
#menu-con > ul > li > a:hover > span{color: #0b429f;}

.menu-bg{display: none;position: absolute;left: 0px;top: 90px;width: 100%;height: 395px;background: #fff;z-index: 1;border-top: 1px solid #dedede;}
.deapth2{display: none;position: absolute;z-index: 15;top: 90px;left: 0;width: 100%;height: 356px;padding: 9px 9px;box-sizing: border-box;border-right: 1px solid #dddddd;margin-top: 20px;margin-bottom: 20px;}
#menu-con > ul > li:first-child > .deapth2{border-left: 1px solid #dddddd;}
.deapth2 > ul > li > a{display: block;padding: 6px 10px;font-size: 16px;font-weight: bold;line-height: 20px;color: #222222;/* letter-spacing: -1px; */}
.deapth2 > ul > li > a:hover{color: #fff;background: #07a7e3 url(../images/menu_bg001.gif) no-repeat 90% 10px ; }
.deapth3{padding: 0 15px;}
.deapth3 > li > a{display: block;padding: 2px 0;padding-left: 8px;font-size: 16px;line-height: 22px;color: #666666;letter-spacing: -1px;background: url(../images/dp3_bg.gif) no-repeat left 9px;}
.deapth3 > li > a:hover{color: #09a7e6;}
#menu-con .button-box{padding: 16px 0;display:none;}
#menu-con .button-box ul{text-align:center;}
#menu-con .button-box ul li{display:inline-block;}
#menu-con .button-box ul li a{font-size: 16px;display:inline-block;padding: 0px 10px;border-right: 1px solid #dfdfdf;}
#menu-con .button-box ul li:last-child a{border-right:0;}
#menu-con .button-box ul li a.login-btn{background: url(../images/sub/login.gif) no-repeat left 1px;padding: 0px 10px 0px 18px;}
#menu-con .button-box ul li a.mypage-btn{}


#footer{height: 170px;background: #f5f5f5;padding: 0 2%;border-top: 1px solid #d9d9d9;}
.footer-in{max-width: 1200px;margin: 0 auto;}
#footerlogo{float: left;margin-top: 30px;}
.ftc-con{margin: 30px 0 0 50px;float: left;width: calc(100% - 505px);}
.ftc-con p{font-size: 16px;color: #666;line-height: 25px;margin-top: 20px;}
.ftc-con li{border-left: 1px solid #d9d9d9;float: left;padding: 0 13px;}
.ftc-con li:first-child{border-left: 0;padding-left: 0;}
.ftc-con li a{font-size: 16px;line-height: 16px;color: #666;}
.ftr-con{margin-top: 55px;float: right;}


.footer_gs{text-align: left;position: relative;}
.footer_gs > a{display: block;font-size: 13px;color: #000;border: 1px solid #c2c2c2;width: 148px;height: 34px;line-height: 34px;padding: 0 15px;}
.footer_gs > a span{display: block;background: url('../images/bot_ic.png') no-repeat right center;}
.family_list{display: none;position: absolute;left: 0;bottom: 36px;z-index: 61;background: #fff;border: 1px solid #c2c2c2;width: 158px;border-bottom: none;padding:10px 10px;}
.family_list > li > a{display: block;padding: 4px 0;font-size: 12px;color: #000;}
.family_list > li > a:hover{color: #1b4692;}

#allmenu{display: none;position: absolute;width: 29px;height: 23px;font-size: 0;font-size: 0;background: url(../images/allmenubtn.png) no-repeat center center;right: 2%;top: calc(50% - 12px);}



#content{width: 100%;margin:0 auto;padding-bottom:100px;}
#content.mcontents{padding-bottom: 0;}

@media screen and (max-width: 1680px) {
	.hb-con #menu-con{ width: 670px; margin-left: -260px;}
	#menu-con > ul > li > a {padding: 0 35px;}
}

@media screen and (max-width: 1320px) {
	.ht-con{padding: 0 2%;}
	.hb-con{padding: 0 2%;}
	.hc-con .close{right: 2%;}
	.hc-con .area > div{right: 2%;}
	
}

@media screen and (max-width: 1200px) {
	#menu-con > ul > li > a{padding: 0 25px;}
	.hb-con #menu-con{width: 580px;margin-left: -227px;}
}


@media screen and (max-width: 1024px) {
	.ht-con > div{display: none;}
	.hc-con{padding: 0 2%}
	.hc-con .area{height: auto;}
	.hc-con .text-con{position: relative;text-align: left; width: calc(100% - 160px); margin: 0 auto; display: block;}
	.ht-con div{margin-left: 10px;width: calc(100% - 107px);}
	.ht-con div a{display: block;width: 99%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
	.hb-con #menu-con{left: auto;right:0 !important;margin-left: 0;width: auto;}
	
	#allmenu{display: inline-block;}
	/*.hb-con{line-height: normal;height: 80px;}*/
	.hb-con .func-a{display: none;}
	.hb-con #menu-con{display: none;width: 240px;background: #fff;float: none;position: absolute;right: 0;top: 90px;max-height: 400px;overflow-y: auto;   /* left: unset;margin-left: unset;*/z-index: 999;}
	#menu-con > ul > li{height: auto;float: none;margin-right: 0;}
	.deapth2{position: static;height: auto;padding: 10px 0px;background: #195097;margin: 0;}
	.deapth2 > ul{margin-top: 0;}
	.deapth2 > ul > li{margin: 0;width: 100%;}
	.deapth2 > ul > li > a{text-align: left;display: block;padding: 5px 20px;color: #fff;}
	#menu-con > ul{border-top: 1px solid #dfdfdf;}
	#menu-con > ul > li > a{padding: 13px 0;line-height: normal;display: block;border-bottom: 1px solid #dfdfdf;}
	#menu-con > ul > li > a:after{display: none;}
	#menu-con > ul > li > a > span{font-size: 18px;padding: 0;background: none !important;}
	.deapth3{display: none;padding: 10px 20px;background: #fff;}
	.deapth3 > li > a{}
	
	
	#footer{height: auto;position: relative;padding-left: calc(2% + 250px);padding-bottom: 30px;}
	#footerlogo{position: absolute;float: none;left: 2%;}
	.ftc-con{width: 100%;margin-left: 0;}
	.ftc-con li{padding: 3px 5px;float: none; display: inline-block;border-left: none;}
	.ftr-con{margin-top: 20px;float: left;}

	#footer{padding: 0 2% 30px;text-align: center;}
	.ftr-con{float: none; display: inline-block;}
	.ftc-con{margin: 15px 0 0 0;}
	.ftc-con ul{display: inline-block;}
	.ftc-con li > a{font-size: 14px;}
	.ftc-con p{font-size: 14px;}
	#footerlogo{position: static;text-align: center;margin-top: 25px;}
	.ftc-con p{margin-top: 5px;}

	#menu-con .button-box{display:block;}
	#menu-con > ul > li:first-child > .deapth2{border-left: 0;}


}
@media screen and (max-width: 768px) {
	
	.hc-con .close{width: 33px;height: 25px;right: 2%;}
	.hc-con .area div{bottom: 5px;right: 2%;}

	.hc-con .text-con{width: calc(100% - 80px); padding: 21px 80px 21px 0;}
	
}

@media screen and (max-width: 520px) {
	.ht-con ul li{margin-left: 7px;float: left;}
	.ht-con ul li a{font-size: 12px;}
}