﻿@charset "utf-8";
/* CSS Document */ 

/* ==================================================
	반응형
================================================== */
.showPc{display:block;}
.showTa{display:none;}
.showMo{display:none;}
.showTaMo{display:none;}

@media screen and (max-width:1024px){
	.showPc{display:none;}
	.showTa{display:block;}
	.showMo{display:none;}
	.showTaMo{display:block;}
}

@media screen and (max-width:640px) {
	.pcArea{display:none ;}
	.showPc{display:none;}
	.showTa{display:none;}
	.showMo{display:block;}
	.showTaMo{display:block;}
}



/* ==================================================
	공통레이아웃
================================================== */
#warp{width:100%; position:relative; min-width:320px; margin:0 auto 50px; overflow:hidden;}
#warp .contents{width:100%; position:relative; min-width:320px; margin:0 auto; padding:20px; box-sizing:border-box;}

/* ==================================================
	header
================================================== */
#header{width:100%; position:fixed;  min-width:320px; margin:0 auto;  z-index:200;}
#header .header{min-width:320px; position:relative; margin:0 auto; height:70px; background:#fff; padding:10px 0; border-bottom:1px solid #0066b3;}
.header h1{text-align:center; margin-top:0; margin-left:-3px;}
.header h1 img{height:31px;}
.header > .left_top {position:absolute; top:20px; left:15px;}
.header > .left_top > a > img{width:30px; }
.header > .right_top {position:absolute; top:20px; right:15px;}
.header > .right_top > a > img{width:32px; }

