@charset "UTF-8";
@font-face {
font-family: 'Pretendard-Regular';
src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
font-weight: 400;
font-style: normal;
}
/*기본세팅*/
html{ }
.size { width: 100%; max-width: 1080px; height: auto; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.clear:after { clear: both; content: ''; display: block; }
.tb { display: table; width: 100%; height: 100%; }
.tbc { display: table-cell; width: 100%; height: 100%; vertical-align: middle; }
.img img { max-width: 100%; display:inline;object-fit: cover;}
.pic { background-size: contain; background-repeat: no-repeat; background-position: center center; }
.pic img { max-width: 100%; opacity: 0; visibility: hidden; }
em.mbr { display: block; }
.swiper-wrapper { display: -webkit-box; }
.mt20{margin-top:20px;}
.bg_con{background:#f7f7f8}
.sub_visual {  width: 100%;  height: 32rem;  margin-top: 4.375rem;  background: url('/assets/images/recruit/recruit_visual.jpg') ;background-repeat:no-repeat;  background-size: cover;  background-position: center center;position:relative}
.sub_visual:before{content: "";display: block;position: absolute;top: 0px;left: 0px;width: 100%;height: 100%;background: rgba(23, 23, 25, 0.52);}
.sub_visual h1 {  color: #fff;  font-size: 3.43rem;line-height:1.2;  font-weight:700;letter-spacing:-0.03em; text-align: center;  vertical-align: middle;position:relative}

#recruit_idx .w_wrap *{font-family: 'Pretendard-Regular',"noto_R";}
#recruit_idx {color:#171717}
#recruit_idx .w_wrap .conts{padding:120px 0;}
#recruit_idx .w_wrap .conts2{padding:160px 0}
#recruit_idx .w_wrap .conts .b_txt p,#recruit_idx .w_wrap .conts2 .b_txt p{font-size: 28px;line-height: 1.5;   letter-spacing: -0.02em;font-weight: 700;}
#recruit_idx .w_wrap .conts .b_txt span,#recruit_idx .w_wrap .conts2 .b_txt span{color:#8a8a8a;font-size: 16px;line-height: 26px;letter-spacing: -0.0056em;}
#recruit_idx .con1{font-size:0}
#recruit_idx .con1 .img{display:inline-block;vertical-align:middle;width:50%;border-radius: 8px;overflow:hidden}
#recruit_idx .con1 .txt{display:inline-block;vertical-align:middle;width:50%;padding:0 50px;box-sizing:border-box;}
#recruit_idx .con1 .txt b{font-size: 28px; line-height: 38px;letter-spacing: -0.02em; font-weight: 700;display:block}
#recruit_idx .con1 .txt p{margin-top:15px;font-size: 17px;line-height: 1.4;letter-spacing: -0.05em;font-weight: 500;color:#8a8a8a;word-break:keep-all}
#recruit_idx .con2{font-size:0}
#recruit_idx .con2 .txt{width:300px;display:inline-block;vertical-align:top}
#recruit_idx .con2 .list{display:inline-block;vertical-align:top;width:calc(100% - 360px);margin-left:60px}
#recruit_idx .con2 ul{width:103%; margin-left:-3%;margin-top:-3%}
#recruit_idx .con2 ul li{padding: 24px;border-radius: 8px;background-color: #fff;text-align: center;width:47%; margin-left:3%; margin-top:3%;display:inline-block;vertical-align:middle;}
#recruit_idx .con2 ul li p{color:#3366ff;font-size: 40px;line-height: 1.1;letter-spacing: -0.02em;font-weight: 700;}
#recruit_idx .con2 ul li span{display:block;color: #8a8a8a;font-size: 22px;line-height: 1.3;margin-top:10px;letter-spacing: -0.01em;font-weight: 500;}
#recruit_idx .con3 .txt{text-align:center}
#recruit_idx .con3 .txt b{font-size:28px; color:#171717;line-height:1;letter-spacing:-0.02;font-weight:600}
#recruit_idx .con3 .txt p{font-size:16px; line-height:1.3; color:#8a8a8a;margin-top:20px}
#recruit_idx .con3 .img_wrap{margin-top:40px;text-align:center; font-size:0}
#recruit_idx .con3 .img_wrap .pc{}
#recruit_idx .con3 .img_wrap .mo{display:none}
#recruit_idx .con4 {}
#recruit_idx .con4 .img{display:block; margin:0 auto; border-radius:50%; max-width:200px; overflow:hidden}
#recruit_idx .con4 .txt{text-align:center;margin-top:30px}
#recruit_idx .con4 .txt p{color: #8a8a8a;font-size: 18px;line-height: 26px;}
#recruit_idx .con4 .txt span{display:block;color:#3366ff; margin-top:15px; font-size:16px;font-weight:600}
#recruit_idx .con4 .txt p .mbr{display:none}
#recruit_idx .con5{padding-top:0;font-size:0;}
#recruit_idx .con5 .txt{width:360px;display:inline-block;vertical-align:middle}
#recruit_idx .con5 .ytb_wrap {display:inline-block;vertical-align:middle;width:calc(100% - 360px);border-radius:10px; overflow:hidden}
#recruit_idx .con5 .ytb_wrap .ytb{ position: relative;width: 100%;height: 0;padding-bottom: 56.25%;}
#recruit_idx .con5 .ytb_wrap .ytb iframe {   position: absolute;top: 0;left: 0;width: 100%;height: 100%;border:0}
#recruit_idx .con6 .txt{text-align:center}
#recruit_idx .con6 .list{margin-top:40px}
#recruit_idx .con6 .list ul{width:102%; margin-left:-2%; margin-top:-4%}
#recruit_idx .con6 .list ul li{width:48%;margin-left:2%; margin-top:4%;float:left}
#recruit_idx .con6 .list ul li .img{overflow:hidden; border-radius:10px;font-size:0}
#recruit_idx .con6 .list ul li .txt{text-align:center;margin-top:20px}
#recruit_idx .con6 .list ul li .txt p{font-size:22px;line-height:1;}
#recruit_idx .con6 .list ul li .txt > div{margin-top:20px}
#recruit_idx .con6 .list ul li .txt > div b{display:block;font-weight:500;margin-top:10px}
#recruit_idx .con6 .list ul li .txt > div b:first-child{margin-top:0}
#recruit_idx .con6 .list ul li .txt > div b span{display:inline-block;font-size:18px;line-height:1.2;position:Relative;padding-left: 12px;}
#recruit_idx .con6 .list ul li .txt > div b span::before{content: "";width: 4px;height: 4px;border-radius: 4px;position: absolute;top: 8px;left: 0px;background-color:#8a8a8a}
#recruit_idx .con7 .txt{text-align:center}
#recruit_idx .con7 .txt .mbr{display:none}
#recruit_idx .con7 .ul_list{padding-top:40px;text-align:center}
#recruit_idx .con7 .ul_list ul {margin-left:-30px;display:inline-block;margin-top:-30px;}
#recruit_idx .con7 .ul_list ul li{display:table;width:200px; height:200px;float:left;margin-left:30px;margin-top:30px;border:2px solid #3366ff;border-radius:50%;box-sizing:border-box;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con7 .ul_list ul li a{display:table-cell;vertical-align:middle;width:100%; height:100%;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con7 .ul_list ul li a b{display:inline-block; padding:15px 10px; line-height:1; color:#fff; font-size:20px;background:#3366ff;font-weight:400;margin-top:10px;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con7 .ul_list ul li a span{font-size:17px; color:#3366ff; display:block; margin-top:5px;}
#recruit_idx .con7 .ul_list ul li:hover{background:#3366ff}
#recruit_idx .con7 .ul_list ul li:hover a b{color:#3366ff; background:#fff}
#recruit_idx .con7 .ul_list ul li:hover a span{color:#fff}
/*#recruit_idx .con7 .ul_list ul li.dev a b::before{position:absolute; width:100%;color:#fff; top:15px; font-size:14px; content:'개발자';text-align:center;left:0;opacity:0}

#recruit_idx .con7 .ul_list ul li.df{border-color:#567def}
#recruit_idx .con7 .ul_list ul li.df a b{background:#567def;}
#recruit_idx .con7 .ul_list ul li.df a span{color:#567def}
#recruit_idx .con7 .ul_list ul li.df:hover{background:#567def}
#recruit_idx .con7 .ul_list ul li.df:hover a b{background:#567def;color:#fff}
#recruit_idx .con7 .ul_list ul li.df:hover a span{color:#fff}*/

#recruit_idx .con7 .rct_box{background:#fff; border-radius:8px; padding:45px; box-sizing:Border-box; margin-top:30px}
#recruit_idx .con7 .rct_box .select{position:relative}
#recruit_idx .con7 .rct_box .select select{width:100%;height: 48px;border: 1px solid #e1e2e4;background-color: #fff;border-radius: 4px;padding: 12px 16px;color: rgb(138, 138, 138);font-size: 18px;cursor: pointer;outline: none;appearance:none;}
#recruit_idx .con7 .rct_box .select select::-ms-expand { display:none; } 
#recruit_idx .con7 .rct_box .select select:not([multiple]){padding-right:; right:5px;}
#recruit_idx .con7 .rct_box .select:not(.is-multiple):not(.is-loading)::after{border: 2px solid #333; border-radius: 2px; border-right: 0; border-top: 0; content: ' '; display: block; height: 6px; margin-top: -6px; pointer-events: none; position: absolute; top: 50%; transform: rotate(-45deg); transform-origin: center; width: 6px; right:15px; z-index: 4;}
#recruit_idx .con7 .rct_box .select select option:disabled {color:#c4c4c4}
#recruit_idx .con7 .rct_box .ul_box{max-height:516px; overflow:auto;margin-top:20px}
#recruit_idx .con7 .rct_box .ul_box ul{}
#recruit_idx .con7 .rct_box .ul_box ul li{font-size:0;border-bottom:1px solid #e1e2e4}
/*#recruit_idx .con7 .rct_box .ul_box ul li:first-child{border-top:0}*/
#recruit_idx .con7 .rct_box .ul_box ul li a{display:block}
#recruit_idx .con7 .rct_box .ul_box ul li a > div{display:inline-block;vertical-align:middle}
#recruit_idx .con7 .rct_box .ul_box ul li.no_data{display:none}
#recruit_idx .con7 .rct_box .ul_box ul li.no_data .m_side{width:100%;font-size:17px}
#recruit_idx .con7 .rct_box .ul_box ul li .l_side{font-size:0;width:calc(100% - 400px);text-align:left}
#recruit_idx .con7 .rct_box .ul_box ul li .l_side p{color:#171717;font-weight:600; font-size:22px}
#recruit_idx .con7 .rct_box .ul_box ul li .l_side span{color:#3366FF; display:block;font-size:15px; margin-top:5px; line-height:1.2}
#recruit_idx .con7 .rct_box .ul_box ul li .m_side{line-height:100px;color:#8a8a8a; font-size:15px;width:200px;text-align:center;}
#recruit_idx .con8 .txt{width:300px;float:left}
#recruit_idx .con8 .faq_list{width:Calc(100% - 300px);float:left;margin-top:-24px}
#recruit_idx .con8 .faq_list ul{}
#recruit_idx .con8 .faq_list ul li{border-bottom:1px solid #e1e2e4;}
#recruit_idx .con8 .faq_list ul li a{display:block;font-size:20px;line-height:28px;font-weight:600;color:#171717;position:relative;padding:24px 0;}
#recruit_idx .con8 .faq_list ul li a::before{border: 2px solid #333; border-radius: 2px; border-right: 0; border-top: 0; content: ' '; display: block; height: 10px; margin-top: -8px; pointer-events: none; position: absolute; top: 50%; transform: rotate(-45deg); transform-origin: center; width: 10px; right:15px; z-index: 4;}
#recruit_idx .con8 .faq_list ul li .show_box{display:none;font-size:16px;padding-bottom:30px;padding-left:10px; box-sizing:border-box }
#recruit_idx .con8 .faq_list ul li .show_box p{font-size:16px; color:#8a8a8a;padding-left:12px;position:relative;margin-top:px;font-weight:300;line-height:1.4;padding-right: 10px;box-sizing: border-box;}
#recruit_idx .con8 .faq_list ul li .show_box p::before{content: "";width: 4px;height: 4px;border-radius: 4px;position: absolute;top: 8px;left: 0px;background-color:#8a8a8a}
#recruit_idx .con8 .faq_list ul li .show_box p:first-child{margin-top:0}
#recruit_idx .con8 .faq_list ul li.on a::before{transform:rotate(135deg);margin-top:-2px}
#recruit_idx .con8 .faq_list ul li.on .show_box{display:block}
#recruit_idx .con9 {background:#f3f9fd;text-align:center}
#recruit_idx .con9 ul {margin-left:-30px;display:inline-block;margin-top:-30px;padding-top:40px}
#recruit_idx .con9 ul li{display:table;width:200px; height:200px;float:left;margin-left:30px;margin-top:30px;border:2px solid #3366ff;border-radius:50%;box-sizing:border-box;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con9 ul li a{display:table-cell;vertical-align:middle;width:100%; height:100%;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con9 ul li a b{display:inline-block; padding:15px 10px; line-height:1; color:#fff; font-size:20px;background:#3366ff;font-weight:400;margin-top:10px;transition:all .3s;-webkit-transition:all .3s}
#recruit_idx .con9 ul li a span{font-size:17px; color:#3366ff; display:block; margin-top:5px;position:relative}
#recruit_idx .con9 ul li:hover{background:#3366ff}
#recruit_idx .con9 ul li:hover a b{color:#3366ff; background:#fff}
#recruit_idx .con9 ul li:hover a span{color:#fff}
@media (max-width: 1600px) {}
@media (max-width: 1300px) {}
@media (max-width: 1024px) {}
@media (max-width: 960px) {

#recruit_idx .con1 .img{width:100%;}
#recruit_idx .con1 .txt{width:100%; margin-top:30px; padding:0}
#recruit_idx .con2 .txt{width:100%; text-align:center}
#recruit_idx .con2 .list{width:100%; margin-top:30px;margin-left:0}
#recruit_idx .con7 .ul_list ul li:nth-child(3){clear:left}
#recruit_idx .con8 .txt{width:100%}
#recruit_idx .con8 .faq_list{width:100%;margin-top:0}
}
@media (max-width: 768px) {
#recruit_idx .con5 .txt{width:100%}
#recruit_idx .con5 .ytb_wrap{width:100%;margin-top:30px}
#recruit_idx .con5 .conts .b_txt p br{display:none}
#recruit_idx .con7 .rct_box .ul_box ul li a{padding:15px 0}
#recruit_idx .con7 .rct_box .ul_box ul li .l_side{width:100%;}
#recruit_idx .con7 .rct_box .ul_box ul li .m_side{line-height:1.4;display:block;width:100%;text-align:left}
}
@media (max-width: 640px) {
.sub_visual h1{font-size:3rem}
#recruit_idx .con3 .img_wrap .pc{display:none}
#recruit_idx .con3 .img_wrap .mo{display:block}
#recruit_idx .con2 ul li{width:97%}
#recruit_idx .con6 .list ul li{width:98%;margin-top:8%}
#recruit_idx .con7 .ul_list ul li{width:165px; height:165px; }
#recruit_idx .con7 .ul_list ul li a b{font-size:16px; padding:10px }
#recruit_idx .con7 .ul_list ul li a span{font-size:15px}
}

@media (max-width: 560px) {
#recruit_idx .w_wrap .conts{padding:60px 0}
#recruit_idx .w_wrap .conts2{padding:80px 0}
#recruit_idx .con1 .txt b{font-size:22px; line-height:1.4}
#recruit_idx .con1 .txt p{font-size:15px}
#recruit_idx .w_wrap .conts .b_txt p, #recruit_idx .w_wrap .conts2 .b_txt p{font-size:24px}
#recruit_idx .con2 ul li p{font-size:32px}
#recruit_idx .con2 ul li span{font-size:17px}
#recruit_idx .con4 .txt p{font-size:16px}
#recruit_idx .con6 .list ul li .txt p{font-size:20px}
#recruit_idx .con6 .list ul li .txt > div b span{font-size:16px}
#recruit_idx .con7 .txt .mbr{display:block}
#recruit_idx .con7 .rct_box .ul_box ul li .l_side p{font-size:20px}
#recruit_idx .con7 .rct_box{padding:40px 30px}
#recruit_idx .con8 .faq_list ul li a{font-size:17px;padding:15px 0;}
#recruit_idx .con8 .faq_list ul li .show_box{padding-bottom:15px}
#recruit_idx .con8 .faq_list ul li .show_box p{font-size:15px}
}
@media (max-width: 420px) {
.sub_visual h1{font-size:2.6rem}
#recruit_idx .con4 .txt p br{display:none}
#recruit_idx .con4 .txt p{font-size:15px}
#recruit_idx .con4 .txt span{font-size:14px}
#recruit_idx .con4 .txt p .mbr{display:block}
#recruit_idx .con4 .size{padding:0 10px}
#recruit_idx .con7 .ul_list ul li{width:150px;height:150px}
#recruit_idx .con7 .ul_list ul li{margin-top:20px;float:none}
}

@media (max-width: 340px) {
.sub_visual h1{font-size:2rem}
#recruit_idx .con1 .txt b{font-size:18px}
#recruit_idx .con4 .txt p{font-size:14px}
#recruit_idx .con6 .list ul li .txt p{font-size:17px}
#recruit_idx .con6 .list ul li .txt > div b{margin-top:5px}
#recruit_idx .con6 .list ul li .txt > div b span{font-size:14px}
#recruit_idx .con8 .faq_list ul li a{font-size:15px}
#recruit_idx .con8 .faq_list ul li .show_box p{font-size:14px}
#recruit_idx .con8 .faq_list ul li a::before{width:6px; height:6px; right:10px}

}