@charset "utf-8"; .jiran:after{content:""; display:block; clear:both} .jiran .btn_list{display:none} #warp{overflow-y:auto} /*회사소개 상단*/ /* 20250910 수정 */ #jiransecurity_top{position:relative; z-index:10; width:100%; margin-top:90px} #jiransecurity_top .top_info{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #jiransecurity_top .top_info h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #jiransecurity_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #jiransecurity_top .top_info .subtit_desc>span{display:inline} #jiransecurity_top .js_top_info{display:inline-block; width:100%; min-width:1280px; height:670px; margin:0 auto; padding:60px 0; background:#fff7f0; box-sizing:border-box} #jiransecurity_top .js_top_info .js_info{width:1280px; height:auto; margin:0 auto} #jiransecurity_top .js_top_info .js_info h2{display:block; font-size:36px; margin-top:120px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} #jiransecurity_top .js_top_info .js_info p.js_infotxt{margin-top:20px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} #jiransecurity_top .js_top_info .js_info p.js_infotxt span{display:block} #jiransecurity_top .js_top_info .js_info img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} #jiransecurity_top .js_top_info .js_info button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} #jiransecurity_top .js_top_info .js_info button a{color:#fff; text-decoration:auto} /* 캐릭터 페이지 20250910 추가 */ #character_top{position:relative; z-index:10; width:100%; margin-top:90px; margin-bottom:-4px} #character_top .top_info{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #character_top .top_info h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #character_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #character_top .top_info .subtit_desc>span{display:inline} /* 굿즈 */ #character_top .js_chr_bottom{display:inline-block; width:100%; min-width:1280px; margin:-78px auto 4px auto; padding-top:160px; background:#FFFEF2; box-sizing:border-box} #character_top .js_chr_bottom h2{display:block; font-size:36px; margin-top:120px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} #character_top .js_chr_bottom .js_goods img{display:block; width:70%; height:auto; margin:0 auto} #character_top .js_chr_bottom .js_goods_bottom{width:900px; margin:-60px auto 0 auto; text-align:center; /* 굿즈 이미지 오픈 시 margin:0 auto; */} #character_top .js_chr_bottom .js_goods_bottom ul{margin-top:60px} #character_top .js_chr_bottom .js_goods_bottom ul li {display:inline} #character_top .js_chr_bottom .js_goods_bottom ul li.goods_txt{display:inline-block; margin-top:210px; font-weight:bold; font-size:36px; color:#111; letter-spacing:-1px; text-align:center; vertical-align:top} #character_top .js_chr_bottom .js_goods_bottom ul li img{width:460px; height:auto; margin:0 auto 0 auto; text-align:center; box-sizing:border-box; vertical-align:bottom} /* 캐릭터 소개 애니메이션 */ #container .character_animation{width:100%; /*height:800px;*/ margin:0 auto 170px auto; text-align:center; box-sizing:border-box} #container .character_animation .bg{width:1280px; height:440px; background:url('/static/images/company/img_buddies_ani_01.png') center top no-repeat; background-size:1270px 323px; margin:24% auto 0 auto} #container .character_animation .ani_icon{position:absolute; width:1280px; height:440px} #container .character_animation .ani_icon .img01{position:inherit; left:140px; top:80px; background:url('/static/images/company/img_buddies_ani_02.png') no-repeat; background-size:100%; width:106px; height:88px} #container .character_animation .ani_icon .img02{position:inherit; left:120px; top:135px; background:url('/static/images/company/img_buddies_ani_03.png') no-repeat; background-size:100%; width:22px; height:21px} #container .character_animation .ani_icon .img03{position:inherit; left:1010px; top:-80px; background:url('/static/images/company/img_buddies_ani_04.png') no-repeat; background-size:100%; width:49px; height:59px} #container .character_animation .ani_icon .img04{position:inherit; left:1050px; top:15px; background:url('/static/images/company/img_buddies_ani_05.png') no-repeat; background-size:100%; width:19px; height:53px} #container .character_animation .ani_icon .img05{position:inherit; left:1170px; top:110px; background:url('/static/images/company/img_buddies_ani_06.png') no-repeat; background-size:100%; width:80px; height:120px; z-index:-10} /* 캐릭터 이미지 */ #character_top .character_video_img{padding:0; width:100%; background:url('/static/images/company/jiransecurity_character_video.svg') no-repeat center center; background-size:2000px auto; height:800px; margin:0 auto 0 auto} /* 캐릭터 스토리 */ .js_chr{display:inline-block; width:100%; min-width:1280px; height:670px; margin:0 auto; text-align:center; box-sizing:border-box} .js_chr .chr_story{width:1280px; height:auto; margin:0 auto} .js_chr .chr_story h2{display:block; font-size:36px; margin-top:80px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .js_chr .chr_story p.chr_txt{margin-top:25px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_chr .chr_story p.chr_txt span{display:block} .js_chr .chr_story .chr_story_img{display:block; width:100%; height:auto; margin:120px auto 160px auto; text-align:center; box-sizing:border-box} .js_chr .chr_story .chr_story_img img{width:892px; height:674px; margin:0 auto} /* 버디즈 세상 */ #character_world{position:relative; z-index:10; width:100%; margin-top:90px; margin-bottom:-4px} #character_world .js_chr_buddies{display:block; width:1280px; height:650px; margin:0 auto; background:url('/static/images/company/img_buddies_world.svg') no-repeat center 10%; background-size:100% auto} #character_world .js_chr_buddies .js_buddies h2{display:block; font-size:36px; margin-top:120px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} #character_world .js_chr_buddies .js_buddies p.js_buddies_txt{margin-top:26px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} #character_world .js_chr_buddies .js_buddies p.js_buddies_txt span{display:block} #character_world .js_chr_buddies .js_buddies .buddies_img{display:block; width:100%; height:auto; margin:20px auto 0 auto; text-align:center; box-sizing:border-box} #character_world .js_chr_buddies .js_buddies .buddies_img img{width:100%; height:auto; margin:0 auto} #character_world .character{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #character_world .character h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #character_world .character .character_subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #character_world .character .character_subtit_desc>span{display:inline} #character_world .js_character{display:inline-block; width:100%; min-width:1280px; height:800px; margin:0 auto; background-image: linear-gradient(to bottom, #FFFdd9 85%,#FFF8C0 20%); box-sizing:border-box} /* 버디즈 멤버 */ .js_chr_members{display:block; width:1280px; margin:0 auto; text-align:center} .js_chr_members .js_members h2{display:block; font-size:36px; margin-top:160px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .js_chr_members .js_members p.js_members_txt{margin-top:26px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_chr_members .js_members p.js_members_txt span{display:block} .js_chr_members .js_members .members_img{display:block; width:100%; height:auto; margin:40px auto 0 auto; text-align:center; box-sizing:border-box} .js_chr_members .js_members .members_img>img{width:45%; height:auto; margin:0 auto} .js_chr_members .js_members .members_img_tit{display:block; width:100%; height:auto; margin:120px auto 0 auto; text-align:center; box-sizing:border-box} .js_chr_members .js_members .members_img_tit>img{width:35%; height:auto; margin:0 auto} .js_chr_members .js_members .members_img_tit .w60{width:60%} .js_chr_members p.js_members_txt{margin-top:26px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_chr_members p.js_members_txt span{display:block} /* 캐릭터 영상 */ .character_video{display:block; width:100%; height:460px; margin:40px auto 0 auto; text-align:center} .character_video video{width:460px; height:auto; box-sizing:border-box} .character_video p{margin-top:20px; font-size:12px; color:#555; letter-spacing:-1px; text-align:center} .character_video_2{display:inline-block; width:460px; height:460px; margin:0 auto; text-align:center} .character_video_2 video{width:460px; height:auto; box-sizing:border-box} .character_video_2 p{margin-top:20px; font-size:12px; color:#555; letter-spacing:-1px; text-align:center} /* 반응형 캐릭터 영상 */ @media screen and (max-width:768px) { .character_video{height:230px; margin:30px auto 10px auto} .character_video video{width:230px; height:auto} } .js_chr_members .js_members_info{display:inline-block; width:900px; margin:40px auto 0 auto} .js_chr_members .js_members_info .js_members_dani{float:left; width:400px; text-align:left} .js_chr_members .js_members_info .js_members_dani>img{text-align:left; width:35%} .js_chr_members .js_members_info .js_members_dani>p{margin-top:26px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px} .js_chr_members .js_members_info .js_members_dani>p span{display:block} .js_chr_members .js_members_info .js_members_tany{float:right; width:400px; text-align:left} .js_chr_members .js_members_info .js_members_tany>img{text-align:left; width:35%} .js_chr_members .js_members_info .js_members_tany>p{margin-top:26px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px} .js_chr_members .js_members_info .js_members_tany>p span{display:block} .character_hash{display:inline !important; color:#333; font-size:16px; padding:6px 16px; border:1px solid #ddd; border-radius:20px} .js_chr_members .js_members_info_snd{display:inline-block; width:950px; margin:40px auto 0 auto} .js_chr_members .js_members_snd{float:right; width:420px; text-align:left} .js_chr_members .js_members_snd ul{margin-top:30px} .js_chr_members .js_members_snd ul:first-child{margin-top:135px} .js_chr_members .js_members_snd ul li{display:inline-block} .js_chr_members .js_members_snd ul li>img{text-align:left; width:auto; height:47px} .js_chr_members .js_members_snd ul li p{margin-left:30px; text-align:left; font-size:18px; line-height:30px; color:#555; letter-spacing:-1px} /* 캐릭터 타입 */ .js_chr_type{display:inline-block; width:100%; margin-top:200px; word-break:keep-all} .js_chr_type h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} /*.js_chr_type p.chr_type_txt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_chr_type p.chr_type_txt span{display:block}*/ .js_chr_type .chr_type_img{display:inline-block; margin-top:100px; line-height: 98px;} .js_chr_type .chr_type_img>span img{margin-right:40px; width:22%} .js_chr_type .chr_type_img span img:last-child{margin-right:0} .js_info_2depth{display:inline-block; width:100%; margin-top:260px; word-break:keep-all} .js_info_2depth h2{display:block; font-size:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .js_info_2depth p.js_infotxt{margin-top:20px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_info_2depth p.js_infotxt span{display:block} .js_info_2depth img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} .js_info_2depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_2depth .info_value dl{margin-top:130px} .js_info_2depth .info_value dl dd{display:inline-block; width:316px} /*20241121 박스 간격 조정을 위한 width값 수정*/ .js_info_2depth .info_value dl dd ul{margin:0 auto; width:200px} .js_info_2depth .info_value dl dd ul li{font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555} .js_info_2depth .info_value dl dd ul li span{display:block} .js_info_2depth .info_value dl dd ul li.value_01{display:inline-block; padding-bottom:15px; width:200px; height:150px; background:url('/static/images/company/ico_companyinfo_value_01@2x.png') no-repeat center top/50%; font-weight:700; font-size:28px; line-height:260px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_02{display:inline-block; padding-bottom:15px; width:200px; height:150px; background:url('/static/images/company/ico_companyinfo_value_02@2x.png') no-repeat center top/50%; font-weight:700; font-size:28px; line-height:260px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_03{display:inline-block; padding-bottom:15px; width:200px; height:150px; background:url('/static/images/company/ico_companyinfo_value_03@2x.png') no-repeat center top/50%; font-weight:700; font-size:28px; line-height:260px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_04{display:inline-block; padding-bottom:15px; width:200px; height:150px; background:url('/static/images/company/ico_companyinfo_value_04@2x.png') no-repeat center top/50%; font-weight:700; font-size:28px; line-height:260px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_3depth{display:inline-block; width:100%; margin-top:260px; word-break:keep-all} .js_info_3depth h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .js_info_3depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_info_3depth p.js_infotxt span{display:block} .js_info_3depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_3depth .info_culture span.culture_img img{display:inline-block; margin-top:40px; margin-right:40px; width:22%} .js_info_3depth .info_culture span.culture_img img:last-child{margin-right:0} .js_info_4depth{display:inline-block; width:100%; margin-top:260px; word-break:keep-all} .js_info_4depth h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .js_info_4depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .js_info_4depth p.js_infotxt span{display:block} .js_info_4depth img{display:block; margin:40px auto 40px auto; width:70%; text-align:center} .js_info_4depth .ci_btn{display:block; text-align:center} .js_info_4depth .ci_btn button{display:inline-block; margin:0 10px; width:180px; height:50px; color:#ff7f00; font-size:16px; line-height:32px; letter-spacing:-1px; border:1px solid #ff7f00; box-sizing:border-box; text-align:center} .js_info_4depth .ci_btn button a{color:#ff7f00; text-decoration:auto} /*인재채용 상단*/ #recruitment_top{position:relative; z-index:10; width:100%; margin-top:90px} #recruitment_top .top_info{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #recruitment_top .top_info h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px; color:#111} #recruitment_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #recruitment_top .top_info .subtit_desc>span{display:inline} #recruitment_top .recruitment_top_info{display:inline-block; width:100%; min-width:1280px; height:620px; margin:0 auto; padding:60px 0 0; background:#fff7f0; box-sizing:content-box} #recruitment_top .recruitment_top_info .recruitment_info{width:1280px; height:auto; margin:0 auto} #recruitment_top .recruitment_top_info .recruitment_info h2{display:block; font-size:36px; margin:50px auto; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} #recruitment_top .recruitment_top_info .recruitment_info h2 span{display:block; margin-top:10px} #recruitment_top .recruitment_top_info .recruitment_info p.recruitment_infotxt{margin-top:20px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} #recruitment_top .recruitment_top_info .recruitment_info p.recruitment_infotxt span{display:block} #recruitment_top .recruitment_top_info .recruitment_info img{display:block; margin:50px auto 0 auto; width:79px; text-align:center} #recruitment_top .recruitment_top_info .recruitment_info button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_2depth{display:inline-block; width:100%; margin:160px auto; word-break:keep-all} .recruitment_info_2depth h2{display:block; font-size:36px; margin-top:20px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .recruitment_info_2depth p.js_infotxt{margin-top:20px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_2depth p.js_infotxt span{display:block} .recruitment_info_2depth img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} .recruitment_info_2depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_3depth{display:inline-block; width:100%; margin-top:60px; padding:100px 0 150px 0; word-break:keep-all; background:linear-gradient(to top, #f5f6f8 0%, white 50%, white 100%)} .recruitment_info_3depth h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .recruitment_info_3depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_3depth p.js_infotxt span{display:block} .recruitment_info_3depth img{width:80%} .recruitment_info_3depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_4depth{display:inline-block; width:100%; margin:50px 0 60px 0; padding:100px 0; word-break:keep-all} .recruitment_info_4depth h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .recruitment_info_4depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_4depth p.js_infotxt span{display:block} .recruitment_info_4depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_4depth .info_benefit{display:block} .recruitment_info_4depth .info_benefit .benefit{margin-top:3.4rem; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap} .recruitment_info_4depth .info_benefit .benefit > li{width:calc(100% / 6); margin-bottom:50px} .recruitment_info_4depth .info_benefit ul li p{font-weight:700; text-align:center; color:#333} .recruitment_info_4depth .info_benefit ul li .benefit_txt span{display:inline-block; vertical-align:top; font-size:16px; line-height:1.77777; letter-spacing:-0.5px} .recruitment_info_4depth .info_benefit ul li .icon{display:block; width:100%; height:70px; margin-bottom:15px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_01{background:url('/static/images/company/ico_recruit_benefit_01@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_02{background:url('/static/images/company/ico_recruit_benefit_02@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_03{background:url('/static/images/company/ico_recruit_benefit_03@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_04{background:url('/static/images/company/ico_recruit_benefit_04@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_05{background:url('/static/images/company/ico_recruit_benefit_05@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_06{background:url('/static/images/company/ico_recruit_benefit_06@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_07{background:url('/static/images/company/ico_recruit_benefit_07@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_08{background:url('/static/images/company/ico_recruit_benefit_08@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_09{background:url('/static/images/company/ico_recruit_benefit_09@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_10{background:url('/static/images/company/ico_recruit_benefit_10@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_11{background:url('/static/images/company/ico_recruit_benefit_11@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_12{background:url('/static/images/company/ico_recruit_benefit_12@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_13{background:url('/static/images/company/ico_recruit_benefit_13@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_14{background:url('/static/images/company/ico_recruit_benefit_14@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_15{background:url('/static/images/company/ico_recruit_benefit_15@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_16{background:url('/static/images/company/ico_recruit_benefit_16@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_17{background:url('/static/images/company/ico_recruit_benefit_17@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_18{background:url('/static/images/company/ico_recruit_benefit_18@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_19{background:url('/static/images/company/ico_recruit_benefit_19@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_20{background:url('/static/images/company/ico_recruit_benefit_20@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_21{background:url('/static/images/company/ico_recruit_benefit_21@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_22{background:url('/static/images/company/ico_recruit_benefit_22@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_23{background:url('/static/images/company/ico_recruit_benefit_23@2x.png') no-repeat center / 70px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_24{background:url('/static/images/company/ico_recruit_benefit_24@2x.png') no-repeat center / 70px} .recruitment_info_5depth{display:inline-block; width:100%; margin:0; padding:140px 0 130px 0; word-break:keep-all; background:#f5f6f8; box-sizing:border-box} .recruitment_info_5depth h2{display:block; font-size:36px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .recruitment_info_5depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_5depth p.js_infotxt span{display:block} .recruitment_info_5depth img{display:block; margin:40px auto 40px auto; width:70%; text-align:center} .recruitment_info_5depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_5depth .recruitment_step{text-align:center} .recruitment_info_5depth .recruitment_step dd{display:inline-block; margin:60px 0 0 15px; width:400px; height:488px; background:#fff} .recruitment_info_5depth .recruitment_step dd:first-child{margin-left:0} .recruitment_info_5depth .recruitment_step dd dl{text-align:center; width:100%; padding:50px 0; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul{margin:0 auto} .recruitment_info_5depth .recruitment_step dd dl ul li{font-weight:700; font-size:28px; line-height:42px; letter-spacing:-1px; text-align:center; color:#282828} .recruitment_info_5depth .recruitment_step dd dl ul li:first-child{font-weight:400; color:#ff7f00; font-size:18px; line-height:36px} .recruitment_info_5depth .recruitment_step dd dl ul li span{display:block} .recruitment_info_5depth .recruitment_step dd dl ul li.step_01{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step01@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul li.step_02{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step02@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul li.step_03{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step03@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_6depth{display:inline-block; width:100%; margin-top:20px; padding:0; word-break:keep-all} .recruitment_info_6depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:36px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_6depth p.js_infotxt span{display:inline-block; width:110px; height:38px; border:1px solid #f0f0f2; border-radius:50px} .js_img{display:block !important; width:1280px; text-align:center; margin:0 auto} /*다이렉트문의*/ #direct_top{position:relative; z-index:10; width:100%; margin-top:90px} #direct_top .top_info{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #direct_top .top_info h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #direct_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #direct_top .top_info .subtit_desc>span{display:inline} .direct_info_2depth{display:inline-block; width:100%; word-break:keep-all} .direct_info_2depth h2{display:block; font-size:36px; margin-top:23px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .direct_info_2depth p.js_infotxt{margin-top:20px; font-size:18px; line-height:32px; color:#959595; letter-spacing:-1px; text-align:center} .direct_info_2depth p.js_infotxt span{display:block} .direct_info_2depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .direct_info_2depth .direct_products{text-align:center; margin:0 auto} .direct_info_2depth .direct_products dl{margin-top:40px} .direct_info_2depth .direct_products dl:first-child{margin-top:60px} .direct_info_2depth .direct_products dl dd{display:block; float:left; width:280px; margin:0 40px 40px 0; border:1px solid #f0f0f1; text-align:center} .direct_info_2depth .direct_products dl dd:last-child{margin-right:0} .direct_info_2depth .direct_products dl dd ul{margin:0 auto; /* width:200px; */height:270px; box-sizing:border-box} .direct_info_2depth .direct_products dl dd ul li{font-size:16px; line-height:26px; text-align:center; color:#555} .direct_info_2depth .direct_products dl dd ul li.product_bi{height:140px; background:#fafafa; border-bottom:1px solid #f0f0f1} .direct_info_2depth .direct_products dl dd ul li.product_bi img{text-align:center; margin-top:60px} .direct_info_2depth .direct_products dl dd ul li.product_name{margin-top:17px; font-weight:700; font-size:20px; line-height:29px; letter-spacing:-1px; color:#282828} .direct_info_2depth .direct_products dl dd ul li.mail a{color:#ff7f00} .direct_info_2depth .direct_products dl dd.ir ul{height:105px; box-sizing:border-box} .direct_info_2depth .direct_products dl dd.ir ul li{font-size:16px; line-height:32px; text-align:center; color:#555} .direct_info_2depth .direct_products dl dd.ir ul li.ir_name{margin-top:30px; font-weight:700; font-size:20px; line-height:20px; letter-spacing:-1px; color:#282828} .direct_info_2depth .direct_tech{display:inline-block; margin-top:20px} .direct_info_2depth .direct_tech .tech_tel{display:block; margin-top:40px; font-weight:700; font-size:50px; color:#282828; text-align:center} .direct_info_2depth .direct_tech .tech_tel a, .direct_info_2depth .direct_tech .tech_tel a:hover{text-decoration:none} .direct_info_2depth .direct_tech .tech_tel img{width:4%; height:auto; vertical-align:bottom} .direct_info_2depth .direct_tech .tech_part{display:inline-block; width:100%; margin-top:50px} .direct_info_2depth .direct_tech .tech_part .tech_mail{float:left; display:block; width:620px; height:210px; margin:0 0 40px 0; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; /*background:url('/static/images/company/img-company-contact-tech-spamsniper@2x.png') no-repeat 92% 70%; background-size:51px 51px*/} .direct_info_2depth .direct_tech .tech_part .tech_docu{float:left; display:block; width:620px; height:210px; margin:0 0 40px 40px; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; /*background:url('/static/images/company/img_company_contact_tech_docuone@2x.png') no-repeat 92% 70%; background-size:51px 51px*/} .direct_info_2depth .direct_tech .tech_part .tech_mobile{float:left; display:block; width:620px; height:210px; margin:0 0 40px 0; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; /*background:url('/static/images/company/img_company_contact_tech_mobilekeeper@2x.png') no-repeat 92% 70%; background-size:51px 51px*/} .direct_info_2depth .direct_tech .tech_part .tech_sanitox{float:left; display:block; width:620px; height:210px; margin:0 0 40px 40px; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; /*background:url('/static/images/company/img_company_contact_tech_sanitox@2x.png') no-repeat 92% 70%; background-size:51px 51px*/} /*.direct_info_2depth .direct_tech .tech_part .tech_pylon{float:left; display:inline-block; width:620px; height:210px; margin:0 0 40px 0; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; background:url('/static/images/company/img_company_contact_tech_pylon@2x.png') no-repeat 92% 70%; background-size:51px 51px}*/ .direct_info_2depth .direct_tech .tech_part .tech_cmg{float:left; display:block; width:620px; height:210px; margin:0 0 40px 0; padding:50px; border:1px solid #f0f0f2; box-sizing:border-box; /*background:url('/static/images/company/img_company_contact_tech_pylon@2x.png') no-repeat 92% 70%; background-size:51px 51px*/} .direct_info_2depth .direct_tech .tech_part span{display:block} .direct_info_2depth .direct_tech .tech_part span:first-child{margin-bottom:20px} .direct_info_2depth .direct_tech .tech_part span p{display:inline-block; font-size:16px; line-height:34px; letter-spacing:-1px; color:#555} .direct_info_2depth .direct_tech .tech_part span .part_name{font-weight:700; font-size:20px; line-height:29px; letter-spacing:-1px; color:#282828} .direct_info_2depth .direct_tech .tech_part span .part_number{float:right; width:105px; height:28px; margin-left:20px; background:#ff7f00; border-radius:6px; font-weight:500; font-size:14px; line-height:29px; letter-spacing:-1px; color:#fff; text-align:center} .direct_info_2depth .direct_tech .tech_part span .part_mail a{font-size:16px; line-height:26px; letter-spacing:0; color:#ff7f00 !important} /* 제품문의*/ .inquiry{display:block; width:100%} .inquiry_title{display:inline-block; width:100%; margin-top:15px; text-align:center} .inquiry_title h2{font-size:27px; font-weight:700; line-height:42px; color:#ff7f00; letter-spacing:-1px} .inquiry_title h3{font-size:27px; font-weight:700; line-height:42px; color:#282828; letter-spacing:-1px} .inquiry_title p{font-size:16px; line-height:32px; color:#959595; letter-spacing:-1px} .inquiry_step01 .inquiry_info{display:inline-block; margin-top:40px} .inquiry_step01 .inquiry_info dl{display:block; float:left; width:600px; margin-left:40px; margin-bottom:30px} .inquiry_step01 .inquiry_info dl:nth-last-child(-n+2){margin-bottom:0} .inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:164px; height:auto; background:#fff; line-height:32px} .inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px} .inquiry_step01 .inquiry_info dl dd{float:left; width:510px; height:auto; line-height:32px} .inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:13px} .inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 470px 10px; background-size:24px 24px} .inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step02{display:inline-block; margin-top:60px} .inquiry_step02 .inquiry_solution{display:inline-block; margin-top:40px} .inquiry_step02 .inquiry_solution dl{display:block; float:left; width:256px} .inquiry_step02 .inquiry_solution dl dd .solution_tit li{display:inline-block; width:100%; height:70px; line-height:70px; border-top:1px solid #d8d8d8; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; background-color:#f5f6f8; font-size:16px; font-weight:700; color:#555; text-align:center; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod{display:block; height:165px; padding:20px 0 0 20px; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; font-size:16px; color:#999; text-align:left; line-height:32px; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{cursor:pointer} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{cursor:pointer} /*.inquiry_step02 .inquiry_solution .rdo{display:inline-block; background:#fff; margin-right:8px; box-sizing:border-box}*/ .inquiry_step02 .inquiry_solution input[type="radio"]{display:none} .inquiry_step02 .inquiry_solution input[type="radio"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/radio-20-off@2x.png') no-repeat left top/ 22px 22px} .inquiry_step02 .inquiry_solution input[type="radio"]:checked + label{background-image:url('/static/images/common/radio-20-on@2x.png')} .inquiry_step02 .inquiry_solution dl dd .bRnone{border-right:0 !important} .inquiry_step03{display:inline-block; margin-top:60px; width:100%} .inquiry_step03 textarea{display:inline-block; margin-top:40px; width:1280px; height:470px; padding:20px; border:1px solid #dadbde; box-sizing:border-box; font-size:16px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; word-break:keep-all} .inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .inquiry_step03 .agree_chk p span a{color:#ff7f00} .inquiry_step_btn{display:inline-block; width:100%; margin:100px auto 0 auto} .inquiry_step_btn button{display:block; width:270px; height:66px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup{display:inline-block; position:absolute; width:960px; height:520px; top:calc(50vh - 280px); left:calc(50vw - 510px); margin:25px auto; padding:40px; background:#fff; box-sizing:border-box; border-radius:12px} .agree_popup h3{display:inline-block; font-size:22px; font-weight:700; color:#282828; letter-spacing:-1px} .agree_popup .text_box{display:inline-block; width:100%; height:330px; margin-top:20px; padding:30px; font-size:14px; line-height:24px; border:1px solid #dadbde; box-sizing:border-box; overflow:auto} .agree_popup .text_box .text_inbox{display:inline-block} .agree_popup .text_box .text_inbox p{font-size:14px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:lighter; letter-spacing:-1px; word-break:keep-all} .agree_popup .text_box .text_inbox p .stxt{display:block; margin-left:20px; margin-bottom:20px; font-size:14px; line-height:24px} .agree_popup .text_box .text_inbox a{color:#f08300; text-decoration:underline} .agree_popup_btn{display:inline-block; width:100%; margin:20px auto 0 auto; text-align:center} .agree_popup_btn button{display:inline-block; width:270px; height:56px; margin:0 auto; font-size:16px; font-weight:700; line-height:26px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup .agree_box{margin-top:13px; padding:17px 20px; background:#fff; border:1px solid #ddd; font-size:14px; line-height:20px} .agree_popup .agree_box p.tit{margin-top:20px; font-weight:700} .agree_popup .agree_box p:first-child{margin-top:0} .agree_table{border-spacing:0; border-collapse:collapse; width:100%; margin-top:20px; padding:0; border:0} .agree_table tr{font-size:14px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; letter-spacing:-1px; word-break:keep-all} .agree_table tr th{border-top:2px solid #dadbde; border-right:1px solid #dadbde; border-bottom:1px solid #dadbde; padding:10px 0; color:#282828; background:#f5f6f8; text-align:center; box-sizing:border-box} .agree_table tr td{border-right:1px solid #dadbde; border-bottom:1px solid #dadbde; padding:10px; text-align:left; margin-left:20px; box-sizing:border-box} .agree_table tr th:first-child{width:20%; text-align:center} .agree_table tr th:last-child{width:40%; border-right:0 none} .agree_table tr td:last-child{border-right:0 none} .agree_table tr td span{display:block} .down_agree_popup{display:inline-block; position:absolute; width:960px; height:670px; top:calc(50vh - 350px); left:calc(50vw - 510px); margin:25px auto; padding:60px 40px 40px 40px; background:#fff; box-sizing:border-box; border-radius:12px} .down_agree_popup h3{display:inline-block; font-size:22px; font-weight:700; color:#282828; letter-spacing:-1px} .down_pop{display:inline-block; width:100%; height:350px; margin-top:20px; padding:10px 30px; font-size:14px; line-height:24px; border:1px solid #dadbde; box-sizing:border-box; overflow:auto} .down_inquiry_title{display:inline-block; width:100%; text-align:center} .down_inquiry_title h2{font-size:24px; font-weight:700; line-height:36px; color:#ff7f00; letter-spacing:-1px} .down_inquiry_title h3{font-size:24px; font-weight:700; line-height:36px; color:#282828; letter-spacing:-1px} .down_inquiry_title p{font-size:14px; line-height:24px; color:#959595; letter-spacing:-1px} .down_inquiry_step01{display:inline-block; margin-top:30px} .down_inquiry_step01 .inquiry_info{display:inline-block; margin-left:30px} .down_inquiry_step01 .inquiry_info dl{display:block; float:left; width:48%; margin-left:10px; margin-bottom:10px} .down_inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:164px; height:auto; background:#fff; line-height:28px} .down_inquiry_step01 .inquiry_info dl dt span{display:block; font-size:14px; font-weight:700; line-height:28px} .down_inquiry_step01 .inquiry_info dl dd{float:left; width:400px; height:auto; line-height:28px} .down_inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:13px} .down_inquiry_step01 .inquiry_info dl dd input{width:100%; height:40px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .down_inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select{width:100%; height:40px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 470px 10px; background-size:24px 24px} .down_inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .down_inquiry_step03{display:inline-block; margin-top:10px; margin-left:40px; width:100%; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; font-weight:500; letter-spacing:-1px; word-break:keep-all} .down_inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .down_inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .down_inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; font-size:14px; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .down_inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .down_inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .down_inquiry_step03 .agree_chk p span a{color:#ff7f00} .down_inquiry_step_btn{display:inline-block; width:100%; margin:40px auto 0 auto} .down_inquiry_step_btn button{display:block; width:270px; height:60px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .btn_closed {display:block; position:absolute; float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} .search_btn_closed{display:block; /*position:absolute; */float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} /* 모달팝업 */ .modal_bg{position:fixed; top:0; left:0; bottom:0; right:0; background:rgba(0,0,0,0.6)} .modal_menu_bg{position:fixed; top:0; left:0; bottom:0; right:0; background:rgba(0,0,0,0.9)} /* 연혁 & 수상및인증 */ #history_top{position:relative; z-index:10; width:100%; margin-top:90px; margin-bottom:100px} #history_top .top_info{height:240px; text-align:center; opacity:0.9} #history_top .top_info h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #history_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #history_top .top_info .subtit_desc>span{display:inline} #history_top .js_top_info, #history_top .js_top_info2{min-width:1280px; margin:-95px auto 0 auto; padding:60px 0 250px; box-sizing:border-box; text-align:center; background:url('/static/images/company/bg_history.png'),url('/static/images/company/bg_history3.png'); background-repeat:no-repeat,repeat-x; background-position:92% 1px, left top; background-size:auto auto, 100% 500px} #history_top .js_top_info .history_top, #history_top .js_top_info2 .certification_top{width:1280px; margin:0 auto; background:url('/static/images/company/bg_history_icon.png') no-repeat 577px 135px} #history_top .js_top_info .history_top:after, #history_top .js_top_info2 .certification_top:after{content:''; display:table; clear:both} #history_top .js_top_info .history_top .history_top_left, #history_top .js_top_info2 .certification_top .certification_top_left{float:left; width:500px; margin:100px 120px 0 0; text-align:left} #history_top .js_top_info .history_top .history_top_left h2, #history_top .js_top_info2 .certification_top .certification_top_left h2{display:block; font-size:36px; line-height:56px; margin-top:110px; font-weight:700; letter-spacing:-2px; word-break:keep-all; color:#111} #history_top .js_top_info .history_top .history_top_left h2 span, #history_top .js_top_info2 .certification_top .certification_top_left h2 span{display:block; width:310px; background:linear-gradient(to top, rgba(255, 127, 0, 0.5) 35%, transparent 30%)} #history_top .js_top_info .history_top .history_top_left h2 span{width:260px} #history_top .js_top_info .history_top .history_top_left p.history_txt, #history_top .js_top_info2 .certification_top .certification_top_left p.history_txt{margin-top:20px; font-size:18px; line-height:32px; color:#555; letter-spacing:-1px; word-break:keep-all} #history_top .js_top_info .history_top .history_top_left p.history_txt span, #history_top .js_top_info2 .certification_top .certification_top_left p.history_txt span{display:block} #history_top .js_top_info .history_top .history_top_right, #history_top .js_top_info2 .certification_top .certification_top_right{float:left; padding:204px 0 0; width:660px; text-align:left} #history_top .js_top_info .history_top .history_top_right dl, #history_top .js_top_info2 .certification_top .certification_top_right dl{position:relative; padding:10px 0 50px} #history_top .js_top_info .history_top .history_top_right dl:before, #history_top .js_top_info2 .certification_top .certification_top_right dl:before{content:''; position:absolute; left:3px; top:26px; bottom:-19px; z-index:1; display:block; width:1px; background:#d8d8d8} #history_top .js_top_info .history_top .history_top_right dl:after, #history_top .js_top_info2 .certification_top .certification_top_right dl:after{content:''; position:absolute; left:0; top:19px; z-index:2; display:block; width:7px; height:7px; background:#ff7f00; border-radius:50%} #history_top .js_top_info .history_top .history_top_right dl:last-of-type, #history_top .js_top_info2 .certification_top .certification_top_right dl:last-of-type {padding:10px 0 0} #history_top .js_top_info .history_top .history_top_right dl:last-of-type:before, #history_top .js_top_info2 .certification_top .certification_top_right dl:last-of-type:before{content:none} #history_top .js_top_info .history_top .history_top_right dl .month, #history_top .js_top_info2 .certification_top .certification_top_right dl .month{position:relative; margin:0 0 10px} #history_top .js_top_info .history_top .history_top_right dl .month:after, #history_top .js_top_info2 .certification_top .certification_top_right dl .month:after{content:''; display:table; clear:both} #history_top .js_top_info .history_top .history_top_right dl dt, #history_top .js_top_info2 .certification_top .certification_top_right dl dt{float:left; width:90px; line-height:27px; margin:0 0 0 35px; font-weight:700; font-size:20px; color:#333; text-align:right} #history_top .js_top_info .history_top .history_top_right dl dt.js_color, #history_top .js_top_info2 .certification_top .certification_top_right dl dt.js_color{color:#ff7f00} #history_top .js_top_info .history_top .history_top_right dl dd, #history_top .js_top_info2 .certification_top .certification_top_right dl dd{display:block; margin-left:148px; font-size:18px; line-height:27px; letter-spacing:-1px; color:#555} #history_top .js_top_info .history_top .history_top_right dl dd span, #history_top .js_top_info2 .certification_top .certification_top_right dl dd span{display:block} .culture{margin-top:48px} .character{margin-top:48px} /* hide */ .view_pc{display:inline-block !important} .view_pc_db{display:block !important} .view_mo{display:none !important} .view_mo_db{display:none !important} .character_img{display:block; margin:0 auto; width:2000px; text-align:center} @media (max-width:1024px){ .jiran{padding:0 16px; box-sizing:border-box; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif} .jiran:after{content:""; display:block; clear:both; margin:0 auto} .jiran .btn_list{display:none} #warp{overflow-y:auto} /*회사소개 상단*/ #jiransecurity_top{position:relative; z-index:10; width:100%; max-width:auto; margin:70px auto 0 auto; word-break:keep-all; text-align:center} #jiransecurity_top .top_info{display:block; width:100%; width:100%; height:auto; margin:0 auto; padding:0 16px; text-align:center; opacity:0.9; box-sizing:border-box} #jiransecurity_top .top_info h2{display:inline-block; margin:35px auto 0 auto; color:#111; font-size:2.125em; font-weight:700; letter-spacing:-1px} #jiransecurity_top .top_info .subtit_desc{margin:20px auto 50px auto; color:#555; font-size:1.000em; line-height:1.625em; letter-spacing:-1.5px} #jiransecurity_top .top_info .subtit_desc>span{display:block} #jiransecurity_top .js_top_info{display:inline-block; width:100%; min-width:100%; height:430px; margin:0 auto; padding:30px 0; background:#fff7f0; box-sizing:border-box} #jiransecurity_top .js_top_info .js_info{width:90%; height:auto; margin:0 auto} #jiransecurity_top .js_top_info .js_info h2{display:block; font-size:24px; line-height:36px; margin-top:40px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} #jiransecurity_top .js_top_info .js_info p.js_infotxt{margin-top:40px; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} #jiransecurity_top .js_top_info .js_info p.js_infotxt span{display:inline} #jiransecurity_top .js_top_info .js_info img{display:block; margin:50px auto 0 auto; width:70%; height:70%; text-align:center} #jiransecurity_top .js_top_info .js_info button{display:block; margin:50px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} #jiransecurity_top .js_top_info .js_info button a{color:#fff; text-decoration:auto} .js_info_2depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_2depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left} .js_info_2depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_2depth p.js_infotxt span{display:inline} .js_info_2depth img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} .js_info_2depth button{display:block; margin:70px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_2depth .info_value dl{margin-top:20px; text-align:center} .js_info_2depth .info_value dl dd{display:inline-block; width:auto; margin-top:30px} .js_info_2depth .info_value dl dd ul{margin:0 auto; width:155px} .js_info_2depth .info_value dl dd ul li{font-size:13px; line-height:20px; letter-spacing:-1px; text-align:center; color:#555} .js_info_2depth .info_value dl dd ul li span{display:inline} .js_info_2depth .info_value dl dd ul li.value_01{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_01@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_02{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_02@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_03{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_03@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_04{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_04@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_3depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_3depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .js_info_3depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_3depth p.js_infotxt span{display:inline} .js_info_3depth img{width:50%} .js_info_3depth button{display:block; margin:40px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_3depth .info_culture{text-align:center} .js_info_3depth .info_culture span.culture_img img{display:inline-block; margin-top:10px; margin-right:10px; width:23%} .js_info_3depth .info_culture span.culture_img img:last-child{margin-right:0} .js_info_3depth .info_culture span.culture_img img:nth-child(even){margin-right:10px} .js_info_4depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_4depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .js_info_4depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_4depth p.js_infotxt span{display:inline} .js_info_4depth img{display:block; margin:40px auto 40px auto; width:70%; text-align:center} .js_info_4depth .ci_btn{display:block; text-align:center} .js_info_4depth .ci_btn button{display:inline-block; margin:0 3px; width:155px; height:50px; color:#ff7f00; font-weight:500; font-size:16px; line-height:32px; letter-spacing:-1px; border:1px solid #ff7f00; box-sizing:border-box; text-align:center} .js_info_4depth .ci_btn button a{color:#ff7f00; text-decoration:auto} .inquiry{display:block; width:100%} .inquiry_title{display:inline-block; width:100%; margin-top:50px; text-align:center} .inquiry_title h2{font-size:24px; font-weight:700; line-height:36px; color:#ff7f00; letter-spacing:-1px} .inquiry_title h3{font-size:24px; font-weight:700; line-height:36px; color:#282828; letter-spacing:-1px} .inquiry_title p{font-size:14px; line-height:24px; color:#959595; letter-spacing:-1px} .inquiry_step01 .inquiry_info{display:inline-block; margin-top:40px; margin-left:40px} .inquiry_step01 .inquiry_info dl{display:block; float:left; width:45%; margin-left:0; margin-bottom:30px; margin-right:30px} .inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:100%; height:auto; background:#fff; line-height:32px} .inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px} .inquiry_step01 .inquiry_info dl dd{float:left; width:100%; height:auto; line-height:32px} .inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:12px} .inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step02{display:inline-block; margin-top:0} .inquiry_step02 .inquiry_solution{display:inline-block; margin-top:40px; width:100%} .inquiry_step02 .inquiry_solution dl{display:block; float:left; width:calc(100% / 3)} .inquiry_step02 .inquiry_solution dl:nth-child(-n+3) dd .solution_prod{border-bottom:none} .inquiry_step02 .inquiry_solution dl:nth-child(3) dd .solution_tit li{border-right:none} .inquiry_step02 .inquiry_solution dl:nth-child(3) dd .solution_prod{border-right:none} .inquiry_step02 .inquiry_solution dl dd .solution_tit li{display:inline-block; width:100%; height:70px; line-height:70px; border-top:1px solid #d8d8d8; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; background-color:#f5f6f8; font-size:16px; font-weight:700; color:#555; text-align:center; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod{display:block; height:140px; padding:20px 0 0 20px; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; font-size:16px; color:#999; text-align:left; line-height:32px; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{cursor:pointer} /* .inquiry_step02 .inquiry_solution .rdo{display:inline-block; background:#fff; margin-right:8px; box-sizing:border-box} */ .inquiry_step02 .inquiry_solution input[type="radio"]{display:none} .inquiry_step02 .inquiry_solution input[type="radio"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/radio-20-off@2x.png') no-repeat left top/ 22px 22px} .inquiry_step02 .inquiry_solution input[type="radio"]:checked + label{background-image:url('/static/images/common/radio-20-on@2x.png')} .inquiry_step02 .inquiry_solution dl dd .bRnone{border-right:0 !important} .inquiry_step03{display:inline-block; margin-top:50px; width:100%} .inquiry_step03 textarea{display:inline-block; margin-top:40px; width:100%; height:470px; padding:20px; border:1px solid #dadbde; box-sizing:border-box; font-size:16px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; word-break:keep-all} .inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .inquiry_step03 .agree_chk p span a{color:#ff7f00} .inquiry_step_btn{display:inline-block; width:100%; margin:50px auto 0 auto} .inquiry_step_btn button{display:block; width:270px; height:66px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup{display:inline-block; position:absolute; width:100%; height:auto; top:calc(50vh - 150px); left:calc(50vw - 180px); margin:25px auto; padding:20px; background:#fff; box-sizing:border-box; border-radius:12px} .agree_popup h3{display:inline-block; font-size:27px; font-weight:700; color:#282828; letter-spacing:-1px} .agree_popup .text_box{display:inline-block; width:100%; height:440px; margin-top:20px; padding:30px; font-size:18px; line-height:32px; border:1px solid #dadbde; box-sizing:border-box} .agree_popup .text_box p{font-size:12px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:lighter; letter-spacing:-1px} .agree_popup .text_box .text_inbox p .stxt{display:block; margin-left:20px; font-size:14px; line-height:24px} .agree_popup .text_box .text_inbox a{color:#f08300; text-decoration:underline} .agree_popup_btn{display:inline-block; width:100%; margin:15px auto 0 auto} .agree_popup_btn button{display:block; width:200px; height:66px; margin:0 auto; font-size:12px; font-weight:700; line-height:24px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup .area_box{margin:15px 0 30px 0; padding:10px; border:1px solid #ccc} .agree_popup .area_box textarea{margin:0 !important; padding:0; width:100% !important; height:200px !important; border:0} .agree_popup .agree_box{margin-top:16px; padding:10px 10px; background:#fff; border:1px solid #ddd; font-size:13px; line-height:16px} .agree_popup .agree_box p.tit{margin-top:20px; font-weight:700} .agree_popup .agree_box p:first-child{margin-top:0} .down_agree_popup{display:inline-block; position:absolute; width:90%; height:85%; top:calc(50vh - 350px); left:calc(50vw - 170px); margin:20px auto; padding:20px; background:#fff; box-sizing:border-box; border-radius:12px; overflow-y:scroll} .down_agree_popup h3{display:inline-block; font-size:27px; font-weight:700; color:#282828; letter-spacing:-1px} .down_pop{display:inline-block; width:100%; height:350px; margin-top:20px; padding:10px 30px; font-size:16px; line-height:32px; border:1px solid #dadbde; box-sizing:border-box; overflow:auto} .down_inquiry_title{display:inline-block; margin-top:40px; width:100%; text-align:center} .down_inquiry_title h2{font-size:22px; font-weight:700; line-height:42px; color:#ff7f00; letter-spacing:-1px} .down_inquiry_title h3{font-size:22px; font-weight:700; line-height:42px; color:#282828; letter-spacing:-1px} .down_inquiry_title p{font-size:16px; line-height:32px; color:#959595; letter-spacing:-1px} .down_inquiry_step01{display:inline-block; margin-top:30px; width:100%} .down_inquiry_step01 .inquiry_info{display:inline-block; margin-left:0} .down_inquiry_step01 .inquiry_info dl{display:block; float:left; width:100%; margin-left:0; margin-bottom:10px} .down_inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:164px; height:auto; background:#fff; line-height:32px} .down_inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px} .down_inquiry_step01 .inquiry_info dl dd{float:left; width:100%; height:auto; line-height:32px} .down_inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:12px} .down_inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .down_inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 470px 10px; background-size:24px 24px} .down_inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .down_inquiry_step03{display:inline-block; margin-top:20px; margin-left:0; width:100%; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; font-weight:500; letter-spacing:-1px; word-break:keep-all} .down_inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .down_inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .down_inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .down_inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .down_inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .down_inquiry_step03 .agree_chk p span a{color:#ff7f00} .down_inquiry_step_btn{display:inline-block; width:100%; margin:40px auto 0 auto} .down_inquiry_step_btn button{display:block; width:240px; height:56px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .btn_closed {display:block; position:absolute; float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} .search_btn_closed{display:block; /*position:absolute; */float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} } @media (max-width:812px){ .jiran{padding:0 16px; box-sizing:border-box} .jiran:after{content:""; display:block; clear:both; margin:0 auto} .jiran .btn_list{display:none} #warp{overflow-y:auto} /*회사소개 상단*/ #jiransecurity_top{position:relative; z-index:10; width:100%; height:220px; margin:70px auto 0 auto; word-break:keep-all; text-align:center} #jiransecurity_top .top_info{display:block; width:90%; height:auto; margin:50px auto 0 auto; padding:0 16px; text-align:center; opacity:0.9; box-sizing:border-box} #jiransecurity_top .top_info h2{display:inline-block; margin:40px auto 0 auto; color:#111; font-size:2.125em; font-weight:700; letter-spacing:-1px} #jiransecurity_top .top_info .subtit_desc{margin:20px auto 50px auto; color:#555; font-size:1.000em; line-height:1.625em; letter-spacing:-1.5px} #jiransecurity_top .top_info .subtit_desc>span{display:block} #jiransecurity_top .js_top_info{display:inline-block; width:100%; min-width:100%; height:630px; margin:0 auto; padding:30px 0; background:#fff7f0; box-sizing:border-box} #jiransecurity_top .js_top_info .js_info{width:90%; height:auto; margin:0 auto} #jiransecurity_top .js_top_info .js_info h2{display:block; font-size:24px; line-height:36px; margin-top:40px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} #jiransecurity_top .js_top_info .js_info p.js_infotxt{display:block; margin-top:40px; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} #jiransecurity_top .js_top_info .js_info p.js_infotxt span{display:inline} #jiransecurity_top .js_top_info .js_info img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} #jiransecurity_top .js_top_info .js_info button{display:block; margin:50px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} #jiransecurity_top .js_top_info .js_info button a{color:#fff; text-decoration:auto} /* 캐릭터 페이지 20250910 추가 */ #character_top{position:relative; z-index:10; width:100%; height:220px; margin: 70px auto 0 auto; word-break: keep-all; text-align: center;} #character_top .top_info{display:block; width:90%; height:auto; margin:50px auto 0 auto; padding:0 16px; text-align:center; opacity:0.9; box-sizing:border-box} #character_top .top_info h2{display:inline-block; margin:40px auto 0 auto; color:#111; font-size:2.125em; font-weight:700; letter-spacing:-1px} #character_top .top_info .subtit_desc{margin:20px auto 50px auto; color:#555; font-size:1.000em; line-height:1.625em; letter-spacing:-1.5px} #character_top .top_info .subtit_desc>span{display:block} /* 굿즈 */ #character_top .js_chr_bottom{display:inline-block; width:100%; min-width:280px; margin:-60px auto 4px auto; padding-top:0; background:#FFFEF2; box-sizing:border-box} #character_top .js_chr_bottom h2{display:block; font-size:24px; margin-top:10px; font-weight:700; letter-spacing:-1px; text-align:center; color:#111} #character_top .js_chr_bottom .js_goods img{display:block; width:70%; height:auto; margin:0 auto} #character_top .js_chr_bottom .js_goods_bottom{width:90%; margin:0 auto; padding:0 0 140px 0; text-align:center; /* 굿즈 이미지 오픈 시 margin:0 auto; */} #character_top .js_chr_bottom .js_goods_bottom ul{display: inline-block; width:100%; margin:63px auto} #character_top .js_chr_bottom .js_goods_bottom ul li {display:inline} #character_top .js_chr_bottom .js_goods_bottom ul li:nth-child(even) {position:absolute; display:block; width:100%; margin-left:-20px; padding:20px 0;} #character_top .js_chr_bottom .js_goods_bottom ul li.goods_txt{display:inline; margin-top:0; font-weight:bold; font-size:24px; color:#111; letter-spacing:-1px; text-align:left; vertical-align:top} #character_top .js_chr_bottom .js_goods_bottom ul li img{width:250px; height:auto; margin:0 auto 0 auto; text-align:center; box-sizing:border-box; vertical-align:bottom} /* 캐릭터 소개 애니메이션 */ #container .character_animation{width:100%; /*height:800px;*/ margin:-60px auto 130px auto; text-align:center; box-sizing:border-box} #container .character_animation .bg{width:320px; height:200px; background:url('/static/images/company/img_buddies_ani_00.png') center top no-repeat; background-size:360px auto; margin:100px auto 0 auto} #container .character_animation .ani_icon{position:absolute; width:100%; height:200px} #container .character_animation .ani_icon .img01{position:inherit; left:25px; top:10px; background:url('/static/images/company/img_buddies_ani_02.png') no-repeat; background-size:100%; width:30px; height:30px} #container .character_animation .ani_icon .img02{position:inherit; left:15px; top:135px; background:url('/static/images/company/img_buddies_ani_03.png') no-repeat; background-size:100%; width:8px; height:8px} #container .character_animation .ani_icon .img03{position:inherit; left:290px; top:10px; background:url('/static/images/company/img_buddies_ani_04.png') no-repeat; background-size:100%; width:16px; height:22px} #container .character_animation .ani_icon .img04{position:inherit; left:265px; top:113px; background:url('/static/images/company/img_buddies_ani_05.png') no-repeat; background-size:100%; width:5px; height:15px} #container .character_animation .ani_icon .img05{position:inherit; left:300px; top:140px; background:url('/static/images/company/img_buddies_ani_06.png') no-repeat; background-size:100%; width:21px; height:30px; z-index:-10;} /* 캐릭터 이미지 */ #character_top .character_video_img{padding:0; width:100%; background:url('/static/images/company/jiransecurity_character_video.svg') no-repeat center center; background-size:2000px auto; height:800px; margin:0 auto 0 auto} /* 캐릭터 소개 애니메이션 */ #character_top .character_animation{display:block; width:100%; height:800px; margin:0 auto 0 auto; padding:0; background-color:#dadbde; border:1px solid #333} #character_top .character_animation img{width:50%} /* 캐릭터 영상 이미지 */ #character_top .character_video_img{padding:0; width:90%; background:url('/static/images/company/jiransecurity_character_video_m.svg') no-repeat center center; background-size:cover; height:320px; margin:0 auto 0 auto} /* 캐릭터 영상 */ #character_top .character_video{display:block; width:100%; height:320px; margin:30px auto 45px auto; text-align:center} #character_top .character_video video{width:100%; height:auto; box-sizing:border-box} /* 캐릭터 스토리 */ .js_chr{display:block; width:100%; min-width:100%; margin:0 auto; box-sizing:border-box} .js_chr .chr_story{width:90%; margin:0 auto} .js_chr .chr_story h2{display:block; font-size:24px; margin-top:40px; font-weight:700; letter-spacing:-1px; color:#111; text-align:left; line-height:36px} .js_chr .chr_story p.chr_txt{margin-top:25px; font-size:15px; line-height:26px; color:#555; text-align:left; letter-spacing:-1px} .js_chr .chr_story p.chr_txt span{display:inline} .js_chr .chr_story .chr_story_img{display:block; width:100%; margin:25px auto 0 auto; text-align:center; box-sizing:border-box} .js_chr .chr_story .chr_story_img img{width:100%; height:320px; margin:0 auto} /* 버디즈 세상 */ #character_world{position:relative; z-index:10; width:100%; margin:-65px auto 0 auto; word-break: keep-all; text-align: center;} #character_world .js_chr_buddies{display:block; width:100%; height:530px; margin:0 auto; background:url('/static/images/company/img_buddies_world.svg') no-repeat center bottom; background-size:155% auto} #character_world .js_chr_buddies .js_buddies{display:inline-block; width:90%;} #character_world .js_chr_buddies .js_buddies h2{display:inline-block; font-size:24px; margin-top:70px; font-weight:700; letter-spacing:-1px; text-align:left; color:#111; line-height:36px} #character_world .js_chr_buddies .js_buddies p.js_buddies_txt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} #character_world .js_chr_buddies .js_buddies p.js_buddies_txt span{display:block} #character_world .js_chr_buddies .js_buddies .buddies_img{display:block; width:100%; margin:40px auto 0 auto; text-align:center; box-sizing:border-box} #character_world .js_chr_buddies .js_buddies .buddies_img img{width:20%; height:auto; margin:0 auto} #character_world .character{display:block; width:1280px; height:240px; margin:0 auto; text-align:center; opacity:0.9} #character_world .character h2{display:inline-block; margin:80px auto 0 auto; color:#111; font-size:3.000em; font-weight:700; letter-spacing:-2px} #character_world .character .character_subtit_desc{margin:20px 0 0; color:#555; font-size:1.125em; line-height:2.000em; letter-spacing:-1px} #character_world .character .character_subtit_desc>span{display:inline} #character_world .js_character{display:inline-block; width:100%; min-width:280px; height:auto; margin:0 auto; padding-bottom:40px; background-image: linear-gradient(to bottom, #FFFdd9 87%,#FFF8C0 20%); box-sizing:border-box} /* 캐릭터 타입 */ .js_chr_type{display:block; width:90%; margin:0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_chr_type h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-1px; text-align:left; color:#111} .js_chr_type .chr_type_img{display:inline-block; margin:20px 0 0 0; text-align:center; line-height:38px;} .js_chr_type .chr_type_img span img{display:inline-block; margin-top:10px; margin-right:10px; width:47%} .js_chr_type .chr_type_img span img:last-child{margin-right:0} .js_chr_type .chr_type_img span img:nth-child(even){margin-right:0} /* 버디즈 멤버 */ .js_chr_members{display:block; width:100%; margin:0 auto; text-align:center} .js_chr_members .js_members{display:inline-block; width:90%;} .js_chr_members .js_members h2{display:block; font-size:24px; margin-top:70px; font-weight:700; letter-spacing:-1px; text-align:left; color:#111} .js_chr_members .js_members p.js_members_txt{width:100%; margin-top:35px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_chr_members .js_members p.js_members_txt span{display:block} .js_chr_members .js_members .members_img{display:block; width:100%; height:auto; margin:40px auto 0 auto; text-align:center; box-sizing:border-box} .js_chr_members .js_members .members_img>img{width:45%; height:auto; margin:0 auto} .js_chr_members .js_members .members_img_tit{display:block; width:100%; height:auto; margin:65px auto 0 auto; text-align:left; box-sizing:border-box} .js_chr_members .js_members .members_img_tit>img{width:55%; height:auto; margin:0 auto} .js_chr_members .js_members .members_img_tit .w60{width:90%} .js_chr_members p.js_members_txt{width:90%; margin:26px auto 0 auto; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_chr_members p.js_members_txt span{display:block} .js_chr_members p.js_members_txt_m{display:block; margin-top:26px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_chr_members p.js_members_txt_m span{display:block} /* 캐릭터 영상 */ .character_video{display:block; width:100%; height:460px; margin:40px auto 0 auto; text-align:center} .character_video video{width:460px; height:auto; box-sizing:border-box} .character_video p{margin-top:20px; font-size:12px; color:#555; letter-spacing:-1px; text-align:center} .character_video_2{display:inline-block; float:none; width:320px; height:320px; margin:0 auto; text-align:center} .character_video_2 video{width:320px; height:auto; box-sizing:border-box} .character_video_2 p{margin-top:20px; font-size:12px; color:#555; letter-spacing:-1px; text-align:center} /* 반응형 캐릭터 영상 */ @media screen and (max-width:768px) { .character_video{height:260px; margin:50px auto 10px auto} .character_video video{width:230px; height:auto} } .js_chr_members .js_members_info{display:inline-block; width:90%; margin:15px auto 0 auto} .js_chr_members .js_members_info .js_members_dani{float:left; width:100%; text-align:left} .js_chr_members .js_members_info .js_members_dani>img{text-align:left; width:20%} .js_chr_members .js_members_info .js_members_dani>p{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px} .js_chr_members .js_members_info .js_members_dani>p span{display:block} .js_chr_members .js_members_info .js_members_tany{float:left; width:100%; margin-top:50px; text-align:left} .js_chr_members .js_members_info .js_members_tany>img{text-align:left; width:20%} .js_chr_members .js_members_info .js_members_tany>p{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px} .js_chr_members .js_members_info .js_members_tany>p span{display:block} .character_hash{display:inline !important; margin-top:20px; padding:6px 16px; color:#333; font-size:14px; border:1px solid #ddd; border-radius:20px} .js_chr_members .js_members_info_snd{display:inline-block; width:90%; margin:30px auto 0 auto} .js_chr_members .js_members_snd{float:left; width:100%; text-align:left} .js_chr_members .js_members_snd ul{margin-top:20px} .js_chr_members .js_members_snd ul:first-child{margin-top:10px} .js_chr_members .js_members_snd ul li{display:inline-block} .js_chr_members .js_members_snd ul li>img{text-align:left; width:auto; height:25px; vertical-align:super} .js_chr_members .js_members_snd ul li p{margin-left:20px; text-align:left; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px} .js_info_2depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_2depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .js_info_2depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_2depth p.js_infotxt span{display:inline} .js_info_2depth img{display:block; margin:50px auto 0 auto; width:90%; height:90%; text-align:center} .js_info_2depth button{display:block; margin:70px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_2depth .info_value dl{margin-top:20px; text-align:center} .js_info_2depth .info_value dl dd{display:inline-block; width:auto; margin-top:30px} .js_info_2depth .info_value dl dd ul{margin:0 auto; width:155px} .js_info_2depth .info_value dl dd ul li{font-size:13px; line-height:20px; letter-spacing:-1px; text-align:center; color:#555} .js_info_2depth .info_value dl dd ul li span{display:inline} .js_info_2depth .info_value dl dd ul li.value_01{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_01@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_02{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_02@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_03{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_03@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_2depth .info_value dl dd ul li.value_04{display:inline-block; padding-bottom:15px; width:50%; height:120px; background:url('/static/images/company/ico_companyinfo_value_04@2x.png') no-repeat center top/100%; font-weight:700; font-size:18px; line-height:210px; letter-spacing:-2px; text-align:center; color:#282828} .js_info_3depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_3depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .js_info_3depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_3depth p.js_infotxt span{display:inline} .js_info_3depth button{display:block; margin:40px auto 0 auto; padding:0; width:180px; height:50px; color:#fff; font-weight:500; font-size:16px; line-height:24px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .js_info_3depth .info_culture{text-align:center} .js_info_3depth .info_culture span.culture_img img{display:inline-block; margin-top:10px; margin-right:10px; width:47%} .js_info_3depth .info_culture span.culture_img img:last-child{margin-right:0} .js_info_3depth .info_culture span.culture_img img:nth-child(even){margin-right:0} .js_info_4depth{display:block; width:90%; margin:120px auto 0 auto; padding:0 16px; word-break:keep-all; text-align:center} .js_info_4depth h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .js_info_4depth p.js_infotxt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left} .js_info_4depth p.js_infotxt span{display:inline} .js_info_4depth img{display:block; margin:40px auto 40px auto; width:70%; text-align:center} .js_info_4depth .ci_btn{display:block; text-align:center} .js_info_4depth .ci_btn button{display:inline-block; margin:0 3px; width:155px; height:50px; color:#ff7f00; font-weight:500; font-size:16px; line-height:32px; letter-spacing:-1px; border:1px solid #ff7f00; box-sizing:border-box; text-align:center} .js_info_4depth .ci_btn button a{color:#ff7f00; text-decoration:auto} /* 연혁 & 수상및인증 */ #history_top{position:relative; z-index:10; width:100%; height:auto; margin:70px auto 0 auto; word-break:keep-all; text-align:center} #history_top .top_info{display:block; width:100%; height:auto; margin:0 auto; padding:0 16px; text-align:center; opacity:0.9; box-sizing:border-box} #history_top .top_info h2{display:inline-block; margin:35px auto 0 auto; color:#111; font-size:2.125em; font-weight:700; letter-spacing:-1px} #history_top .top_info .subtit_desc{margin:20px auto 50px auto; color:#555; font-size:1.000em; line-height:1.625em; letter-spacing:-1.5px} #history_top .top_info .subtit_desc>span{display:block} #history_top .js_top_info, #history_top .js_top_info2{float:none; display:inline-block; width:100%; min-width:100%; height:230px; margin:30px auto 0 auto; padding:60px 0 0 0; box-sizing:initial; text-align:center; background:url('/static/images/company/bg_history3.png') repeat left top} #history_top .js_top_info .history_top, #history_top .js_top_info2 .certification_top{width:100%; display:inline-block; height:auto; margin:0 auto; background:none} #history_top .js_top_info .history_top .history_top_left, #history_top .js_top_info2 .certification_top .certification_top_left{float:left; width:auto; height:auto; margin:0; text-align:left; background:url('/static/images/company/bg_history_m.png') no-repeat right top; padding:0 20px 50px 20px; box-sizing:border-box; background-color:rgba(255,248,242,1)} #history_top .js_top_info .history_top .history_top_left h2, #history_top .js_top_info2 .certification_top .certification_top_left h2{display:block; font-size:24px; line-height:36px; margin-top:0; font-weight:700; letter-spacing:-2px; word-break:keep-all; color:#111} #history_top .js_top_info .history_top .history_top_left h2 span{width:170px} #history_top .js_top_info2 .certification_top .certification_top_left h2 span{width:200px} #history_top .js_top_info .history_top .history_top_left p.history_txt, #history_top .js_top_info2 .certification_top .certification_top_left p.history_txt{margin-top:20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; word-break:keep-all} #history_top .js_top_info .history_top .history_top_left p.history_txt span, #history_top .js_top_info2 .certification_top .certification_top_left p.history_txt span{display:inline} #history_top .js_top_info .history_top .history_top_right, #history_top .js_top_info2 .certification_top .certification_top_right{width:100%; padding:50px 20px; box-sizing:border-box} #history_top .js_top_info .history_top .history_top_right dl, #history_top .js_top_info .history_top .history_top_right dl:last-of-type, #history_top .js_top_info2 .certification_top .certification_top_right dl, #history_top .js_top_info2 .certification_top .certification_top_right dl:last-of-type{padding:5px 0 20px} #history_top .js_top_info .history_top .history_top_right dl:before, #history_top .js_top_info2 .certification_top .certification_top_right dl:before{top:20px; bottom:-15px} #history_top .js_top_info .history_top .history_top_right dl:after, #history_top .js_top_info2 .certification_top .certification_top_right dl:after{left:1px; top:15px; width:5px; height:5px} #history_top .js_top_info .history_top .history_top_right dl .month, #history_top .js_top_info2 .certification_top .certification_top_right dl .month{margin:0 0 8px} #history_top .js_top_info .history_top .history_top_right dl dt, #history_top .js_top_info2 .certification_top .certification_top_right dl dt{margin-left:15px; width:60px; line-height:24px; font-weight:500; font-size:15px; color:#333} #history_top .js_top_info .history_top .history_top_right dl dd, #history_top .js_top_info2 .certification_top .certification_top_right dl dd{margin-left:88px; font-size:15px; line-height:24px; letter-spacing:-1px; color:#555; width:70%} #history_top .js_top_info .history_top .history_top_right dl dt.js_color, #history_top .js_top_info2 .certification_top .certification_top_right dl dt.js_color{color:#ff7f00} #history_top .js_top_info .history_top .history_top_right dl dd span, #history_top .js_top_info2 .certification_top .certification_top_right dl dd span{display:inline} /*인재채용 상단*/ #recruitment_top{position:relative; z-index:10; width:100%; height:auto; max-width:auto; margin:70px auto 0 auto; word-break:keep-all; text-align:center} #recruitment_top .top_info{display:block; width:100%; height:220px; margin:0 auto; text-align:center; opacity:0.9} #recruitment_top .top_info h2{display:inline-block; margin:40px auto 0 auto; color:#111; font-size:34px; font-weight:700; letter-spacing:-2px} #recruitment_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:16px; line-height:26px; letter-spacing:-1px} #recruitment_top .top_info .subtit_desc>span{display:inline} #recruitment_top .recruitment_top_info{display:inline-block; width:100%; min-width:auto; height:auto; margin:0 auto; padding:10px 0; background:#fff7f0; box-sizing:border-box} #recruitment_top .recruitment_top_info .recruitment_info{width:100%; height:auto; margin:0 auto; background:#fff7f0} #recruitment_top .recruitment_top_info .recruitment_info h2{display:block; font-size:24px; line-height:36px; padding:0 20px; margin:50px auto; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} #recruitment_top .recruitment_top_info .recruitment_info h2 span{display:inline-block; margin-top:5px} #recruitment_top .recruitment_top_info .recruitment_info p.recruitment_infotxt{margin-top:5px; padding:0 20px 50px 20px; font-size:15px; line-height:26px; color:#555; letter-spacing:-1px; text-align:left; word-break:normal} #recruitment_top .recruitment_top_info .recruitment_info p.recruitment_infotxt span{display:block} #recruitment_top .recruitment_top_info .recruitment_info img{display:none} #recruitment_top .recruitment_top_info .recruitment_info button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_2depth{display:inline-block; width:100%; margin:50px auto 60px auto; word-break:keep-all; padding:0 20px; box-sizing:border-box} .recruitment_info_2depth h2{display:block; font-size:24px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .recruitment_info_2depth p.js_infotxt{margin:20px auto 40px auto; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} .recruitment_info_2depth p.js_infotxt span{display:block} .recruitment_info_2depth img{display:block; margin:50px auto 0 auto; width:100%; height:100%; text-align:center} .recruitment_info_2depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_3depth{display:inline-block; width:100%; margin:80px 0; padding:0 20px 80px 20px; word-break:keep-all; background:linear-gradient(to top, #f5f6f8 0%, white 50%, white 100%); box-sizing:border-box} .recruitment_info_3depth h2{display:block; font-size:24px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .recruitment_info_3depth p.js_infotxt{margin:20px auto 40px auto; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} .recruitment_info_3depth p.js_infotxt span{display:block} .recruitment_info_3depth img{display:block; margin:50px auto 0 auto; width:80%; height:80%; text-align:center} .recruitment_info_3depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_4depth{display:inline-block; width:100%; margin:0 auto; padding:0 20px 20px 20px; word-break:keep-all; box-sizing:border-box} .recruitment_info_4depth h2{display:block; font-size:24px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .recruitment_info_4depth p.js_infotxt{margin:20px auto 40px auto; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} .recruitment_info_4depth p.js_infotxt span{display:block} .recruitment_info_4depth img{display:block; margin:50px auto 0 auto; width:100%; height:100%; text-align:center} .recruitment_info_4depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_4depth .info_benefit{padding:0; box-sizing:border-box; display:inline-block} .recruitment_info_4depth .info_benefit .benefit{margin-top:10px; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap} .recruitment_info_4depth .info_benefit .benefit > li{width:-webkit-calc(100% / 3); width:calc(100% / 3); margin:0 auto 30px auto; text-align:center} .recruitment_info_4depth .info_benefit ul li p{font-weight:400; text-align:center; color:#333} .recruitment_info_4depth .info_benefit ul li .benefit_txt span{display:inline-block; vertical-align:top; font-size:14px; line-height:1.3571; letter-spacing:-0.5px} .recruitment_info_4depth .info_benefit ul li .icon{display:block; width:100%; height:70px; margin-bottom:15px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_01{background:url('/static/images/company/ico_recruit_benefit_01@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_02{background:url('/static/images/company/ico_recruit_benefit_02@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_03{background:url('/static/images/company/ico_recruit_benefit_03@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_04{background:url('/static/images/company/ico_recruit_benefit_04@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_05{background:url('/static/images/company/ico_recruit_benefit_05@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_06{background:url('/static/images/company/ico_recruit_benefit_06@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_07{background:url('/static/images/company/ico_recruit_benefit_07@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_08{background:url('/static/images/company/ico_recruit_benefit_08@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_09{background:url('/static/images/company/ico_recruit_benefit_09@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_10{background:url('/static/images/company/ico_recruit_benefit_10@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_11{background:url('/static/images/company/ico_recruit_benefit_11@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_12{background:url('/static/images/company/ico_recruit_benefit_12@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_13{background:url('/static/images/company/ico_recruit_benefit_13@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_14{background:url('/static/images/company/ico_recruit_benefit_14@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_15{background:url('/static/images/company/ico_recruit_benefit_15@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_16{background:url('/static/images/company/ico_recruit_benefit_16@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_17{background:url('/static/images/company/ico_recruit_benefit_17@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_18{background:url('/static/images/company/ico_recruit_benefit_18@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_19{background:url('/static/images/company/ico_recruit_benefit_19@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_20{background:url('/static/images/company/ico_recruit_benefit_20@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_21{background:url('/static/images/company/ico_recruit_benefit_21@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_22{background:url('/static/images/company/ico_recruit_benefit_22@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_23{background:url('/static/images/company/ico_recruit_benefit_23@2x.png') no-repeat center / 56px} .recruitment_info_4depth .info_benefit ul li .icon.benefit_24{background:url('/static/images/company/ico_recruit_benefit_24@2x.png') no-repeat center / 56px} .recruitment_info_5depth{display:inline-block; width:100%; margin-top:30px; padding:80px 20px; word-break:keep-all; background:#f5f6f8; box-sizing:border-box} .recruitment_info_5depth h2{display:block; font-size:24px; font-weight:700; letter-spacing:-2px; text-align:left; color:#111} .recruitment_info_5depth p.js_infotxt{margin:20px auto 40px auto; font-size:15px; line-height:24px; color:#555; letter-spacing:-1px; text-align:left} .recruitment_info_5depth p.js_infotxt span{display:block} .recruitment_info_5depth img{display:block; margin:40px auto 40px auto; width:70%; text-align:center} .recruitment_info_5depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .recruitment_info_5depth .recruitment_step{text-align:center; padding:0 20px; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd{display:inline-block; margin:60px auto 0 auto; width:100%; height:100%; background:#fff} .recruitment_info_5depth .recruitment_step dd:first-child{margin-left:0; margin-top:0px} .recruitment_info_5depth .recruitment_step dd dl{text-align:center; width:100%; padding:50px 0; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul{margin:0 auto} .recruitment_info_5depth .recruitment_step dd dl ul li{font-weight:700; font-size:28px; line-height:42px; letter-spacing:-1px; text-align:center; color:#282828} .recruitment_info_5depth .recruitment_step dd dl ul li:first-child{font-weight:400; color:#ff7f00; font-size:18px; line-height:36px} .recruitment_info_5depth .recruitment_step dd dl ul li span{display:block} .recruitment_info_5depth .recruitment_step dd dl ul li.step_01{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step01@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul li.step_02{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step02@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_5depth .recruitment_step dd dl ul li.step_03{display:inline-block; margin-top:20px; padding-top:200px; padding-bottom:15px; height:200px; background:url('/static/images/company/img_recruit_step03@2x.png') no-repeat center top/100%; font-weight:400; font-size:16px; line-height:26px; letter-spacing:-1px; text-align:center; color:#555; box-sizing:border-box} .recruitment_info_6depth{display:inline-block; width:100%; margin-top:10px; padding:10px 20px; word-break:keep-all; box-sizing:border-box} .recruitment_info_6depth p.js_infotxt{margin:20px auto 40px auto; font-size:18px; line-height:36px; color:#555; letter-spacing:-1px; text-align:center} .recruitment_info_6depth p.js_infotxt span{display:block; width:110px; height:38px; border:1px solid #f0f0f2; border-radius:50px; margin:0 auto; text-align:center} .js_img{display:block !important; width:100%; text-align:center; margin:0 auto} /*다이렉트문의*/ #direct_top{position:relative; z-index:10; width:100%; height:auto; max-width:auto; margin:70px auto 0 auto; word-break:keep-all; text-align:center} #direct_top .top_info{display:block; width:100%; height:190px; margin:0 auto; text-align:center; opacity:0.9} #direct_top .top_info h2{display:inline-block; margin:35px auto 0 auto; color:#111; font-size:34px; font-weight:700; letter-spacing:-1px} #direct_top .top_info .subtit_desc{margin:20px 0 0; color:#555; font-size:16px; line-height:26px; letter-spacing:-1.5px} #direct_top .top_info .subtit_desc>span{display:block} .direct_info_2depth{display:inline-block; width:100%; margin:30px auto 0 auto; word-break:keep-all; padding:0 20px; box-sizing:border-box} .direct_info_2depth h2{display:block; font-size:24px; font-weight:700; letter-spacing:-2px; text-align:center; color:#111} .direct_info_2depth p.js_infotxt{margin:10px auto 0 auto; font-size:15px; line-height:24px; color:#959595; letter-spacing:-1px; text-align:center} .direct_info_2depth p.js_infotxt span{display:block} .direct_info_2depth button{display:block; margin:70px auto 0 auto; padding:17px 62px; width:270px; height:66px; color:#fff; font-size:18px; line-height:32px; letter-spacing:-1px; background:#ff7f00; box-sizing:border-box; text-align:center} .direct_info_2depth .direct_products{display:inline-block; width:100%; margin:0 auto; padding:0; word-break:keep-all; text-align:center; box-sizing:border-box} .direct_info_2depth .direct_products dl{margin-top:0} .direct_info_2depth .direct_products dl:first-child{margin-top:30px} .direct_info_2depth .direct_products dl dd{display:inline-block; float:none; width:280px; margin:20px; border:1px solid #f0f0f1; text-align:center} .direct_info_2depth .direct_products dl dd:last-child{margin:20px} .direct_info_2depth .direct_products dl dd ul{margin:0 auto; /* width:200px; */height:310px; box-sizing:border-box} .direct_info_2depth .direct_products dl dd ul li{font-size:16px; line-height:26px; text-align:center; color:#555} .direct_info_2depth .direct_products dl dd ul li.product_bi{height:160px; background:#fafafa; border-bottom:1px solid #f0f0f1} .direct_info_2depth .direct_products dl dd ul li.product_bi img{text-align:center; margin-top:67px} .direct_info_2depth .direct_products dl dd ul li.product_name{margin-top:35px; font-weight:700; font-size:20px; line-height:29px; letter-spacing:-1px; color:#282828} .direct_info_2depth .direct_products dl dd ul li.mail a{color:#ff7f00} .direct_info_2depth .direct_products dl dd.ir ul{height:155px} .direct_info_2depth .direct_products dl dd.ir ul li{font-size:16px; line-height:30px; text-align:center; color:#555} .direct_info_2depth .direct_products dl dd.ir ul li.ir_name{margin-top:0; font-weight:700; font-size:20px; line-height:64px; letter-spacing:-1px; color:#282828} /*다이렉트문의 기술문의*/ .direct_info_2depth .direct_tech{display:inline-block; margin-top:20px} .direct_info_2depth .direct_tech .tech_tel{display:block; margin-top:40px; font-weight:700; font-size:28px; color:#282828; text-align:center} .direct_info_2depth .direct_tech .tech_tel a, .direct_info_2depth .direct_tech .tech_tel a:hover{text-decoration:none} .direct_info_2depth .direct_tech .tech_tel img{width:8%; height:auto; vertical-align:bottom} .direct_info_2depth .direct_tech .tech_part{display:inline-block; width:100%; margin-top:50px} .direct_info_2depth .direct_tech .tech_part .tech_sanitox{float:left; display:block; width:100%; height:auto; margin:20px auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part .tech_pylon{float:left; display:block; width:100%; height:auto; margin:20px auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part .tech_cmg{float:left; display:block; width:100%; height:auto; margin:20px auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part .tech_docu{float:left; display:block; width:100%; height:auto; margin:20px auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part .tech_mobile{float:left; display:block; width:100%; height:auto; margin:20px auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part .tech_mail{float:left; display:block; width:100%; height:auto; margin:0 auto; padding:25px 20px; border:1px solid #f0f0f2; box-sizing:border-box; background:none} .direct_info_2depth .direct_tech .tech_part span{display:block} .direct_info_2depth .direct_tech .tech_part span:first-child{margin-bottom:0px} .direct_info_2depth .direct_tech .tech_part span p{display:inline-block; font-size:16px; line-height:24px; letter-spacing:-1px; color:#555} .direct_info_2depth .direct_tech .tech_part span .part_name{display:block; font-weight:500; font-size:18px; line-height:29px; letter-spacing:-1px; color:#555; margin-bottom:10px} .direct_info_2depth .direct_tech .tech_part span .part_tel{font-weight:700; height:28px; font-size:30px; line-height:26px; letter-spacing:-1px; vertical-align:bottom; color:#282828} .direct_info_2depth .direct_tech .tech_part span .part_number{float:left; width:110px; height:28px; margin:0 0 10px 0; background:#ff7f00; border-radius:6px; font-weight:500; font-size:14px; line-height:26px; letter-spacing:-1px; color:#fff; text-align:center} .direct_info_2depth .direct_tech .tech_part span .part_mail a{font-size:16px; line-height:26px; letter-spacing:0; color:#ff7f00 !important} /* 제품문의*/ .inquiry{display:block; width:100%} .inquiry_title{display:inline-block; width:100%; margin-top:15px; text-align:center} .inquiry_title h2{font-size:27px; font-weight:700; line-height:42px; color:#ff7f00; letter-spacing:-1px} .inquiry_title h3{font-size:27px; font-weight:700; line-height:42px; color:#282828; letter-spacing:-1px} .inquiry_title p{font-size:16px; line-height:32px; color:#959595; letter-spacing:-1px} .inquiry_step01 .inquiry_info{display:inline-block; margin-top:40px} .inquiry_step01 .inquiry_info dl{display:block; float:left; width:600px; margin-left:40px; margin-bottom:30px} .inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:164px; height:auto; background:#fff; line-height:32px} .inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px} .inquiry_step01 .inquiry_info dl dd{float:left; width:510px; height:auto; line-height:32px} .inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:12px} .inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 470px 10px; background-size:24px 24px} .inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step02{display:inline-block; margin-top:100px} .inquiry_step02 .inquiry_solution{display:inline-block; margin-top:40px} .inquiry_step02 .inquiry_solution dl{display:block; float:left; width:213px} .inquiry_step02 .inquiry_solution dl dd .solution_tit li{display:inline-block; width:100%; height:70px; line-height:70px; border-top:1px solid #d8d8d8; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; background-color:#f5f6f8; font-size:16px; font-weight:700; color:#555; text-align:center; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod{display:block; height:140px; padding:20px 0 0 20px; border-right:1px solid #d8d8d8; border-bottom:1px solid #d8d8d8; font-size:16px; color:#999; text-align:left; line-height:32px; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{cursor:pointer} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{cursor:pointer} /*.inquiry_step02 .inquiry_solution .rdo{display:inline-block; background:#fff; margin-right:8px; box-sizing:border-box}*/ .inquiry_step02 .inquiry_solution input[type="radio"]{display:none} .inquiry_step02 .inquiry_solution input[type="radio"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/radio-20-off@2x.png') no-repeat left top/ 22px 22px} .inquiry_step02 .inquiry_solution input[type="radio"]:checked + label{background-image:url('/static/images/common/radio-20-on@2x.png')} .inquiry_step02 .inquiry_solution dl dd .bRnone{border-right:0 !important} .inquiry_step03{display:inline-block; margin-top:100px; width:100%} .inquiry_step03 textarea{display:inline-block; margin-top:40px; width:1280px; height:470px; padding:20px; border:1px solid #dadbde; box-sizing:border-box; font-size:16px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; word-break:keep-all} .inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .inquiry_step03 .agree_chk p span a{color:#ff7f00} .inquiry_step_btn{display:inline-block; width:100%; margin:100px auto 0 auto} .inquiry_step_btn button{display:block; width:270px; height:66px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup{display:inline-block; position:absolute; width:960px; height:520px; top:calc(50vh - 280px); left:calc(50vw - 510px); margin:25px auto; padding:40px; background:#fff; box-sizing:border-box; border-radius:12px} .agree_popup h3{display:inline-block; font-size:22px; font-weight:700; color:#282828; letter-spacing:-1px} .agree_popup .text_box{display:inline-block; width:100%; height:330px; margin-top:20px; padding:30px; font-size:14px; line-height:24px; border:1px solid #dadbde; box-sizing:border-box; overflow:auto} .agree_popup .text_box .text_inbox{display:inline-block; text-align:left} .agree_popup .text_box .text_inbox p{font-size:14px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:lighter; letter-spacing:-1px; word-break:keep-all} .agree_popup .text_box .text_inbox p .stxt{display:block; margin-left:20px; margin-bottom:20px; font-size:14px; line-height:24px} .agree_popup .text_box .text_inbox a{color:#f08300; text-decoration:underline} .agree_popup_btn{display:inline-block; width:100%; margin:20px auto 0 auto; text-align:center} .agree_popup_btn button{display:inline-block; width:270px; height:56px; margin:0 auto; font-size:16px; font-weight:700; line-height:26px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup .agree_box{margin-top:13px; padding:17px 20px; background:#fff; border:1px solid #ddd; font-size:14px; line-height:20px} .agree_popup .agree_box p.tit{margin-top:20px; font-weight:700} .agree_popup .agree_box p:first-child{margin-top:0} .agree_table{border-spacing:0; border-collapse:collapse; width:100%; margin-top:20px; padding:0; border:0} .agree_table tr{font-size:14px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; letter-spacing:-1px; word-break:keep-all} .agree_table tr th{border-top:2px solid #dadbde; border-right:1px solid #dadbde; border-bottom:1px solid #dadbde; padding:10px 0; color:#282828; background:#f5f6f8; text-align:center; box-sizing:border-box} .agree_table tr td{border-right:1px solid #dadbde; border-bottom:1px solid #dadbde; padding:10px; text-align:left; margin-left:20px; box-sizing:border-box} .agree_table tr th:first-child{width:20%; text-align:center} .agree_table tr th:last-child{width:40%; border-right:0 none} .agree_table tr td:last-child{border-right:0 none} .agree_table tr td span{display:block} .down_agree_popup{display:inline-block; position:absolute; width:90%; height:85%; top:calc(50vh - 350px); left:calc(50vw - 170px); margin:20px auto; padding:20px; background:#fff; box-sizing:border-box; border-radius:12px; overflow-y:scroll} .down_agree_popup h3{display:inline-block; font-size:27px; font-weight:700; color:#282828; letter-spacing:-1px} .down_pop{display:inline-block; width:100%; height:350px; margin-top:20px; padding:10px 30px; font-size:16px; line-height:32px; border:1px solid #dadbde; box-sizing:border-box; overflow:auto} .down_inquiry_title{display:inline-block; margin-top:40px; width:100%; text-align:center} .down_inquiry_title h2{font-size:22px; font-weight:700; line-height:42px; color:#ff7f00; letter-spacing:-1px} .down_inquiry_title h3{font-size:22px; font-weight:700; line-height:42px; color:#282828; letter-spacing:-1px} .down_inquiry_title p{font-size:16px; line-height:32px; color:#959595; letter-spacing:-1px} .down_inquiry_step01{display:inline-block; margin-top:30px; width:100%} .down_inquiry_step01 .inquiry_info{display:inline-block; margin-left:0} .down_inquiry_step01 .inquiry_info dl{display:block; float:left; width:100%; margin-left:0; margin-bottom:10px} .down_inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:164px; height:auto; background:#fff; line-height:32px; text-align:left} .down_inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px; text-align:left} .down_inquiry_step01 .inquiry_info dl dd{float:left; width:100%; height:auto; line-height:32px} .down_inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:12px} .down_inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .down_inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 470px 10px; background-size:24px 24px} .down_inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .down_inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .down_inquiry_step03{display:inline-block; margin-top:20px; margin-left:0; width:100%; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; font-weight:500; letter-spacing:-1px; word-break:keep-all} .down_inquiry_step03 .agree_chk{display:inline-block; margin-top:14px; text-align:left} .down_inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .down_inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .down_inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .down_inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .down_inquiry_step03 .agree_chk p span a{color:#ff7f00} .down_inquiry_step_btn{display:inline-block; width:100%; margin:40px auto 0 auto} .down_inquiry_step_btn button{display:block; width:240px; height:56px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .btn_closed {display:block; position:absolute; float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} .search_btn_closed{display:block; /*position:absolute; */float:right; top:30px; right:4%; width:33px; height:33px; background:url('/static/images/common/ico_search_txt_del@2x.png') no-repeat 0 0 / 100%} .culture{margin-top:48px} .character{margin-top:48px} /* hide */ .view_pc{display:none !important} .view_pc_db{display:none !important} .view_mo{display:inline-block !important} .view_mo_db{display:block !important} .inquiry{display:block; width:100%} .inquiry_title{display:inline-block; width:100%; margin-top:50px; text-align:center} .inquiry_title h2{font-size:24px; font-weight:700; line-height:36px; color:#ff7f00; letter-spacing:-1px} .inquiry_title h3{font-size:24px; font-weight:700; line-height:36px; color:#282828; letter-spacing:-1px} .inquiry_title p{font-size:14px; line-height:24px; color:#959595; letter-spacing:-1px} .inquiry_step01 .inquiry_info{display:inline-block; margin-top:40px; margin-left:0} .inquiry_step01 .inquiry_info dl{display:block; float:left; width:100%; margin-left:0; margin-bottom:30px} .inquiry_step01 .inquiry_info dl:last-child{margin-bottom:0} .inquiry_step01 .inquiry_info dl dt{display:block; float:left; width:100%; height:auto; background:#fff; line-height:32px} .inquiry_step01 .inquiry_info dl dt span{display:block; font-size:15px; font-weight:700; line-height:32px} .inquiry_step01 .inquiry_info dl dd{float:left; width:100%; height:auto; line-height:32px} .inquiry_step01 .inquiry_info dl dd ::-webkit-input-placeholder{color:#777; font-size:12px} .inquiry_step01 .inquiry_info dl dd input{width:100%; height:50px; margin:0 auto; padding:8px; font-size:1.000em; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box} .inquiry_step01 .inquiry_info dl dd input:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select{width:100%; height:50px; margin:0 auto; padding:8px; font-size:14px; background-color:#fff; border:1px solid #dadbde; border-radius:4px; box-sizing:border-box; background:url('/static/images/common/ico-select-arrow@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step01 .inquiry_info dl dd select:focus{outline:none !important; border-color:#ff7f00} .inquiry_step01 .inquiry_info dl dd select:after{background:url('/static/images/common/ico-select-arrow_close@2x.png') no-repeat 97% 10px; background-size:24px 24px} .inquiry_step02{display:inline-block; margin-top:20px} .inquiry_step02 .inquiry_solution{display:inline-block; margin-top:40px; width:100%} .inquiry_step02 .inquiry_solution dl{display:block; float:left; width:100%} .inquiry_step02 .inquiry_solution dl dd .solution_tit li{display:inline-block; width:100%; height:50px; line-height:50px; border-top:1px solid #d8d8d8; border-right:none; border-bottom:1px solid #d8d8d8; background-color:#f5f6f8; font-size:16px; font-weight:700; color:#555; text-align:center; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod{display:inline-block; height:auto; padding:20px 0 20px 20px; border-right:none; border-bottom:none; font-size:16px; color:#999; text-align:left; line-height:32px; letter-spacing:-1px; box-sizing:border-box} .inquiry_step02 .inquiry_solution dl dd .solution_prod li{float:left; margin-right:20px} .inquiry_step02 .inquiry_solution dl dd .solution_prod li label{width:110px; cursor:pointer; font-size:14px; letter-spacing:-1px} .inquiry_step02 .inquiry_solution dl:last-child{border-bottom:1px solid #d8d8d8} /*.inquiry_step02 .inquiry_solution .rdo{display:inline-block; background:#fff; margin-right:8px; box-sizing:border-box}*/ .inquiry_step02 .inquiry_solution input[type="radio"]{display:none} .inquiry_step02 .inquiry_solution input[type="radio"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/radio-20-off@2x.png') no-repeat left top/ 22px 22px} .inquiry_step02 .inquiry_solution input[type="radio"]:checked + label{background-image:url('/static/images/common/radio-20-on@2x.png')} .inquiry_step02 .inquiry_solution dl dd .bRnone{border-right:0 !important} .inquiry_step03{display:inline-block; margin-top:50px; width:100%} .inquiry_step03 textarea{display:inline-block; margin-top:40px; width:100%; height:470px; padding:20px; border:1px solid #dadbde; box-sizing:border-box; font-size:16px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:400; word-break:keep-all} .inquiry_step03 .agree_chk{display:inline-block; margin-top:14px} .inquiry_step03 .agree_chk input[type="checkbox"]{display:none} .inquiry_step03 .agree_chk input[type="checkbox"] + label{display:inline-block; cursor:pointer; line-height:22px; padding-left:30px; background:url('/static/images/common/checkbox-20-off@2x.png') no-repeat left 2px/ 22px 22px} .inquiry_step03 .agree_chk input[type="checkbox"]:checked + label{background:url('/static/images/common/checkbox-20-on@2x.png') no-repeat left 2px/ 22px 22px; color:#fff} .inquiry_step03 .agree_chk p{display:inline-block; margin-left:1px; line-height:24px; color:#555} .inquiry_step03 .agree_chk p span a{color:#ff7f00} .inquiry_step_btn{display:inline-block; width:100%; margin:5 0px auto 0 auto} .inquiry_step_btn button{display:block; width:270px; height:66px; margin:0 auto; font-size:18px; font-weight:700; line-height:32px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup{display:inline-block; position:absolute; width:95%; height:auto; top:calc(50vh - 375px); left:calc(50vw - 178px); margin:40px auto; padding:30px; background:#fff; box-sizing:border-box; border-radius:12px} .agree_popup h3{display:inline-block; font-size:27px; font-weight:700; color:#282828; letter-spacing:-2px; word-break:keep-all} .agree_popup .text_box{display:inline-block; width:100%; height:440px; margin-top:30px; padding:20px; font-size:18px; line-height:32px; border:1px solid #dadbde; box-sizing:border-box} .agree_popup .text_box p{font-size:12px; line-height:24px; font-family:'NotoSansKR','AppleGothic','맑은 고딕','돋움',Dotum,sans-serif; color:#959595; font-weight:lighter; letter-spacing:-1px; word-break:keep-all} .agree_popup .text_box .text_inbox p .stxt{display:block; margin-left:20px; margin-bottom:20px; font-size:14px; line-height:22px; word-break:keep-all} .agree_popup .text_box .text_inbox a{color:#f08300; text-decoration:underline} .agree_popup_btn{display:inline-block; width:100%; margin:15px auto 0 auto} .agree_popup_btn button{display:block; width:180px; height:40px; margin:0 auto; font-size:16px; font-weight:700; line-height:24px; letter-spacing:-1px; background:#ff7f00; color:#fff} .agree_popup .area_box{margin:15px 0 30px 0; padding:10px; border:1px solid #ccc} .agree_popup .area_box textarea{margin:0 !important; padding:0; width:100% !important; height:200px !important; border:0} .agree_popup .agree_box{margin-top:16px; padding:10px 10px; background:#fff; border:1px solid #ddd; font-size:13px; line-height:16px} .agree_popup .agree_box p.tit{margin-top:20px; font-weight:700} .agree_popup .agree_box p:first-child{margin-top:0} }