/*============================================================*/
/*======================= Tablet 1024 px ~ =======================*/
/*============================================================*/
@media only screen and (max-width:1280px){
.pc {display:none !important;}
.tablet {display:block !important;}
.mobile {display:none !important;}
.tabmo {display:block !important;}
img {max-width:100%;}
img.pc_img {display:none;}
img.tablet_img {display:block;}
img.tabmo_img {display:block;}

/* header */
#header {height:90px;}
.headerWrap h1 {width:180px; top:23px; left: 4%;}

#topmenu {display:none;}
.top_util {display:none;}

/* allmenu */
.btn_menu {display:block; position:absolute; top:50%; right:4%; width:35px; transform:translateY(-50%); cursor: pointer; z-index:600;}
.bar1, 
.bar2, 
.bar3 {float:right; width:32px; height: 3px; background-color: #fff; margin-top:9px; transition: 0.4s;}
.bar1 {margin-top:0;}
.bar2 {width:25px;}
.change .bar1 {-webkit-transform: rotate(-45deg) translate(-9px, 8px) ; transform: rotate(-45deg) translate(-9px, 8px) ; background-color:#fff;} /* Rotate first bar */
.change .bar2 {opacity: 0;} /* Fade out the second bar */
.change .bar3 {-webkit-transform: rotate(45deg) translate(-8px, -8px) ; transform: rotate(45deg) translate(-8px, -8px) ; background-color:#fff;} /* Rotate last bar */

.main .bar1, 
.main .bar2, 
.main .bar3 {background:#fff;}
#header.bg .bar1,
#header.bg .bar2,
#header.bg .bar3 {background:#fff;}

#AllMenu {display:none; position:absolute; top:90px; left:0; width:100%; padding:2% 4% 0; background:#003876; font-size:25px; font-weight:500; text-align:center; box-sizing:border-box;}
#AllMenu ul li {padding:15px 0; line-height:45px;  box-sizing:border-box;}
/* #AllMenu ul li a {position:relative; display:inline-block; color:#fff; overflow:hidden; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); vertical-align:top;}
#AllMenu ul li a:before {content: ""; position: absolute; z-index: -1; left: 51%; right: 51%; bottom: 0; background: #fff; height: 2px; -webkit-transition-property: left, right;  transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out;}
#AllMenu ul li a:hover:before, #AllMenu ul li a:focus:before, #AllMenu ul li a:active:before, #AllMenu ul li.on a:before {left: 0; right: 0;} */
#AllMenu .btn_login {display:block;/*  width:200px; */ height:65px; margin:20px auto 0; background:#fff; color:#003876; text-align:center; border-radius:5px; line-height:63px;}

#AllMenu ul.m_menu li a  {position:relative; display:block; color:#fff; overflow:hidden; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0);}
#AllMenu ul.m_menu li a:before {content: ""; position: absolute; z-index: -1; left: 50%; top: -40px; background: #fff; height: 7px; width: 7px; border-radius: 50%; -webkit-transition-property: top;  transition-property: top; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; opacity:0;}
#AllMenu ul.m_menu li a:hover:before, #AllMenu ul li a:focus:before, #AllMenu ul li a:active:before, #AllMenu ul li.on a:before { top: 0; opacity:1;}


#AllMenu ul.m_menu_link {padding:25px 0;}
#AllMenu ul.m_menu_link li a {color:#fffdc3;}
#AllMenu ul.m_menu_link li a i {display: inline-block; width: 19px; height: 19px; background: url("/images/common/icon/m_menu_icon.png") no-repeat center center; margin-left:10px;}
#AllMenu ul.m_menu_link li a:hover, #AllMenu ul.m_menu_link li a:focus, #AllMenu ul.m_menu_link li a:active, #AllMenu ul.m_menu_link li a:on {border-bottom:1px solid #fffdc3;}

}
/*main contents */
#mainVisual {padding:10% 0 20%; box-sizing:border-box;}
#mainVisual .main_txt {width:550px;}
#mainVisual .main_info_title { margin:0 auto; /* text-align:center; */}
/* #mainVisual .main_info_title p:before {left:50%; transform: translateX(-50%);} */
#mainVisual .main_info_txt dl {margin:40px 0 50px;}
#mainVisual .main_info_txt dl dt {display:block; margin:0 auto; /* text-align:center; */}
#mainVisual .main_info_txt dl dd {display:block; padding-top:15px; padding-left:0; font-size:16px; /* text-align:center; */}
/* #mainVisual .main_quick_link ul {overflow:hidden;} */
#mainVisual .main_quick_link ul li a {padding:30px 35px;}
#mainVisual .main_quick_link ul li strong {padding-left:40px; background-size:28px !important; font-size:28px; line-height:34px;}
#mainVisual .main_quick_link ul li p {font-size:16px;}
#mainVisual .main_quick_link ul li .arrow {bottom:30px; right:35px; width:50px; height:28px;}





.main_banner {padding:30px 10px 0;}
.main_banner strong {font-size:22px;}

/* SelectBoxStyle */
.SelectType01 {min-width:150px; height:40px; padding: 0 30px 0 5px; line-height:40px;}

/*sub contents*/
.sub #contents {padding:75px 4%;}
.sub #contents .titleArea {margin-bottom:45px;}
.sub #contents .titleArea h3 {font-size:32px;}
.sub #contents .titleArea02 h4 {font-size:18px;}
.sub #contents .titleArea02 h4 span {font-size:17px;}
.sub #contents .titleArea02 p {padding-top:5px;}
.contentsArea .section {margin-top:30px;}

.caution p {width:calc(100% - 120px); padding-top:0;}

/* ApplyStep */
.apply_step {margin-bottom:65px;}
.apply_step:after {top:10px;}
.apply_step ul li {padding-top:28px;}
.apply_step ul li:before {width:20px; height:20px;}

/* MypageStep */
.mypage_step {margin-bottom:65px;}

/* 온라인 CV 작성 */
.suformBox {padding:18px;}
.suformBox02 textarea {height:220px;}
.inputBox {font-size:15px;}
.inputBox .labelBox label {margin-right:15px;}
.inputBoxWrap.list3_2 .inputBox {width:32%;}
.inputBoxWrap.list3_2 .inputBox.peroid {display:block; width:100%; margin-left:0;}
.inputBoxWrap.list3_2 .inputBox.peroid + .inputBox {margin-left:0;}
.inputBoxWrap.list4 .inputBox {width:49%;}
.inputBoxWrap.list4 .inputBox:nth-child(2n-1) {margin-left:0;}
.inputBox.peroid .peroidArea select {font-size:15px;}
.inputBox.peroid .peroidArea select.year {width:80px; min-width:80px;}
.inputBox.peroid .peroidArea select.num {width:70px; min-width:70px;}
.inputBox.peroid .peroidArea span {font-size:15px;}
.inputBox .labelBox.lh {line-height:40px;}
.suformBox > textarea {min-height:120px;}

.addBoxWrap .addBox .input_con {width:calc(100% - 45px);}
.addBoxWrap .addBox > .btn_add,
.addBoxWrap .addBox > .btn_delete {width:40px; height:40px;}

/* 나의 작성내역 */
.suviewBox dl dt {width:120px; padding:3px 18px;}
.suviewBox dl dd {width:calc(100% - 120px); padding:3px 18px;} 
.suviewBox dl:first-child dt,
.suviewBox dl:first-child dd {padding-top:13px;}
.suviewBox dl:last-child dt,
.suviewBox dl:last-child dd {padding-bottom:13px;}
.suviewBox.wide dl dt {width:140px;}
.suviewBox.wide dl dd {width:calc(100% - 140px);}
.suviewBox .su_txt {padding:13px 18px;}
.suview_nodata {line-height:100px;}

.suviewBox02 dl dt {width:120px; padding:12px 18px;}
.suviewBox02 dl dt.vaM {vertical-align:top;}
.suviewBox02 dl dd {width:calc(100% - 120px); padding:12px 18px;} 

.suviewBox03 .su_txt {max-height:350px; padding:13px 18px;}

.sufileBox {padding:13px 18px; margin-bottom:10px; background:#f7f7f7; border:1px solid #ccc; border-radius:5px; color:#222; overflow:hidden;}
.sufileBox .fileArea {padding-bottom:13px;}
.sufileBox .fileArea .file_name {width:calc(100% - 56px); padding-right:18px; font-size:15px;}
.sufileBox .fileArea .btn_file_view {width:56px; height:22px; font-size:11px; line-height:20px;}
.sufileBox .fileInfo {padding-top:13px;}

.applyComplete {padding:65px 0;}
.applyComplete img {width:60px;}
.applyComplete strong {padding-top:35px; font-size:19px;}
.applyComplete p {padding-top:10px;}

/* 로그인 */
#MemBody.login {width:350px; padding:20px 0;}
#MemBody.login .login_title img {width:60px;}
#MemBody.login .login_title p {padding-top:30px;}
#MemBody .mem_table td {padding-top:8px;}
#MemBody .mem_table td input.text {height:50px;}
#MemBody .mem_table td .button {height:65px; font-size:22px; line-height:65px;}

/* 아이디/비밀번호 찾기 */
#findIdpw .find {height:430px; padding:40px 5%;}
#findIdpw .find h4 {padding-bottom:12px; font-size:19px;}
#findIdpw .find .writeBtnArea {margin-top:25px;}

#findIdpw.idpw_result .find {padding:65px 6%;}

/* 개인정보처리방침, 이용약관 */
/* .AgreePrivacy .privBox {float:left; width:49%; margin-left:2%;} */
.AgreePrivacy .privBox strong {font-size:19px;}
.AgreePrivacy .privBox textarea {padding:15px;}

.privacy .privacyCon {height:500px; line-height:22px;}
.privacy .priv_section strong {font-size:17px;}

/* footer */
#foot {font-size:13px;}
.footWrap {padding:35px 4%;}
.footWrap .f_util a {font-size:13px;}
.footWrap .copy {font-size:12px;}

/* 관리자 로그인 */
div#box {margin-top:-143px;}
div#p_input span.label {padding-right:15px;}

}



/*===============================================================*/
/*======================= Tablet 850 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:850px){

/* 아이디/비밀번호 찾기 */
#findIdpw .find {height:452px;}

}

/*===============================================================*/
/*======================= Tablet 768 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:768px){

/*main contents */

#mainVisual .main_txt {width:450px;}
#mainVisual .main_quick_link ul li a {padding:28px 30px;}
#mainVisual .main_quick_link ul li strong {padding-left:38px; background-size:26px !important; font-size:26px; line-height:32px;}
#mainVisual .main_quick_link ul li .arrow {right:30px; width:48px; height:26px;}
.main_banner strong {font-size:20px;}

/* 아이디/비밀번호 찾기 */
#findIdpw .find {float:none !important; width:100%; height:auto; margin-top:4%;}
#findIdpw .find:first-child {margin-top:0;}
#findIdpw .find h4 {font-size:18px;}

}


/*===============================================================*/
/*======================= Tablet 640 px ~ =======================*/
/*===============================================================*/
@media only screen and (max-width:640px){

.pct2 {display:none !important;}
.tabmo2 {display:block !important;}

#mainVisual:after {background:url('/images/main/main_bg_m.png') no-repeat top center; background-size: cover; content:''; position:absolute; left: 50%; top:-130px; transform: translateX(-50%); width: 100%; height:100%; z-index:0;} 



/* MypageStep */
.frame.crazy {overflow: visible !important;}
.frame.crazy ul {position:relative; width: 800px !important; height: 100%; z-index:10;}
.mypage_step .frame.crazy ul {background:#fff;}


/* 온라인 CV 작성 */
.inputBoxWrap.list3 .inputBox {width:49%;}
.inputBoxWrap.list3 .inputBox.col2 {width:100%; margin-left:0;}
.inputBoxWrap.list3 .inputBox.col2 .blank {display:none;}
.inputBoxWrap.list3_2 .inputBox {width:49%;}
.inputBoxWrap.list4 .inputBox {float:none; width:100%; margin-left:0;}
.inputBox .labelBox.lh {margin-bottom:5px; line-height:1;}

/* 개인정보처리방침, 이용약관 */
/* .AgreePrivacy .privBox {float:none; width:100%; margin-left:0; margin-top:20px;}
.AgreePrivacy .privBox:first-child {margin-top:0;} */
.AgreePrivacy .privBox textarea {height:180px;}
}