@charset "utf-8";

/************ Reset ************/
 * {outline:0 !important;}
html,body,h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,menu,nav,section,article,aside,
dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption {margin:0;padding:0;}
html, body{width:100%;}
html{-webkit-touch-callout:none; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
body{width:100%; background:#fff; min-width:320px; -webkit-text-size-adjust:none;word-wrap:break-word;word-break:break-all;}
body,input,select,textarea,button {border:none;font-size:14px; font-family:'Noto Sans KR', sans-serif; color:#222222; 	letter-spacing: -0.5px;}
ul,ol,li{list-style:none;}
table{width:100%;border-spacing:0;border-collapse:collapse;}
img,fieldset{border:0;}
address,cite,code,em{font-style:normal;font-weight:normal;}
label,img,input,select,textarea,button{vertical-align:middle;}
.hide,caption,legend{line-height:0;font-size:1px;overflow:hidden;}
hr{display:none;}
main,header,section,nav,footer,aside,article,figure{display:block;}
a{color:#000; text-decoration:none;}
 

textarea { border:1px solid #ddd;}
select{ height:40px; width:100%; font-size:16px; color:#373737; border:1px solid #ddd; background:#fff; padding: 0 20px;
	 background: url(../images/select_arrow.png) no-repeat 98% 50%;
	/*셀렉트박스 기본화살표 삭제*/appearance:none; -moz-appearance:none; /* Firefox */ -webkit-appearance:none; /* Safari and Chrome */}
								select::-ms-expand {display:none}/*ie*/
input[type=tel],
input[type=time],
input[type=text],
input[type=password],
input[type=search],
input[type=email],
input[type=file],
input[type=url],
input[type=number],
input[type=date],textarea {width:100%; height:38px; font-size:16px; color:#999; border:1px solid #ddd; background:#fff; 
	text-indent:10px; transition: all 0.5s; vertical-align:middle;}
input::-webkit-input-placeholder{color:#999; font-size:16px; line-height:100%;}
textarea {padding:5px 0;}
select:focus,
textarea:focus,
input:focus { border: 1px solid #727272;}

input[type=tel][readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=email][readonly], 
input[type=search][readonly], 
input[type=tel][disabled],
input[type=text][disabled],
input[type=password][disabled],
input[type=search][disabled],
input[type=email][disabled]{background:#eaeaea; border-color:#ddd; color:#666; -webkit-appearance:none;font-size:16px;}
textarea[readonly],
textarea[disabled]{padding:11px; font-size:16px; color:#666; font-weight:normal; line-height:140%; height:78px; background:#eaeaea; border:1px solid #ddd;}
*/
.clear {clear:both;}
.clear:after { content:""; display:block; clear:both;}


/************중앙정렬 컨테이너************/
.container{width: 1180px; margin: 0 auto; height: inherit;}

/************header************/
header .Wrap{position: fixed; width: 100%; top:40px; height: 72px; z-index:1000;}

/*회원정보 메뉴*/
#util{position: fixed; height: 40px; width: 100%; background: #E8E8E8; z-index:1000; transition: all 0.5s;}
#util ul { float: right;} /* 운주씨 코딩 변경, ADMIN 메뉴때문에  width:214 -> 234로 변경함 */
#util ul li{position: relative; display: inline-block; padding:0 14px; line-height: 36px;}
#util ul li a{font-size: 13px; color:#222; letter-spacing: 0.5px;}
#util ul li::after{content: ""; position: absolute; width: 1px; height: 10px; top:50%; transform: translateY(-40%); margin-left: 14px; background-color:#222; }
#util ul li:last-child{padding-right: 0;}
#util ul li:last-child::after{content: ""; display: none;}

/*회원정보 메뉴 scrollTop*/
#util.scrollTop{background: rgba(0, 0, 0, 0.2);}
#util.scrollTop ul li a{color:#fff;}
#util.scrollTop ul li::after{content: ""; position: absolute; width: 1px; height: 10px; top:50%; transform: translateY(-40%); margin-left: 14px; background-color:rgba(255, 255, 255, 0.5) }

/*로고*/
header .Wrap h1 {display: block; position: absolute; width:200px; height:40px; margin-top: 18px; z-index: 1000; background: url(../images/logo_color.png);}
header .Wrap h1.scrollTop{background: url(../images/logo_white.png);}

/*GNB*/
header #gnb nav{text-align: center; right: 0; top:0; width: 100%;}
header #gnb nav > ul{width: 782px; height: 72px; float: right; overflow: hidden;}
header #gnb nav > ul:hover{overflow: visible;}
header #gnb nav > ul > li{display: inline-block; position: relative; z-index: 1000;}
header #gnb nav > ul > li > a{display: block; position: relative; width:152px; height: 72px; line-height: 72px; font-size: 18px; color: #222; font-weight: 600;}
header #gnb nav > ul >li:hover >a{color:#0097FC;}
header #gnb nav > ul > li > a::after{content: ""; position: absolute; left:50%; bottom: 0; width: 0; height: 4px; z-index: -1000; background-color: #0097FC; transition: all 0.5s;}
header #gnb nav > ul > li:hover > a::after{left:0; width:100%; z-index: 1000;}

/*GNB 배경색*/
header #gnb nav + div{position: absolute; left:0; top:0; width: 100%; height:72px; background-color: #fff; transition: all 0.5s; z-index: 10; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);}
/* 
	은주씨 코딩 변경:
	header #gnb nav + div::after{content: ""; position: absolute; top:72px; width: 100%; height: 300px; background-color: #262E41; opacity: 0; transition: all 0.5s;} 
	서브메뉴의 background div 사이즈 때문에 수강신청 버튼이 가려지는 문제 해결, 대메뉴 hover 시에만 background div를 추가하는 것으로 변경함(기존은 로딩과 동시에 div 추가)
	nav -> nav:hover
*/
header #gnb nav:hover + div::after{content: ""; position: absolute; top:72px; width: 100%; height: 300px; background-color: #262E41; opacity: 0; transition: all 0.5s;}
header #gnb nav:hover + div::after{opacity: 1;}

/*GNB scrollTop*/
header #gnb.scrollTop nav{text-align: center; right: 0; top:0; width: 100%;}
header #gnb.scrollTop nav > ul{width: 782px; height: 72px; float: right; overflow: hidden;}
header #gnb.scrollTop nav > ul:hover{overflow: visible;}
header #gnb.scrollTop nav > ul:hover >li >a{color:#222;}
header #gnb.scrollTop nav > ul > li{display: inline-block; position: relative; z-index: 1000;}
header #gnb.scrollTop nav > ul > li > a{display: block; position: relative; width:152px; height: 72px; line-height: 72px; font-size: 18px; color: #fff; font-weight: 600;}
header #gnb.scrollTop nav > ul >li:hover >a{color:#0097FC;}
header #gnb.scrollTop nav > ul > li > a::after{content: ""; position: absolute; left:50%; bottom: 0; width: 0; height: 4px; background-color: #0097FC; transition: all 0.5s;}
header #gnb.scrollTop nav > ul > li:hover > a::after{left:0; width:100%;}

/*GNB 배경색 scrollTop*/
header #gnb.scrollTop nav + div{position: absolute; left:0; top:0; width: 100%; height:72px; background-color: #fff; opacity: 0; transition: all 0.5s; z-index: 10;}
/* 
	은주씨 코딩 변경:
	header #gnb.scrollTop nav + div::after{content: ""; position: absolute; top:72px; width: 100%; height: 300px; background-color: #262E41; opacity: 0; transition: all 0.5s;} 
	서브메뉴의 background div 사이즈 때문에 수강신청 버튼이 가려지는 문제 해결, 대메뉴 hover 시에만 background div를 추가하는 것으로 변경함(기존은 로딩과 동시에 div 추가)
	nav -> nav:hover
*/
header #gnb.scrollTop nav:hover + div::after{content: ""; position: absolute; top:72px; width: 100%; height: 300px; background-color: #262E41;}
header #gnb.scrollTop nav:hover + div{opacity: 1;}

/*서브메뉴*/
header #gnb nav > ul ul{position: absolute; width:100%; height: 280px; border-right: 1px solid rgba(255, 255, 255, 0.05); text-align: center; padding-top: 16px; opacity: 0; transition: all 0.5s; z-index: 100;}
header #gnb nav > ul li:last-child ul{border-right: 0;}
header #gnb nav > ul:hover ul{opacity: 1;}
header #gnb nav > ul ul li {line-height: 36px;}
header #gnb nav > ul ul a{font-size: 14px; color: #fff; letter-spacing: 0.5; transition: all 0.5s;}
header #gnb nav > ul ul a:hover{color: #0ED7D9;}


/*******************************************************************서브페이지 CSS 시작********************************************************************/
/************서브페이지 전체레이아웃************/
/*상단 이미지&터이틀*/
.sub-visual{position: relative; width:100%; height: 402px; background: no-repeat center / cover; }
.sub-visual.bg1{background: url('../images/sub_bg01.png');}
.sub-visual.bg2{background: url('../images/sub_bg02.png');}
.sub-visual.bg3{background: url('../images/sub_bg03.png');}
.sub-visual.bg4{background: url('../images/sub_bg04.png');}
.sub-visual.bg5{background: url('../images/sub_bg05.png');}
.sub-visual.bg6{background: url('../images/sub_bg06.png');}
.titleWrap{position: absolute; top:164px; text-align: center; width: 1180px; margin: 0 auto; }
.titleWrap h2{color: #fff; font-size: 40px; font-weight: 500; }
.titleWrap span{color: #fff; font-size: 18px; font-weight: 400; opacity: .6;}

/*서브페이지 메뉴 셀렉트박스*/
.select-nav{position: absolute; width: 100%; height: 60px; top:342px; background: rgba(255, 255, 255, 0.4); border-top: 1px solid rgba(255, 255, 255, 0.4); z-index: 500;}
.select-nav .container{text-align: left;}
.select-nav .container div{float: left; width: 200px; height: 60px; line-height: 60px; vertical-align: middle; border-right: 1px solid rgba(255, 255, 255, 0.4); box-sizing: border-box;}
.select-nav div.home{width: 60px; text-align: center; border-left: 1px solid rgba(255, 255, 255, 0.4); font-size: 20px; color: #fff;}
.select_wrap{width: 200px; position: relative; user-select: none;}
.select_wrap ul{position: relative; overflow: hidden;}
.select_wrap .default_option:before{content: ""; position: absolute; top: 22px; right: 20px; width: 6px; height: 6px; border: 2px solid; border-color: transparent transparent #fff #fff; transform: rotate(-45deg);}
.select_wrap ul li{color: #fff; font-size: 16px; font-weight: 500; padding-left: 20px; height: 60px; box-sizing: border-box;}
.select_wrap .default_option:hover{background-color: #F3F3F3; border: 1px solid #222; overflow: visible;}
.select_wrap .default_option:hover li{color: #222;}
.select_wrap .default_option:hover .select_ul{opacity: 1;}
.select_wrap .default_option:hover:before{top: 26px; transform: rotate(-225deg); border-color: transparent transparent #222 #222;}
.select_wrap .select_ul{position: absolute; top: 60px; left:-1px; width: 100%; opacity: 0; border-left: 1px solid #222; border-right: 1px solid #222; }
.select_wrap .select_ul li{position: relative; padding-left:32px; cursor: pointer; background-color:#fff; border-bottom: 1px solid #DDDDDD; font-size: 16px; font-weight: 400; color:#222; transition: all 0.5s;}
.select_wrap .select_ul li:last-child{border-bottom: 1px solid #222;}
.select_wrap .select_ul li::before{content: ""; position: absolute; width: 4px; height: 4px; border-radius: 10px; background-color: #222; top:30px; left: 20px; transition: all 0.5s;}
.select_wrap .select_ul li:hover{background: #124574; color:#fff}
.select_wrap .select_ul li:hover::before{content: ""; background-color: #fff}


/************contentWrap************/
.contentWrap{position: relative; width: 1180px; margin: 0 auto; margin-top:40px; margin-bottom:100px;}
section{min-height: 540px;}
section article{margin-bottom: 40px;}
section article:last-child{margin-bottom: 0;}
.conbox1{font-size:16px; border: 1px solid #ddd; padding: 16px; line-height: 34px;}
/*알럿박스*/
.conbox2{font-size:17px; border: 2px solid #ddd; padding: 20px; display: flex; justify-content: center; align-items: center; }
.conbox2 p{display: inline-block; vertical-align: middle;}
.conbox2 p.center{text-align: center; }
/*박스안 자식 요소 정렬*/
.flexh{display: flex; align-items: center;}/*자식요소 가로 중앙정렬*/
.flexh .inputBox{border: 0; height: 48px; margin-right: 10px;}
.flexall{display: flex; align-items: center; justify-content: center;}/*자식요소 가로세로 중앙정렬*/


/*서브페이지 제목*/
section h3{position: relative; font-size:24px; font-weight: 500; margin:0 0 12px 14px; letter-spacing: -1px;}
section h3::before{content: ""; position: absolute; width:4px; height: 24px; background-color: #0097FC; top:8px; left:-16px}
section h4{position: relative; font-size:22px; font-weight: 700; margin:0 0 12px 24px; letter-spacing: -1px; color: #184570;}
section h4::before{content: '\2663'; position: absolute; font-size:22px; color: #80BA1B; top:2px; left:-26px}
.tabTitle{font-size: 20px; font-weight:500; color: #184570; margin-bottom: 10px; margin-top: 30px;}
/*연수결과 상세*/
.result_detail .tabTitle{margin-top: 20px;}


/*기본표 스타일*/
.Board tr{border: 1px solid #ddd;  border-left:none; border-right: none;}
.Board th{font-size:17px; font-weight: 500; background-color:#F3F3F3; padding: 15px; height: 29px;}
.Board td{font-size:16px; text-align: center; padding: 15px; height: 29px;}
.Board td.alignLeft{text-align: left;}
.Board td.bg_gray{font-size:17px; font-weight: 500; background-color:#F3F3F3; padding: 15px;}

/*th이 세로로 있는 표스타일*/
.Board.vtcl tr td:first-child{font-size:17px; font-weight: 500; background-color:#F3F3F3;}
/*마지막 tr 강조표*/
.Board tr.lasttr{border: 1px solid #222; border-left:none; border-right: none;}
.Board tr.lasttr:last-child td{font-size:17px; font-weight: 500;}

/*나의 연수 현황표 스타일(tr이 1,3열에 있음)*/
.Board.status tr td:nth-child(1), .Board.status tr td:nth-child(3), .Board.status tr td:nth-child(5){font-size:17px; font-weight: 500; background-color:#F3F3F3;}
.Board.status tr{height: 60px;}
.Board.status td{padding: 0 15px;}
.statusBox{position: relative; display: inline-block; width: 80%; height: 10px; border-radius: 50px; background-color: #F3F3F3; box-shadow: 1px 1px 2px inset rgba(0,0,0,0.2);}
/* 
	은주씨 코딩 변경:
	실시간 진도율 업데이트를 위해 아래 코딩 삭제, JSP 페이지 내에 그래프 div 삽입함
.statusBox::before{content: ""; position: absolute; top:0; left:0; width: 62%; height: 10px; border-radius: 50px; background-color: #FFA200; }
*/
.pctnum{margin-left: 20px; color: #FFA200; font-size:16px; font-weight: 500;}

/**탭메뉴**/
nav.tabMenu ul{display: flex; border-bottom: 2px solid #184570;  height: 60px; margin-bottom: 30px; width: 100%;}
nav.tabMenu ul li{flex:1; border: 1px solid #ddd; border-left: none; border-bottom:none;}
nav.tabMenu ul li:first-child{border-left: 1px solid #ddd;}
nav.tabMenu ul li a{font-size:18px; font-weight: 500; color: #222; display: block; height: 60px; text-align: center; line-height: 60px;}
nav.tabMenu ul li.on{position: relative; height: 58px; border-color:#184570; border-bottom: 2px solid #184570; background-color:#184570;}
nav.tabMenu ul li.on a{color: #fff}

/*상,하단 주석*/
.notice{color: #222; font-size: 15px; display: inline-block;}
.note{color: #0097FC; font-size: 15px; margin-top: 18px; display: inline-block;}
.note_gray{color: #222; font-size: 15px; margin-top: 10px; display: inline-block;}


/*나의연수과정 - 과제하기*/
.inputBox{display: inline-block; width: 626px; height: 46px; border: 1px solid #ddd; border-radius: 0;}

/*참여(설문)*/
.chkWrap{margin-left: 70px; margin-top: 8px;}
.chkWrap li{display: inline-block; margin-right: 40px;}
.BoardNum{display: inline-block; width: 70px; text-align: center;}
.Board td.chk{padding: 20px;}

/*라디오버튼*/
/* input[type="radio"]{display: none;}  */
/*
.radio{position: relative; padding-left: 26px; cursor: pointer; }
.radio span{position: absolute; left:0; top:2px;}
.radio span::before{content: "\e9c6"; position: absolute; color: #0097FC; font-family: 'xeicon'; font-size: 22px;}
.radio input[type="radio"]:checked ~ span::before{content: "\e9c7"; position: absolute; color: #0097FC; font-family: 'xeicon'; font-size: 22px;}
*/

/*연수후기목록(게시판 형식)*/
tr.ans td{background-color: #F9F9F9; padding: 24px;}
td.best::before{content: "BEST"; color:#FFA200; font-size: 12px; border: 1px solid #FFA200; border-radius: 5px; padding:0 6px 2px 6px; margin-right: 8px;}
.ans div a{padding: 7px 16px;}
.vr{position: absolute; width: 1px; height: 16px; margin-top: 5px; background-color: #222;}
.boardPager{text-align: center; margin: 20px 0;}
.boardPager li{display: inline-block;}
.boardPagerWrap{position: relative;}
.boardPager li a{display: inline-block; width: 24px; height: 32px; text-align: center;  line-height: 32px; color:#999999;}
.boardPager li.pagerFirst a{width: 32px; height: 32px; text-indent: -9999px; background: url(../images/Icon.png); background-position: 0 -421px;}
.boardPager li.pagerPrev a{width: 32px; height: 32px; text-indent: -9999px; background: url(../images/Icon.png); background-position: -42px -421px; margin-right: 16px;}
.boardPager li.pagerNext a{width: 32px; height: 32px; text-indent: -9999px; background: url(../images/Icon.png); background-position: -84px -421px; margin-left: 16px;} 
.boardPager li.pagerLast a{width: 32px; height: 32px; text-indent: -9999px; background: url(../images/Icon.png); background-position: -126px -421px} 
.boardPager li.on a{color: #222; text-decoration: underline;}
/*연수후기 글쓰기*/
.chkWrap2 li{display: inline-block; margin-right: 20px;}
textarea#txta_ty1{height: 420px; resize: none; margin-top: 20px; box-sizing: border-box; padding: 15px; text-indent: 0; overflow: hidden;}
td.review input[type=text]{border: none; text-indent:0}


/*Q&A상단 검색박스*/
.BoardTopWrap{margin-bottom: 16px; position: relative; height:48px}
.BoardTopWrap span:first-child{line-height: 69px;}
.BoardTopWrap .BoardTop{position: absolute; right: 0;}
.BoardTop select{width: 100px; background: url(../images/select_arrow.png) no-repeat 90% 50%; margin-right: 6px; height: 48px;}
.BoardTop input[type=text]{display: inline-block; height: 48px; width: 400px;}
.btn_serchico{float: right; width: 48px; height: 48px; background-color: #0097FC; text-align: center;}
.btn_serchico::before{content: "\e97a"; font-family: 'xeicon'; color: #fff; font-size: 24px; line-height: 48px;}

/*Q&A(게시판형식)*/
.Board.qna{table-layout:fixed}
.Board.qna td{overflow: hidden; text-overflow: ellipsis; white-space : nowrap;}
.Board.qna tr.replyWrap{background-color: #F9F9F9; height: 64px; border: none;}
.reply{content: ""; color:#FFA200; font-size: 15px; border: 1px solid #FFA200; border-radius: 5px; width:70px; height: 32px; line-height: 32px; margin: 0 auto;}
.reply_none{color:#999; font-size: 15px; border: 1px solid #999; border-radius: 5px; width:70px; height: 32px; line-height: 32px; margin: 0 auto;}
.xi-lock{color:#999; margin-left: 6px; font-size: 20px; vertical-align: middle; margin-bottom: 4px;}
/*게시판 글 상세페이지*/
.replyWrap{padding:24px; border-bottom: 1px solid #ddd; font-size: 16px;}
.replyBox{margin-top: 70px;}
.replyBox textarea{width:1072px; height: 96px; resize: none; box-sizing: border-box; padding: 15px; text-indent: 0; overflow: hidden; border-radius: 5px; }
.btn_box{float: right; width: 95px; height: 95px; font-size: 17px; font-weight: 500; text-align: center; line-height: 95px; border: 1px solid #999; color: #999; border-radius: 5px; }

/*연수기간연장*/
textarea#txta_ty2{height: 106px; resize: none; box-sizing: border-box; padding: 15px; text-indent: 0; overflow: hidden;}


/***********접수 중인 과정***********/
ul.flexContainer{width: 100%; height: 62px; display: flex; align-items: center; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd;}
ul.flexContainer li{flex:1; text-align: center; position: relative;}
ul.flexContainer li a{font-size: 20px; color:#222; font-weight: 500; transition: all 0.5s;}
ul.flexContainer li:hover a{color:#0097FC;}
ul.flexContainer li a::after{content: ""; position: absolute; left:50%; bottom: -18px; width:0; height: 4px; background-color:#0097FC; transition: all 0.5s;}
ul.flexContainer li:hover a::after{left:0; width:100%}
/**클릭한 메뉴**/
ul.flexContainer li.on a{color:#0097FC; font-weight: 700;}
ul.flexContainer li.on a::after{content: ""; position: absolute; left:0; bottom: -18px; width: 100%; height: 4px; background-color:#0097FC;}

.sumWrap{background-color: #F9F9F9; padding: 32px; margin-bottom: 40px; text-align: center;}
.sumWrap p{font-size: 16px;}
.sumWrap p.title{font-size: 24px; font-weight: 500; margin-bottom: 10px; letter-spacing: -1px;}

/*접수중인과정 상세*/
.lec_info{margin-bottom: 30px;}
.lec_info > div{width: 440px; height: 242px; display: inline-block; vertical-align: top; margin-right: 20px; overflow: hidden;}
.lec_info > .Board.status{float: right; width: 710px; }
.lec_info + h3{clear: both;}

/*라디오버튼2*/
/*
.radio2{position: relative; padding-left: 26px; cursor: pointer;}
.radio2 span{position: absolute; left:0; top:-6px; }
.radio2 span::before{content: "\ea0e"; position: absolute; color: #0097FC; font-family: 'xeicon'; font-size: 34px;}
.radio2 input[type="radio"]:checked ~ span::before{content: "\e92d"; position: absolute; color: #0097FC; font-family: 'xeicon'; font-size: 34px;}
*/

/*연수과정 목차*/
td.writer{font-size: 17px; font-weight: 500; padding-left: 30px; vertical-align: top;}

/*결제방법 안내 하단 텍스트 박스*/
.noteWrap{background-color: #F3F3F3; padding: 24px; font-size: 16px; margin-top: 20px;}
.noteWrap .title{font-size: 17px; font-weight: 500; line-height: 40px; }
.noteWrap p{text-indent: 1em;}
.noteWrap p.txtindent2{text-indent: 2em;}
.noteWrap p:last-child{margin-bottom: 16px;}
.noteWrap p.end{margin-bottom: 0}

/*수강신청 결과 박스*/
.conbox3{font-size:16px; border: 1px solid #ddd; border-radius: 10px; text-align: center; padding: 30px 60px;}
.conbox3 .title{font-size: 20px; font-weight: 500; color: #0097FC; line-height: 40px;}


/*단체수강신청*/
.stepinfo{border: 1px solid #ddd; padding: 30px 0; display: flex; align-items: flex-start; border-radius: 10px;}
.infoWrap{text-align: center; flex:1; padding: 0 48px; position: relative; font-size: 16px; line-height: 22px;}
.infoWrap::after{content: "\e93e"; position: absolute; left:-20px; top:56px; font-family: 'xeicon'; font-size:40px; color: #ddd; font-weight: 700;}
.infoWrap.ty2::after{content: "\e93e"; position: absolute; left:-20px; top:40%; font-family: 'xeicon'; font-size:40px; color: #ddd; font-weight: 700;}
.infoWrap:first-child::after{display: none;}
.infoWrap .title{font-size: 18px; font-weight: 500; color:#0097FC; border-bottom: 1px solid #0097FC; padding-bottom: 4px;}
.infoWrap p:nth-child(2){padding: 10px;}
.infoWrap a{color:#0097FC; text-decoration: underline;}

.GroupClass p{font-size: 15px;}
.formWrap{margin-top: 10px; font-size: 0;}
.formWrap li{display: inline-block; font-size: 16px; vertical-align: middle;}
.formWrap .text{width: 140px; height: 46px; display: inline-block; text-align: center; font-size: 17px; font-weight: 500; line-height: 46px; background-color: #F3F3F3; border: 1px solid #ddd; border-right: none;}
.formWrap input[type=text]#class {width: 468px; height: 48px; margin-right: 10px;}
.formWrap input[type=text]#code {width: 604px; height: 48px;}
.formWrap .btn48_full{margin-left: 10px;}


.Payconfirm input[type=text]#name{width: 230px;}
.Payconfirm input[type=text]#num{width: 320px; margin-right: 20px;}
.Payconfirm input[type=text]#num + span{vertical-align: middle;}

.est select{width: 100px; background: url(../images/select_arrow.png) no-repeat 90% 50%; margin-right: 6px;}
select#year{width: 144px;} 
.est a{vertical-align: middle;}

/*무통장 입금 안내*/
.bankinfo .conbox2{margin-top: 20px;}
.bankinfo .notice{margin: 10px 0;}

/*시도교육청위탁연수*/
.infoBox{display: flex; border: 1px solid #ddd; padding: 24px 40px; font-size: 16px; margin: 10px 0 20px 0; align-items: center;}
.vline{width: 44px; height: 48px; border-right:1px solid #ddd; margin-right:40px;}


/**********로그인 및 아이디/비번찾기**********/
.lineBox{background-color: #F9F9F9; border: 1px solid #ddd; padding: 40px 30px; margin: 0 auto; text-align: center; font-size: 16px; border-radius: 5px;}
.lineBox .title{font-size: 20px; font-weight: 500;}
.boxWrap{position: relative; width: 570px; margin: 0 auto; text-align: left;}
.boxWrap li:nth-child(1),.boxWrap li:nth-child(2) {padding-bottom: 10px; font-weight: 500;}
.boxWrap label{display: inline-block; width: 70px; text-align: left;}
.boxWrap input[type="text"], .lineBox input[type="password"]{width: 382px; height: 46px;}
.btn_log a{display: inline-block; width: 106px; height: 106px; background-color: #0097FC; color: #fff; border-radius: 5px; text-align: center; line-height: 106px;}
.btn_log{position: absolute; right: 0; top:0;}
/*아이디저장 체크박스*/
.save{margin-left: 70px;} 
.save input[type="checkbox"]{display: none;}
.save input[type="checkbox"] + label{display: inline-block; width: 18px; height: 18px; border: 2px solid #0097FC; border-radius: 5px; cursor: pointer; margin-right: 8px; }
.save input[type="checkbox"]:checked + label{background-color: #0097FC; position: relative;}
.save input[type="checkbox"]:checked + label::before{content: "\e929"; position: absolute; color:#fff; font-family: 'xeicon'; font-size: 24px; top:-3px; left:-2px;}
.btm{width: 570px; padding-top: 20px; border-top: 1px solid #ddd; margin: 0 auto; text-align: left; }
.btm li{position: relative; padding-bottom: 10px; height: 40px; line-height: 40px;}
.btm li a{position: absolute; right: 0; border-radius: 5px; }
/*아이디/비번찾기*/
.boxWrap select{width: 110px; height: 48px; background: url(../images/select_arrow.png) no-repeat 92% 50%; margin-right: 8px; background-color: #fff; }
.boxWrap .select{float: left; line-height: 48px;}
.boxWrap select#year{width: 142px;} 
.boxWrap .select#day{clear: both;}
.lineBox p.result{padding-top: 20px; display: inline-block; width: 570px;}
.boxWrap.pw select{width: 120px; height: 48px; background: url(../images/select_arrow.png) no-repeat 92% 50%; margin-right: 7px; background-color: #fff; }
.boxWrap.pw input[type="text"].num{width:120px; margin-right: 7px;}


/**********회원가입**********/
/*상단 step*/
.joinstep{padding: 0 70px; display: flex; align-items: center; justify-content: space-between;}
.stepWrap{position: relative; text-align: center; width: 140px; height: 140px; background-color: #C9C9C9; border: 10px solid #F3F3F3; border-radius: 300px;}
.stepWrap.on{ background-color: #0097FC; }
.stepWrap p{font-size: 16px; font-weight: 500; color:#fff;  display: block; position: relative; top:50%; transform: translateY(-55%);}
.stepWrap .step{font-size: 22px; font-weight: 500; color:#fff}
.stepWrap::after{content: "\e93e"; position: absolute; left:-100px; top:56px; font-family: 'xeicon'; font-size:40px; color: #ddd; font-weight: 700;}
.stepWrap:first-child::after{display: none;}

/*****1단계*****/
.txt20b{font-size: 20px; font-weight: 600;}
.jointitle{font-size: 18px; font-weight: 500; margin:20px 0 10px 0;}
.joinBox{background-color: #F9F9F9; border: 1px solid #ddd; padding: 40px 30px; font-size: 16px; border-radius: 5px; margin-bottom: 0;}
/* 원형 체크박스(전체동의)*/
/*
.joinBox input[type="checkbox"]#chk1{display: none;}
.joinBox input[type="checkbox"]#chk1 + label::before{content: "\e9c6"; color: #0097FC; font-family: 'xeicon'; font-size: 32px; left:0; padding-right: 6px;}
.joinBox input[type="checkbox"]#chk1:checked + label::before{content: "\e9c7";}
*/
/*원형 체크박스*/
/*
.joinBox input[type="checkbox"]{display: none;}
.joinBox input[type="checkbox"] + label::before{content: "\e9c6"; color: #0097FC; font-family: 'xeicon'; font-size: 24px; left:0; padding-right: 6px;}
.joinBox input[type="checkbox"]:checked + label::before{content: "\e9c7";}
*/
/*스크롤박스 내용*/
.joinBox .scrollBox{background-color: #fff; border: 1px solid #ddd; height: 166px; padding: 20px; overflow-y: scroll; font-size: 15px;}
.ptitle1{font-size: 16px; color: #184570; font-weight: 500;}
.ptitle2{font-size: 17px; color: #0097FC; font-weight: 500;}
/*표 스타일*/
.scrollBox table{width: 60%;}
.scrollBox table th{font-size:15px; font-weight: 500; border: 1px solid #ddd; background-color:#F3F3F3; padding: 10px; height: 20px;}
.scrollBox table td{font-size:15px; text-align: center; border: 1px solid #ddd; padding: 10px; height: 20px; }
.scrollBox table td.alignLeft{text-align: left;}

/*****2단계*****/
.joinBox2{background-color: #F9F9F9; border: 1px solid #ddd; padding: 40px 30px; font-size: 16px; border-radius: 5px; margin-bottom: 0; text-align: center;}
.joinBox2 .conWrap{width: 300px; border: 1px solid #ddd; border-radius: 5px; background-color: #fff; display: inline-block; padding: 30px; margin-top: 20px; margin-right: 20px;}
.joinBox2 .conWrap:last-child{margin-right: 0;}
.joinBox2 .conWrap p{font-size: 20px; font-weight: 500; padding-top: 16px; padding-bottom: 8px;}
.conWrap span{padding-bottom: 20px; display: block;} 
.ico_mobile{width: 104px; height: 104px; background: url(../images/Icon.png); background-position: 204px 0; margin: 0 auto;}
.ico_ipin{width: 104px; height: 104px; background: url(../images/Icon.png); background-position: 104px 0; margin: 0 auto;}
.btn_orange{display: inline-block; font-size: 18px; font-weight: 500; width: 166px; height: 60px; line-height: 60px; 
	border: 1px solid #FF6F00; background-color:#FF8800; color: #fff; border-radius: 5px;} /*48px 풀 둥근모서리*/

/*****3단계*****/
.tabTitle.first{margin-top: 10px;}
.joinBox3{border: 1px solid #ddd; padding: 40px 30px; font-size: 16px; border-radius: 5px; margin-bottom: 0;}
.boardjoin input[type=text], .boardjoin input[type=password]{width:480px; margin-right: 10px;} 
.boardjoin a{vertical-align: middle; margin-right: 10px;}

.boardjoin.con2 select{width: 100px; background: url(../images/select_arrow.png) no-repeat 90% 50%; margin-right: 6px;}
.boardjoin.con2 td.nice{padding: 10px 15px; position: relative;}
.boardjoin.con2 td.nice p{padding-top: 10px;}
.boardjoin.con2 .poptxt{font-size: 15px; color: #0097FC; text-decoration: underline;}
.boardjoin.con2 .nicepop{display: none; position: absolute; background-color: #0097FC; border-radius: 5px; padding: 15px; top:48px; right:60px; color: #fff; font-size: 15px;}
.boardjoin.con2 input[type="text"].num{width:100px; margin-right: 6px;}
.boardjoin.con2 input[type="text"].email{width:280px; margin-right: 6px;}
.boardjoin.con2 select.email{width: 220px; background: url(../images/select_arrow.png) no-repeat 94% 50%;}
.boardjoin.con2 ul{display: inline-block; position: relative; top:-3px; padding-left: 20px;}
.boardjoin.con2 ul li{display: inline-block; margin: 0 8px;}

.boardjoin.con3 select{width: 340px; background: url(../images/select_arrow.png) no-repeat 96% 50%; margin-right: 6px;}
.boardjoin.con3 select#grade{width:144px; background: url(../images/select_arrow.png) no-repeat 90% 50%; }
.boardjoin.con3 input[type="text"]{width: 340px;}


/**********회원정보 수정**********/
/*****비번확인*****/
.lineBox.edit p{padding-bottom: 20px;}
.lineBox.edit a{vertical-align: middle; margin-left: 8px;}

/****회원정보수정 페이지****/
.cancelWrap{color: #999; font-size: 15px; margin-top: 10px; display: inline-block;}
.cancel{color:#0097FC; text-decoration: underline; font-weight: 500;}
/*나이스 개인번호 중복 팝업창*/
.popWin.none{display: none;}
.popWin{position: absolute; top:0; right: 0; width: 560px; height: 378px; border: 10px solid #0097FC; background-color: #fff;}
.popWinTop{padding: 30px 40px; font-size: 16px; text-align: center;}
.popWinTop div.title{font-size: 20px; font-weight: 500; padding-bottom: 10px; border-bottom: 1px dashed #707070; color:#184570; margin-bottom: 14px;}
.popWinTop input[type=text]{width: 370px; height: 46px;}
.popWinTop a{vertical-align: middle; margin-left: 8px; height: 46px; line-height: 46px;}
.popWinTop p{margin-top: 20px;}
.popWinTop .btn48_full{margin-top: 10px;}
.popWinBtm{position: absolute; bottom: 0; background-color: #F3F3F3; padding: 20px; font-size: 16px; width: 520px;}
.popWinBtm span{color: #184570; font-weight: 700;}
/*학교찾기 팝업창*/
.popWinTop.serch input[type=text]{display: inline-block; height: 46px; width: 300px; margin-left: 10px;}
.popWinTop.serch div.flex{display: flex; align-items: center; justify-content: center;}
.popWinTop.serch a{display: inline-block; margin-left: 0; width: 48px; height: 48px;}
.popWinTop.serch table{margin-top: 20px;}
.popWinTop.serch th{font-size: 15px; font-weight: 500; background-color: #F3F3F3; border-top:1px solid #ddd; border-bottom: 1px solid #ddd; height: 42px;}
.popWinTop.serch td{font-size: 14px; height: 20px; border-bottom: 1px solid #ddd; padding: 10px;}
.popWinTop.serch td.alignLeft{text-align: left;}

/****회원탈퇴****/
.noteWrap2{background-color: #F3F3F3; padding: 24px; font-size: 16px; margin-top: 16px;}
.noteWrap2 p{text-indent: 1em;}
.btnWrap label{font-size: 16px;}

/****연수안내****/
.courseWrap div{position: relative;}
.courseWrap .courseTitle{font-size: 20px; font-weight: 500; color: #0097FC; margin-bottom: 10px;}
.courseWrap .lineBox{background-color: #F9F9F9; border: 1px solid #ddd; padding: 40px 30px; margin: 0 auto; text-align: left; font-size: 16px; border-radius: 5px;}
.courseWrap .lineBox.txt{padding: 20px 30px; }
.courseWrap .coursetxt{font-size: 18px; font-weight: 500; margin-bottom: 10px;}
.courseWrap img{margin-bottom: 40px;}
.courseWrap img:last-child{margin-bottom: 0;}
.courseWrap .btn_exl{position: absolute; top:106px; left:50%; transform: translateX(-50%);}
.courseWrap .btn_email{position: absolute; top:196px; left:50%; transform: translateX(-50%);}
.courseWrap a{color:#0097FC; text-decoration: underline; font-size: 16px;}
/****단체수강신청 절차 안내****/
.stepinfo2{border: 1px solid #ddd; padding: 30px 0; display: flex; align-items: center; border-radius: 10px;}
.stepinfo2 .infoWrap{text-align: center; flex:1; padding: 0 24px; position: relative; font-size: 16px; line-height: 22px;}
.stepinfo2 .infoWrap::after{content: "\e93e"; position: absolute; left:-20px; top:50%; transform: translateY(-50%); font-family: 'xeicon'; font-size:30px; color: #ddd; font-weight: 700;}
.stepinfo2 .infoWrap p:nth-child(2){padding: 10px 0 0 0;}
.stepinfo2 .infoWrap .title{font-size: 17px; font-weight: 500; color:#0097FC; border-bottom: 1px solid #0097FC; text-align: left; display: flex; align-items: center; padding-bottom: 4px; justify-content: center;}
.stepinfo2 .infoWrap .titleNum{font-size: 40px; top:8px; left:40px; font-family: 'Open Sans', sans-serif; letter-spacing: -2px; padding-right: 6px;}

/**********저작권 관련 서비스 및 이메일무단수집거부***********/
.copyrightTitle{font-size: 18px; font-weight: 500; margin-bottom: 8px;}
.lineboxWrap{font-size: 16px; background-color: #F9F9F9; border:1px solid #ddd; padding: 20px 30px; border-radius: 10px;}
.copyConWrap{margin-bottom: 30px;}
.copyConWrap p:nth-child(2){margin-left: 30px; font-size: 16px;}
.NumIco{font-size: 16px; font-family: 'Roboto', sans-serif; color: #fff; background-color: #0097FC; 
	display: inline-block; width: 26px; height: 26px; border-radius: 50%; text-align: center; line-height: 26px; margin-right: 6px;}
.copyConWrap img{margin-top: 20px;}

.noEmail .ConWrap{margin-bottom: 30px;}
.noEmail p{font-size: 16px;}
.noEmail .title1{font-size: 18px; font-weight: 500; text-align: center; color:#0097FC; margin-bottom: 10px;}
.noEmail .title2{font-size: 18px; font-weight: 500; color:#184570; margin-bottom: 10px;}
.noEmail .lineboxWrap p{position: relative; margin-bottom: 16px;}
.noEmail .lineboxWrap p:last-child{margin-bottom:0;}
.noEmail .lineboxWrap p::before{content: '\00b7';  position: absolute; left:-10px; top:-4px; font-size: 20px; font-weight: 500;}

.noEmail .ConWrap p {display: flex}
.noEmail .ConWrap span{margin-bottom: 0; padding-bottom: 0;}
.noEmail .ConWrap p span:first-child{margin-right: 8px;}
.noEmail .ConWrap .txtbox{padding: 10px 0 30px 20px;}

/**********연수원 소개**********/
/****인사말****/
.introduct_top{display: flex; align-items: center;}
.introduct_top img{margin-right: 30px;}
.introduct_top span{font-size: 32px; letter-spacing: -2px;}
.introduct_top span .accent{font-weight: 500; color:#184570}
.lineDot{height: 1px; width: 100%; border-top: 2px dotted #ddd; margin:30px 0 20px 0;}
.introductWrap p{font-size: 16px;}
.introductWrap .signWrap{text-align: right;}
.introductWrap .signWrap img{margin-left: 20px;}
.introductWrap .noteWrap{margin-bottom: 30px; line-height: 28px;}
/****지원센터 소개****/
.introductTitle{font-size: 20px; font-weight: 500; color:#184570; line-height: 40px;}
.introductTitle ~ p{margin-left: 10px;}
.conterImg{text-align: center; }
.rdboxTitle{font-size: 22px; font-weight: 500; color:#fff; width: 388px; height: 60px; line-height: 60px; background-color: #262E41; border-radius: 50px; margin: 0 auto; margin-bottom: 30px; margin-top: 30px;}
/****비전 및 목적****/
.listconWrap{display: flex; justify-content: center; align-items: center;}
.listWrap{position: relative; width: 200px; height: 200px; border-radius: 50%; border: 10px solid; text-align: center; 
	margin:20px; line-height: 200px; font-family: 'Roboto Condensed', sans-serif; font-size: 26px; font-weight: 400;}
.listWrap::after{content: ""; position: absolute; width: 260px; height: 260px; border: 1px solid; border-radius: 50%; top:-15%; left:-15%;}
.listWrap.li1{color: #0097FC; border-color: #0097FC;}
.listWrap.li2{color: #0ED7D9; border-color:#0ED7D9;}
.listWrap2{display: flex; justify-content: center; align-items: center; position: relative; width: 260px; height: 260px; border-radius: 50%; background-color: #262E41; color:#fff; 
	margin:46px; text-align: center; font-size: 20px; font-weight: 500; }
.listWrap2::after{content: ""; position: absolute; width: 312px; height: 312px; border: 20px solid #EDEDED; border-radius: 50%; top:-18%; left:-18%;}
.listconWrap .lineDot{width: 118px; position: relative; z-index: 10;}
.listconWrap .lineDot.li1::before{content: ""; position: absolute; width: 8px; height: 8px; border: 1px solid #0097FC; top:-6px; left:110px; border-radius: 50%; background-color: #fff;} 
.listconWrap .lineDot.li2::before{content: ""; position: absolute; width: 8px; height: 8px; border: 1px solid #0ED7D9; top:-6px; left:-8px; border-radius: 50%; background-color: #fff;} 
.listconWrap_btm{display: flex; justify-content: space-between; align-items: center; margin-top: 40px;}
.listconWrap_btm li{background-color: #F3F3F3; padding:24px; width: 166px; height: 190px; text-align: center; border-radius: 10px;}
.listconWrap_btm li p{font-size: 18px; letter-spacing: -1.5px;}
.listNum{font-family: 'Roboto', sans-serif; font-size: 60px; color: #999; font-weight: 300; letter-spacing: -3px;}
.line4px{width: 20px; height: 4px; background-color: #999; margin: 0 auto; margin-top: 4px; margin-bottom: 16px;} 
/****지원센터 특징****/
.introductWrap.charc{display: flex; align-self: start;}
.introductWrap.charc p{position: relative;}
.introductWrap.charc p::before{content: "."; position: absolute; top:-4px; left:-10px; font-weight: 700;}
.introductWrap.charc div{margin-right: 80px;}
.introductWrap.charc img{margin:0 20px;}



/************버튼, 아이콘 스타일************/
.ico16{display: inline-block; width:16px; height: 16px; background: url(../images/Icon.png);} /*16px 이미지 아이콘*/
.ico_download{background-position: 0 -302px; margin-right: 6px; margin-bottom: -2px;}
.ico_print{background-position: -22px -302px; margin-right: 6px; margin-bottom: -2px;}
/*연수교재 내려받기*/
.ico_bookDown{background-position: -50px -302px; vertical-align: middle; margin-right: 8px; margin-bottom: 4px;}
.btn_bookDown{margin-bottom: 10px; float: right;}
/*파일찾기*/
.ico_serch{background-position: -100px -300px; vertical-align: middle; margin-right: 8px; margin-bottom: 2px;}
/*과제 제출하기*/
.btn_sumit{margin: 10px 0 16px 0;}
.ico_sumit{background-position: -128px -302px; vertical-align: middle; margin-right: 8px; margin-bottom: 2px;}


.ico32{display: block; width:32px; height: 32px; background: url(../images/Icon.png);  margin: 0 auto;} /*32px 이미지 아이콘*/
.ico_lect{background-position: 0 -260px;}
.ico_relect{background-position: -84px -260px;}
.ico_result{background-position: -42px -260px;}
.ico_play{background-position: -126px -260px;}
.ico_play2{background-position: -252px -260px;}/*학습하기아이콘 회색(학습완료)*/
.ico_detail{background-position: -168px -260px;}
.ico_attach{background-position: -210px -260px;}

.ico_exl{display: inline-block; width:24px; height: 24px; background: url(../images/Icon.png); vertical-align: middle; margin-right: 4px; background-position: -36px -330px;}
.ico_email{display: inline-block; width:24px; height: 24px; background: url(../images/Icon.png); vertical-align: middle; margin-right: 4px; background-position: -96px -330px;}

.btn40.gray{border: 1px solid #999999; color: #999999;}
.btn40{display: inline-block;  padding: 0 16px; font-size: 16px; font-weight: 500; height: 38px; line-height: 38px; border: 1px solid #0097FC; color: #0097FC; } /*40px 텍스트 버튼*/
.btn48_out{display: inline-block; padding: 0px 22px; font-size: 16px; font-weight: 500; height: 46px; line-height: 46px; border: 1px solid #0097FC; color: #0097FC; } /*48px 텍스트 라인버튼 아이콘있음*/
.btn48_full{display: inline-block; padding: 0 22px; font-size: 16px; font-weight: 500; height: 48px; line-height: 48px; background-color: #0097FC; color: #fff; } /*48px 텍스트 풀버튼 아이콘있음*/
.btnBig_out{display: inline-block; padding: 0 22px; font-size: 16px; font-weight: 500; height: 44px; line-height: 44px; border: 2px solid #0097FC; color: #0097FC; border-radius: 5px; } /*48px 라인 둥근모서리*/
.btnBig_full{display: inline-block; padding: 0 22px; font-size: 16px; font-weight: 500; height: 48px; line-height: 48px; background-color: #0097FC; color: #fff; border-radius: 5px;} /*48px 풀 둥근모서리*/
.btnBig_gray{display: inline-block; padding: 0 22px; font-size: 16px; font-weight: 500; height: 48px; line-height: 48px; background-color: #999999; color: #fff; border-radius: 5px;} 

/*설문 참여완료*/
.btn_done{border: 1px solid #999999; color: #999;}

/*느낌표 아이콘*/
.ico_alert{position: relative; display: inline-block; vertical-align: middle; margin-right: 16px; width: 60px; height: 60px; background-color:#184570; border-radius: 100px;}
.ico_alert::before{content: "!"; position: absolute; font-size: 24px; color: #fff; top:50%; left:50%; transform: translate(-50%, -50%);}
/*이수완료 아이콘*/
.ico_done{position: relative; display: inline-block; vertical-align: middle; margin-right: 16px; width: 60px; height: 60px; background-color:#FFA200; border-radius: 100px;}
.ico_done::before{content: "\eb64"; position: absolute; font-family: 'xeicon'; font-size: 28px; color: #fff; top:50%; left:50%; transform: translate(-50%, -50%);}

/*글쓰기*/
.btn_write{position: absolute; top:50%; right: 0; transform: translateY(-50%)}
.xi-border-color{margin-right: 8px;}
/*xeicon 정렬*/
.xei_align{font-size: 20px; vertical-align: middle; margin-right: 4px;}

/*폰트스타일*/
.red{color: #DE2C00;}
.blue{color:#0097FC;}
.darkBlue{color: #184570;}
.gray{color:#999;}
.b{font-weight: 500;}
.underLine{text-decoration: underline;}
.txtindent{text-indent: 1em;}


/*버튼 정렬 오른쪽정렬&위로 10px 띄움*/
.btnWrap{float: right; margin-top: 10px;}
.btnWrap a{margin-right: 8px;}
.btnWrap a:last-child{margin-right: 0;}
.mt20{margin-top: 20px;}
.mt40{margin-top: 40px;}
.mt50{margin-top: 50px;}
.mt60{margin-top: 60px;}
.mb40{margin-bottom: 40px;}
.h10{height: 10px;}

/*******************************************************************서브페이지 CSS 끝********************************************************************/

/************quickMenu************/
.quickMenu{position: absolute; top:0; right: -160px; width: 120px; height: 600px;}
.quickMenu > div{position: relative; width: 80px; height: 80px; padding: 20px; color: #fff; font-size: 14px; text-align: center;}
.quickMenu > div::before{content:"\e9c5"; position: absolute; font-family: 'xeicon'; font-size: 16px; right: 20px;}
.quickMenu div .ico{width: 40px; height: 40px; background: url(../images/Icon.png) no-repeat;  margin: 0 auto; margin-top: 10px; margin-bottom: 14px;}
.quickMenu div.menu1{background-color: #124574;}
.quickMenu div.menu1 .ico{background-position: 0 -370px;}
.quickMenu div.menu2{background-color: #145DA0;}
.quickMenu div.menu2 .ico{background-position: -40px -370px;}
.quickMenu div.menu3{background-color: #0097FC;}
.quickMenu div.menu3 .ico{background-position: -80px -370px;}
.quickMenu div.menu4{background-color: #00B7FC;}
.quickMenu div.menu4 .ico{background-position: -120px -370px;}
.quickMenu div.menu5{background-color: #0ED7D9;}
.quickMenu div.menu5 .ico{background-position: -160px -370px;}

@media (min-width:0px) and (max-width:1518px){
    .quickMenu{display: none;}
}

/************footer************/
#infoBox{padding: 36px 0; background-color: #262E41;}
#infoBox .container .biglogo_col{display:inline-block; width:122px; height: 90px; margin-right: 32px;  background: url(../images/Icon.png); background-position: 0 -158px;}
#infoBox .container div{display:inline-block;}
#infoBox .container div ul li{position: relative; float: left; margin-right:48px; margin-bottom: 16px;}
#infoBox .container div ul li a{font-size: 14px; font-weight:500;  color:rgba(255, 255, 255, 0.8); letter-spacing: 0;}
#infoBox .container div ul .bold a{color: #0ED7D9;}
#infoBox .container div ul li::after{content: ""; position: absolute; display: inline-block; width:2px; height: 2px; background-color:#fff; top:10px; right: -24px;}
#infoBox .container div ul li:last-child::after{display: none;}
#infoBox .container div p{clear: both; color:rgba(255, 255, 255, 0.5); letter-spacing: 0; font-weight:300;}
#infoBox .container div p span{display: inline-block; margin-right: 24px;}