/*초기화 코드*/

@import url("http://fonts.googleapis.com/earlyaccess/nanumgothic.css");

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, a, p, del, dfn, em, img, ins, kbd, q, samp, small, strong, 
b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, footer, header, nav, section ,article{
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:12px;
  font-family:'나눔고딕', NanumGothic, 'Nanum Gothic',arial, Helvetica, AppleGothic, sans-serif;
  vertical-align:baseline;  
}


a:link {text-decoration:none; color:#333;}
a:visited {text-decoration:none; color:#333;}
a:active {text-decoration:none; color:#333;}
a:hover {text-decoration:none; color:#333;}

html, body { width: 100%; height: 100%; margin: 0; padding: 0; outline: 0; border: 0; }

table { border-collapse: collapse; border-spacing: 0; }
input{ outline-style:none;} , textarea{ outline-style:none;}
input,select{
	font-size:12px;
	font-family:'나눔고딕', NanumGothic, 'Nanum Gothic',arial, Helvetica, AppleGothic, sans-serif;
	color:#3d3d3d;
	border:1px solid #bbb;
}

img { max-width: 100%; vertical-align: middle; }
img,embed,object,video { max-width: 100%; }
img,fieldset,iframe{border:0 none}
br{letter-spacing:0px;}
header, footer, aside, section, article,div { display:block; }
div,ul,li{margin:0;padding:0;list-style:none;display:block}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/*640px CSS코드*/

#wrap{max-width:640px;margin:0 auto; width:100%; position:relative; overflow:hidden;}

.Bg {width:100%; height:100%; position:fixed; background-color:#000; opacity:0.7; z-index:102; display:none; max-width:640px;}



/*이미지 슬라이더 CSS*/
.bx-controls {position:relative;}
.bx-controls .bx-pager{position:absolute; top:-70px; right:50%; z-index:999; margin-right:-61px;}
.bx-controls .bx-pager .bx-pager-item{display:inline-block; margin:0 2px; z-index:9999;}
.bx-wrapper .bx-pager.bx-default-pager a{background-image:url('/img/main/best_dot01.png'); width:18px; height:18px; display:block; }
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background-image: url('/img/main/best_dot02.png'); width:68px; height:18px; display:block;
}

/*이미지슬라이더 좌우버튼 안보이게 설정*/
.bx-controls-direction{display:none;}



/* 이미지슬라이더 좌우 CONTROLS (NEXT / PREV) */

/*
.bx-wrapper .bx-prev {left: 10px; background: url(images/controls.png) no-repeat ;}
.bx-wrapper .bx-next {right: 10px; background: url(images/controls.png) no-repeat ;}

.bx-wrapper .bx-prev:hover {background-position: 0 0;}
.bx-wrapper .bx-next:hover {background-position: -43px 0;}

.bx-wrapper .bx-controls-direction a { position: absolute; top: 50%; margin-top: -16px;	outline: 0;	width: 32px; height: 32px; text-indent: -9999px; z-index: 9999;}
.bx-wrapper .bx-controls-direction a.disabled {	display: none;}

*/

/*이미지슬라이더 CSS 끝*/

.indexNavi {width:100%;}
.indexNavi > ul {}
.indexNavi > ul > li {}
.indexNavi > ul > li > a {display:block; padding:10px 0; text-align:center; margin:10px 0; border:1px solid #ccc; background-color:#ff6501; color:#fff;}

.topLine {width:97%; padding:10px; background-color:#ff6501;}
.topLine > ul {}
.topLine > ul:after {content:''; display:block; clear:both;}
.topLine > ul > li {float:left; color:#fff; padding:0 5px;}
.topLine > ul > li > a {color:#fff;}

.TopWarp { position:relative; }
.TopWarp > h1 > a{display:block; text-align:center;}
.TopWarp > h1 > a > img {width:30%; padding:10% 0; transition:all .3s ease;}

.fixed {position:fixed; z-index:999; width:100%; top:0px; background-color:#fff; max-width:640px; border-bottom:1px solid #ccc;}
.fixed > h1 > a > img { padding:2% 0;}
.fixed .leftMenu-btn {padding:23px 0 0 0 !important;}

.leftMenu-btnWrap {position:absolute; top:5%; left:5%; z-index:100; cursor:pointer;}
.leftMenu-btnWrap .leftMenu-btn {width:30px; height:40px; position:relative; padding:45px 0 0 0; margin:0 30px 0 0; }
.leftMenu-btnWrap .leftMenu-btn .Navibar {position:absolute; width:100%; height:2px; background-color:#000; transition:all 0.3s ease;}
.leftMenu-btnWrap .leftMenu-btn .Navibar:after {position:absolute; content:''; display:block; width:100%; height:2px; background-color:#000; top:-8px; transition:all 0.3s ease;}
.leftMenu-btnWrap .leftMenu-btn .Navibar:before {position:absolute; content:''; display:block; width:100%; height:2px; background-color:#000; top:8px; transition:all 0.3s ease;}

.TopWarp .leftMenuWrap {position:absolute; top:-34px; left:-100%; z-index:103; width:100%; background-color:#fff; overflow-y:auto; border-bottom:5px solid #ff6501; display:none;}
.TopWarp.fixed .leftMenuWrap {top:0;}
.TopWarp .leftMenuWrap .leftMenuInner {width:100%;}
.TopWarp .leftMenuWrap .leftMenuInner .left-tit {padding:10px; border-bottom:1px solid #ccc; position:relative; background-color:#f1f1f1;}
.TopWarp .leftMenuWrap .leftMenuInner .left-tit .left-close {position:absolute; top:7px; right:10px; cursor:pointer; font-size:1.4rem;}
.TopWarp .leftMenuWrap .leftMenuInner > ul {}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li { }
.TopWarp .leftMenuWrap .leftMenuInner > ul > li:last-child {border:none;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p{padding:10px; color:#fff; font-weight:bold; cursor:pointer;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p.p01 {background-color:#265d94;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p.p02 {background-color:#ff6501;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p.p03 {background-color:#c93138;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p.p04 {background-color:#cd8f2d;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p.p05 {background-color:#d25e26;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > p > a{display:block; color:#fff;}

.TopWarp .leftMenuWrap .leftMenuInner > ul > li > ul {padding:10px 0 10px 0; display:none;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > ul > li{padding:5px 30px;}
.TopWarp .leftMenuWrap .leftMenuInner > ul > li > ul > li > a{display:block;}


.mainSl01_Wrap {width:100%; background-color:#efefef;}
.bx-mainSl01 {margin:0 auto; padding:10px 0;}
.mainSl01 {}
.mainSl01 > li {}
.mainSl01 > li > a {display:block;}
.mainSl01 > li .rel_box {position:relative;}
.mainSl01 > li .rel_box .po_box {position:absolute; top:0; left:0;}
.txt_box { text-align:center; font-size:9px !important; padding:5px 0;}

.mainNavi {width:100%;}
.mainNavi:after {content:''; display:block; clear:both;}
.mainNavi > li {float:left; width:31.333%; margin:1%; border-radius:15%;}
.mainNavi > li > a {display:block; padding:15% 0; text-align:center; color:#fff; font-size:1.3rem;}

.mainNavi > li.navi01 {background-color:#447fb7;}
.mainNavi > li.navi02 {background-color:#46b97e;}
.mainNavi > li.navi03 {background-color:#f8b74f;}
.mainNavi > li.navi04 {background-color:#fd844b;}
.mainNavi > li.navi05 {background-color:#f2555c;}
.mainNavi > li.navi06 {background-color:#447fb7;}
.mainNavi > li.navi07 {background-color:#f8b74f;}
.mainNavi > li.navi08 {background-color:#46b97e;}
.mainNavi > li.navi09 {background-color:#fd844b;}


.main_Section {width:100%;}
.main_Section .main_Section_Inner{width:100%;}
.main_Section .main_Section_Inner h2 {position:relative; padding:10px; border-top:1px solid #ccc; border-bottom:1px solid #ccc; font-size:1.2rem; margin:10px 0 0 0; background-color: #f1f1f1;}
.main_Section .main_Section_Inner h2 > a {position:absolute; top:10px; right:1%; color:#de2c2c;}
.main_Section .main_Section_Inner > ul {width:100%;}
.main_Section .main_Section_Inner > ul:after {content:''; display:block; clear:both;}
.main_Section .main_Section_Inner > ul > li {width:50%; float:left;}
.main_Section .main_Section_Inner > ul > li > a {display:block; width:94%; margin:10px auto; border:1px solid #ccc;}
.main_Section .main_Section_Inner > ul > li > a > div.imgBox {width:94%; margin:6px auto;}
.main_Section .main_Section_Inner > ul > li > a > div.imgBox > img {width:100%; height:110px;}
@media all and (min-width:500px) and (max-width:640px){	.main_Section .main_Section_Inner > ul > li > a > div.imgBox > img {height:160px;} }
@media all and (min-width:450px) and (max-width:500px){	.main_Section .main_Section_Inner > ul > li > a > div.imgBox > img {height:140px;} }
.main_Section .main_Section_Inner > ul > li > a > div.txtBox {width:94%; margin:6px auto;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox table {width:100%;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox table tr td {text-align:center;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox .txt_color01 {color:#ff6501; display:block; margin:2px 0;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox .txtBox_col01 {text-align:center;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox .txtBox_col02 {text-align:center;}
.main_Section .main_Section_Inner > ul > li > a > div.txtBox .txtBox_col03 {text-align:center;}

.headImg {width:100%;}
.headImg > img {width:100%;}

/* agent */
.subAgent {width: 98%; margin: 0 auto 20px; }
.subAgent:after {content:''; display:block; clear:both;}
.subAgent > h2 {font-size:1.6rem;}
.subAgent  ul { width: 100%; margin-top: 20px; box-sizing: border-box; border: 3px solid #e0e0e0; }
.subAgent  ul:after {display:block; content: ''; clear: both;}
.subAgent  ul > li { display: inline-block; width: 36%; padding: 10px; box-sizing: border-box; vertical-align: middle; }
.subAgent  ul > li:first-child { width: 25%; padding-left: 0; background: url("/mobile/img/main/logo.jpg") no-repeat center center; background-size: 60%; }
.subAgent  ul > li:first-child > p { font-size: 1.6rem; font-weight: bold; text-align: center; margin-top: 70px; }
.subAgent  ul > li > div { margin-bottom: 10px; }
.subAgent  ul > li > div > img { display: inline-block; margin-right: 10px; vertical-align: middle; width: 25%; }
.subAgent  ul > li > div > div { display: inline-block; vertical-align: middle; }
.subAgent  ul > li > div > div > p { font-size:1.4rem; font-weight: bold; padding: 2px; }
.subAgent  ul > li > div > div > p.cell { color: #007236; font-weight: bold; }
.subAgent  ul > li > div > div > p > span { font-size: 1.2rem; }
.subAgent  ul > li > div > div > span { font-size: 1.2rem; }

@media all and (min-width:321px) and (max-width:480px)
{
	.subAgent  ul > li:first-child > p { font-size: 1.6rem; font-weight: bold; text-align: center; margin-top: 35px; }

	.subAgent  ul > li {padding: 5px; }
	.subAgent  ul > li > div > div > p { font-size:1.2rem; font-weight: bold; padding: 1px; }
	.subAgent  ul > li > div > img { width: 25%; margin: 0; }
	.subAgent  ul > li:first-child > p { font-size: 1.0rem; }
	.subAgent  ul > li > div > div > p { font-size: 0.8rem; }
	.subAgent  ul > li > div > div > p.cell { font-size: 0.8rem; color: #007236; font-weight: bold; }
	.subAgent  ul > li > div > div > p > span { font-size: 0.8rem; }
	.subAgent  ul > li > div > div > span { font-size: 0.8rem; }
	.subAgent  ul > li > div > div > h6 { font-size: 0.8rem; }
}

@media all and (min-width:481px) and (max-width:614px)
{
	.subAgent  ul > li:first-child > p { font-size: 1.2rem; font-weight: bold; text-align: center; margin-top: 45px; }
	.subAgent  ul > li > div > div > p { font-size:1.0rem; font-weight: bold; padding: 1px; }
}

.messageBox {margin:10px 0; font-size:0.8rem; color:#ff6501;}

.cs_Box {margin:10px 0;}

.infoBox {margin:10px auto; width:90%; border:1px solid #ccc; padding:10px;}

.map {width:95%; margin:0px auto 20px;}
.root_daum_roughmap {width:100% !important;}

.footerNavi { border-top:1px solid #ccc;}
.footerNavi > ul {}
.footerNavi > ul:after {content:''; display:block; clear:both;}
.footerNavi > ul > li {float:left; padding:10px 0; width:25%;}
.footerNavi > ul > li > a {display:block; text-align:center;}

.footer {padding:5% 1%; background-color:#46b97e;}
.footer > p {margin:2% 0; color:#fff;}
.footer > p > a {color:#fff;}

/* 로그인 CSS */

.loginBox {width:100%; padding:5% 0;}
.loginBox > h2 {text-align:center; font-size:1.3em; padding:5% 0;}

.loginBox table.loginInputArea {margin:0 auto;}
.loginBox table.loginInputArea input {padding:5px;}
.loginBox table.loginInputArea tr tr {}
.loginBox table.loginInputArea tr td {vertical-align:middle;}
.loginBox table.loginInputArea tr td label {}
.loginBox table.loginInputArea tr td label img {}

.loginBox table.loginBtnArea {margin:3% auto;}
.loginBox table.loginBtnArea {}
.loginBox table.loginBtnArea tr td{vertical-align:middle; }
.loginBox table.loginBtnArea tr td > a {color:#333;}
.loginBox table.loginBtnArea tr td label {vertical-align:middle;}
.loginBox table.loginBtnArea tr td label img {vertical-align:middle;}


/*미디어쿼리*/
/*-------------------------미디어쿼리 320px 구간------------------------------
@media all and (max-width:320px){

	#wrap {width:320px; margin:0 auto;}

}

@media all and (min-width:321px) and (max-width:480px){ 

	#wrap {width:360px; margin:0 auto;}

}*/