/* gnb 메뉴 */
.menu_wrap {width:100%; height:100%; position:fixed; top:0; left:0; z-index:500; display:none; font-family:'NanumSquare', sans-serif;}
.menu_wrap > div {height:100%; min-width:320px; width:100%; position:relative; margin:0 auto; overflow-x:hidden;}
.gnb_bg {position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.7; z-index:490; display:none;}
.menu_wrap .menu_area {width:78%; position:absolute; top:0; left:-100%; z-index:510;}
.menu_wrap .menu_area > .height_finder {width:100%; height:0px;}
.menu_area .top_area {width:100%; height:70px; position:relative; background:#fff;}
.menu_area .top_area .mypage_btn {float:left; margin:20px 25px;}
.menu_area .top_area .mypage_btn > a > img {display:block; width:50%;}
.menu_area .top_area .gnb_tit {float:left; margin-top:20px; margin-left:0; color:#2cc9d1; font-size:15px; font-weight:600; letter-spacing:-2;}
.menu_area .top_area .gnb_tit > a {border-radius:7px; border:1px solid #2cc9d1; padding:5px 12px; margin-left:5px;}
.menu_area .top_area .close_bn {position:absolute; left:100%; float:left; padding:25px; background-color:#0066b3; height:70px;}
.menu_area .top_area .close_bn img{width:22px; height:22px;}
.menu_wrap .menu_area .row_01 {width:100%;}
.menu_wrap .menu_area .row_01 > li {width:100%; overflow:hidden;/* height:55px; */background:#0066b3 url(/m/img/arrow_off.png) no-repeat 90% 50%; background-size:16px 10px; border-bottom:1px solid #66a3d1;}
.menu_wrap .menu_area .row_01 > li.selected {background:#0066b3 url(/m/img/arrow_on.png) no-repeat 90% 20px; background-size:16px 10px; border-bottom:1px solid #66a3d1;}
.menu_wrap .menu_area .row_01 > li > a {display:block; width:100%; /*height:55px;*/ line-height:50px; color:#fff; text-indent:25px; font-weight:600; font-size:18px; /*padding-top:3px; padding-bottom:3px;*/}

.menu_wrap .menu_area .row_01 > li > ul {width:100%;/* height:0;*/ background:#e2ebed;}
.menu_wrap .menu_area .row_01 > li > ul > li {width:100%; border-bottom:1px solid #bebebe; background:#e2ebed url(/m/img/menu_2depth_bullet.png) no-repeat 20px center; background-size:13px 3px;}

.menu_wrap .menu_area .row_01 > li > ul > li > a {display:block; width:100%; /*height:50px; */line-height:40px; color:#575757; text-indent:40px; font-size:16px; background:url(/m/img/sub_lnb_bl.png) no-repeat 25px; center; background-size:11px 3px; padding-left:5px; /*padding-top:5px; padding-bottom:5px;*/}

.right_wrap {left: 0px; top: 0px; width: 100%; height: 100%; display: none; position: fixed; z-index: 500;}
.right_wrap > div {margin: 0px auto; width: 100%; height: 100%; position: relative; -ms-overflow-x: hidden; min-width: 320px;}
.right_wrap .bg {background: rgb(0, 0, 0); left: 0px; top: 0px; width: 100%; height: 100%; position: absolute; z-index: 501; opacity: 0.7;}
.right_wrap .right_area {top: 0px; width:80%; right: -100%; position: absolute; z-index: 510;}
.right_wrap .top_area .gnb_tit { padding-top:15px;  color:#2cc9d1; font-size:18px; font-weight:bold; text-align:center;}
.right_wrap .right_area > .height_finder {width: 100%; height: 0px;}
.right_area .top_area {width: 100%; height: 60px;  background:#fff; position: relative;}
.right_area .top_area .close_bn {position:absolute; left:-60px; top:0; float:left; padding:18px; background-color:#333d47; height:60px;}
.right_area .top_area .close_bn img{width:22px; height:22px;}
.right_area .quick_menu{width:100%;}
.right_area .quick_menu > ul > li{width:100%; line-height:60px; font-weight:600; font-size:18px; text-indent:45%;}
.right_area .quick_menu > ul > li.quick01{background:#2cc9d1 url(/m/img/quick01.png) no-repeat 25% center; background-size:40px 37px; color:#fff;}
.right_area .quick_menu > ul > li.quick02{background:#fff url(/m/img/quick02.png) no-repeat 25% center; background-size:40px 37px; color:#808386;}
.right_area .quick_menu > ul > li.quick03{background:#ffcf28 url(/m/img/quick03.png) no-repeat 25% center; background-size:40px 37px; color:#360505;}
.right_area .quick_menu > ul > li.quick04{background:#808386 url(/m/img/quick04.png) no-repeat 25% center; background-size:40px 37px; color:#2cc9d1;}


/* lnb 메뉴 */
.sub_lnb_wrap {width:100%; height:50px; position:fixed; top:70px; left:0; z-index:200;}
.sub_lnb {/*max-width:640px;*/ min-width:320px; width:100%; height:50px; margin:0 auto; z-index:100; position:relative; }
.sub_lnb > div {width:50%; height:100%; float:left; position:relative; }
.sub_lnb > div.depths_01 {background:#0066b3; border-right:1px solid #80b3d9;}
.sub_lnb > div.depths_02 {background:#0066b3;}
.sub_lnb > div.selected {background:#0066b3;}
.sub_lnb > div p.title {width:100%; height:100%;}
.sub_lnb > div p.title > .txt {display:block; line-height:50px; font-size:16px; letter-spacing:-1px; font-weight:800; color:#fff; text-indent:20px; float:left;}
.sub_lnb > div p.title > .arrow {display:block; float:right; margin-right:15px;}
.sub_lnb > div p.title > .arrow img {width:15px; padding-top:22px;}

.sub_lnb > ul {width:50%; height:0; position:absolute; top:50px; overflow-y:auto; overflow-x:hidden;}
.sub_lnb > ul.lnb_ul li {width:100%; background:#e9e9e9; border-bottom:1px solid #bebebe;}
.sub_lnb > ul.lnb_ul li > a {width:100%; height:45px; line-height:45px; font-size:16px; letter-spacing:-1px; display:block; text-indent:20px; color:#575757; font-weight:500; background:url(/m/img/sub_lnb_bl.png) no-repeat 20px center; background-size:11px 3px; padding-left:15px;}
.sub_lnb > ul.lnb_ul li.on {background:#e9e9e9; color:#575757; font-weight:500;}
/*.sub_lnb > ul.lnb_ul li.on > a*/

.sub_tab_m .tab_depth > a{display:block; height:50px;  line-height:50px; font-size:16px; background-color:rgba(255,255,255,.75); padding:0 15px; box-sizing:border-box; border-left :1px solid #7d7e7f; background-repeat:no-repeat; background-position:95% center; background-image:url('/img/mdepth_down.png'); background-size:15px; color:#5c5d5f;}

.sub_lnb > ul.lnb_ul li > a:active {color:#56575a; background:#5cbfe0;}

.sub_lnb > ul.ul_01 {left:0;}
.sub_lnb > ul.ul_02 {right:0;}
.sub_lnb > ul.ul_02 > li {width:100%; position:absolute; top:0; left:100%;}
.sub_lnb > ul.ul_02 > li.li_01 {left:0;}



/* ==================================================
	contents
================================================== */
#container{position:relative; top:70px; /*padding-bottom:70px; */overflow:hidden;}



/* ==================================================
	link
================================================== */
.link{clear:both; width:100%; position:relative; min-width:320px; margin:0 auto 10px; padding:0; text-align:center;}
.link li{width:25%; float:left;}
.link li a img{height:75px;}
.link .link01{background-color:#e8e8e8; width:50%;}
.link .link02{background-color:#ffcf28;}
.link .link03{background-color:#0066b3;}



/* ==================================================
	footer
================================================== */
#footer{clear:both; width:100%; position:relative; min-width:320px; margin:0 auto; padding:0 0 30px 0; text-align:center;}
#footer .logo{padding:15px 0 10px; font-size:18px; font-weight:600; color:#535456;}
#footer .footer_sns {clear:both; position:relative; text-align:center; margin:10px 20%;}
#footer .footer_sns li{display:inline-block; width:60px; text-align:center;}
#footer .footer_sns li a{display:block; width:90%;}
#footer .footer_sns li a img{width:52px;}
#footer .footmenu{width:100%; margin:0 auto;  position:relative; overflow:hidden; text-align:center;}
#footer .footmenu li{display:inline-block; padding:0 10px; position:relative;}

#footer .footmenu li:last-child:after{background:#fff;}
#footer .footmenu li a{color:#535456; font-size:14px; display:block; border-bottom:1px solid #bbbcbc; margin-top:5px;}
#footer .copy{clear:both; font-size:15px;}
#footer .copy span{color:#a2a2a2; font-size:13px;}

/*sub_footer*/
.sub_footer{clear:both; width:100%; position:relative; min-width:320px; /*margin:0 auto 10px;*/ padding:0; text-align:center;}

.sub_footer .intro{background-color:#ffc8d3; padding:30px 0; text-align:center;}
.sub_footer .intro img{height:172px;;}
.sub_footer .number{padding:20px 0;  text-align:center;}
.sub_footer .number img{max-width:90%;}


.db_banner_wrap {
	background:#333d47;
	left: 0px;
	width: 100%;
	height: 90px;
	bottom: 0px;
	padding:10px;
	position: fixed;
	z-index: 99;
	min-width: 320px;
}
.db_banner_input{position:relative; float:left; width:80%;}
.db_banner_input .username{width:35%; display:inline-block; border:none; border-bottom:1px solid #c1c1c1; background:#333d47;  color:#fff; font-size::16px;}
.db_banner_input .usercell{width:60%; display:inline-block; border:none;  border-bottom:1px solid #c1c1c1; background:#333d47;  color:#fff; font-size::16px;}
.db_banner_wrap .quick_db_enter{background:#2cc9d1; color:#333d47; font-size:18px; font-weight:500; float:right; display:block; width:20%; line-height:18px; padding:15px 0;}
.quick_db_policy{position:absolute; bottom:15px; left:15px; color:#c1c1c1; }

/* ==================================================
	skip
================================================== */
a.skip{display:block;position:absolute;top:-1px;z-index:999;width:0;height:0;overflow:hidden;text-align:center}
a.skip:active,a.skip:focus{z-index:999;width:100%;height:auto;padding:5px;background:#FFF}



input[type=button] {cursor:pointer !important;}
.cp{cursor:pointer !important;}

.wid10{width:10% !important;}
.wid20{width:20% !important;}
.wid29{width:29% !important;}
.wid30{width:30% !important;}
.wid40{width:40% !important;}
.wid50{width:50% !important;}
.wid60{width:60% !important;}
.wid70{width:70% !important;}
.wid80{width:80% !important;}

.wid100{width:100px !important;}
.wid200{max-width:200px !important;}
.wid300{width:300px !important;}
.wid400{width:400px !important;}
.wid500{width:500px !important;}

.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}
.mt70{margin-top:70px !important;}
.mt80{margin-top:80px !important;}
.mt90{margin-top:90px !important;}
.mt100{margin-top:100px !important;}

.pb10{padding-bottom:10px !important;}
.pl25{padding-left:25px !important;}

.bno{border:none !important;}
.blind{position:absolute; top:-999999px; width:0; height:0; font-size:0; overflow:hidden;}
.clear{clear:both;}

.fl_l{float:left !important;}
.fl_r{float:right !important;}
.txt_l{text-align:left !important;}
.txt_c{text-align:center !important;}
.txt_r{text-align:right !important;}
.ver_t{vertical-align:top !important;}
.txt_b{font-weight:bold !important;}
.txt_ul{text-decoration:underline !important;}

.wbreak{word-break:break-all !important;}


/* 셀렉트 */
.selectric-dSelect{position:relative;float:none;width:245px;margin:0 0 0 0;}
.selectric-dSelect .selectric{border:1px solid #d1d1d1}
.selectric-dSelect .selectric .label{font-size:14px;color:#666;text-align:left;text-overflow:ellipsis;letter-spacing:0}
.selectric-dSelect .button{right:10px;top:12px;width:12px;height:7px;background:url("/img/list_arrow.png") no-repeat left top}
.selectric-dSelect.selectricOpen .button{background-position:left bottom}
.selectric-dSelect .selectricItems{padding:4px 0 0 0;background:#fff;border:1px solid #d1d1d1;border-top:0}
.selectric-dSelect .selectricItems li{padding:5px 15px 5px 10px;background:#fff;border:0;font-size:14px;color:#666;text-align:left}
.selectric-dSelect .selectricItems li:hover,
.selectric-dSelect .selectricItems li.selected{background:#efefef;color:#666}
.selectric-dSelect.selectricAbove .selectricItems{padding:0 0 4px 0;border:1px solid #d1d1d1;border-bottom:0}

/* 라디오 버튼 */
.radio_box label{font-size:14px;color:#666}
.radio_box label + label{margin:0 0 0 24px;}


/* 체크 박스 */
.check_box label{font-size:14px;color:#666}
.check_box label + label{margin:0 0 0 24px;}

/* input type="file"*/
.fileBox{overflow:hidden;}
.fileBox .inputBox{float:left;}
.fileBox input[type="text"]{float:left;overflow:hidden;box-sizing:border-box;height:32px;padding:8px 10px;border:1px solid #d1d1d1;font-size:14px;line-height:1;letter-spacing:-1px;color:#999;background:#fafafa;}
.fileBox .fileBtn{float:left;margin-left:13px;}
.fileBox .fileBtn label{display:inline-block;width:125px;font-size:14px;line-height:32px;letter-spacing:-1px;color:#fff;background:#999;text-align:center;}
.fileBox .fileBtn input[type="file"]{visibility:hidden;width:0;height:0;padding:0;margin:0;}