@charset "utf-8";

.waypoint{opacity:0;transform: translateY(100px);}
.waypoint.on{opacity:1;transform: translateY(0);transition: transform 600ms ease;}


/* layout */
#wrap {height:100%;min-height:835px;width:100%;}
#header {position: absolute;top: 0;right:0;left:0;z-index: 99999;height: 70px;background-color: transparent; border-bottom: 1px solid transparent;}
#header:hover{border-bottom: 1px solid rgba(255,255,255,.5);background-color: rgba(0,0,0,.5);}
#container {width:100%; min-height:100%; position:relative;overflow:hidden;}
#contents {width:100%;position:relative;margin:0 auto;color: #212121;}
#contents:after{content:""; clear:both; display:block;}
#footer{width:100%;position:relative;background:#fff;font-size:14px;line-height:1;padding:15px;border-top: 1px solid #ddd;}


/* header */
.header_inner{display: flex;justify-content: space-between;align-items: center;max-width:1460px;width:100%;margin: 0 auto;}
#header h1.logo{margin:0;height:70px;background: url(../images/logo.png) 10px center no-repeat;width:300px;}


#gnb {position:relative;width:calc(100% - 300px);}
#gnb > ul{ height:70px;margin:0 auto;}
#gnb > ul:after {content:""; clear:both; display:block; }
#gnb > ul > li.mb_logo{display: none;}
#gnb > ul > li {float:left; position:relative;width:calc(100%/5);}
#gnb > ul > li:last-child{background:none}
#gnb > ul > li > a {display:block;line-height:70px;font-size:20px;color:#fff;text-align:center;font-weight:400}
#gnb > ul > li > a:hover,
#gnb > ul > li.active > a{color:#95c6ff;}

#gnb > ul > li > a:after{display:block;position:absolute;top:67px;z-index:1;width:100%;width:100%;height:3px;background-color:#2f6cdd;transform:rotateY(90deg);transition:250ms ease-in-out;content:"";}
#gnb > ul > li.active > a:after,
#gnb > ul > li > a:hover:after{transform:rotateY(0);}
#gnb > ul > li .submenu{position:absolute;top:70px; z-index:98;left:0;right:0; display:none;}
#gnb > ul > li:first-child .submenu > ul{border-left:1px dotted #aaa;}
#gnb > ul > li .submenu > ul{border-right:1px dotted #aaa;height:280px;padding-top: 8px;}
#gnb > ul > li .submenu > ul > li{text-align:left;}
#gnb > ul > li .submenu > ul > li:last-child{background:none}
#gnb > ul > li .submenu > ul > li a{display:block; font-size:1rem; color:#fff; line-height:33px;position:relative;text-indent:20px}
#gnb > ul > li .submenu > ul > li a:hover,
#gnb > ul > li .submenu > ul > li a:focus{color:#95c6ff;}
#gnb > ul > li .submenu > ul > li a:before{position: absolute;top:50%;left:10px; width: 3px; height: 3px; background-color: #aaa; border-radius: 0;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}

.submenubg{ background:rgba(0,0,0,.5);position:absolute;top:70px;left:0;right:0;height:280px; z-index:-1; display:none}

.menu{width: 70px; height: 70px;background-color: transparent;background-image: url(../images/ic_menu.png);background-position: 0 0;background-repeat: no-repeat;display: none;background-size:  70px auto;}
.menu_close{width: 70px; height: 70px;background-color: transparent;background-image: url(../images/ic_menu.png);background-position: 0 -140px;background-repeat: no-repeat;background-size:  70px auto;border-left: 1px solid #ddd;}
.menu > span, .menu_close > span{display: none;}
.menu_show {overflow: hidden!important;min-height:100%!important; width: 100%;    overflow: hidden;  transform: translate3d(0,0,0);    -webkit-transform: translateZ(0); }
.gnb_show{animation: left_show 0.5s ease both;display: block!important; width: 100% !important;position: fixed!important;}
/*footer*/
.footerIn{margin:15px auto;max-width:1460px;display: flex;align-items: center;justify-content: space-between;}
.footerIn .flogo{width:240px; height: 33px;}
.footerIn select{border-radius: 50px;width:200px;padding-left: 15px;}
.txt_copyright{color:#666;line-height:1.5;max-width:1460px;margin: 0 auto;}
.fmenu{max-width:1460px;margin: 25px auto 15px;}
.fmenu:after{content:""; clear:both; display:block; }
.fmenu li{position:relative;float:left;margin-right:10px;padding-right:10px}
.fmenu li:after{position: absolute;top:1px; right: 0; width: 0px; height: 10px; background-color: #666; border-radius: 0px;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}
.fmenu li:last-child:after{width:0}
.fmenu li a{color:#333}
.fmenu li a:hover{color:#3676f7}



/*sub*/
@keyframes subVisual{to{transform:scale(1.2);}}
@-webkit-keyframes fadeUpAni{
    0%{opacity:0; transform:translate3d(0,50px,0);}
    100%{opacity:1;transform:translate3d(0,0px,0);}
}
@-webkit-keyframes opacityAni{
    0%{opacity:0; transform:translate3d(-50px,0px,0);}
    100%{opacity:1;transform:translate3d(0px,0px,0);}
}

.fade_up{opacity:0;}
.fade_up.active{animation-name: fadeUpAni; animation-duration: 1s;animation-fill-mode: forwards; }
.ani_opacity{opacity:0;}
.ani_opacity.active{animation-name: opacityAni;animation-duration: 1s; animation-fill-mode: forwards;}


.svisualbx{position: relative;overflow: hidden;}
.visual_img{background-size:cover;animation:subVisual 1.5s reverse cubic-bezier(0.4, 0, 1, 1);background-color:grey;background-repeat:no-repeat;background-position:center;position: absolute;width:100%;height: 100%;z-index: -1;}
.v_img1{background-image: url(../images/visual_img1.jpg);}
.v_img2{background-image: url(../images/visual_img2.jpg);}
.v_img3{background-image: url(../images/visual_img3.jpg);}
.v_img4{background-image: url(../images/visual_img4.jpg);}
.svisualbx .subtit{display: flex;align-items: center;height: 370px;}
.svisualbx h2{font-size:2.125rem;color:#fff;font-family:'NanumSquare';font-weight:700;width:100%;max-width: 1200px;margin: 70px auto 0;text-shadow:0 0px 2px rgba(12, 12, 12, 0.5);padding-left: 20px;}
/*.svisual01{background-image: url('');}*/

.sm_area{width:100%;}
.sm_list {height: 70px;width: 100%; max-width:1200px;margin: 0 auto;display: flex;align-items: stretch;}
.sm_list li {background:rgba(0,0,0,.6);}
.sm_list li.active {background-color: #fff;}
.sm_list li a {color:#ccc;font-size:20px;font-weight:400;height:100%;display:block;text-align:center;line-height:70px;font-weight:500;}
.sm_list li a:hover{color:#fff; background:rgba(255,255,255,.3);  }
.sm_list li.active a {color:#004bd6;}
.sm_list:after{content:""; clear:both; display:block;}

.ea2 li{width: calc(100% / 2)}
.ea3 li{width: calc(100% / 3)}
.ea4 li{width: calc(100% / 4)!important}
.ea6 li{width: calc(100% / 6)}
.ea8 li{width: calc(100% / 8)}

.sub_tabbox{height:70px;border-bottom:1px solid #ccc;font-size:0;text-align:center;z-index:9;position:relative;}
.sub_tabbox .tab_list{top:0;left:0;width:100%;height:70px;background-color:white;box-shadow:0 2px 1px rgba(12, 12, 12, 0.15);}
.sub_tabbox .tab_list.fixed{position:fixed;top:0px;z-index:9;transition:250ms ease-in-out;}
.scroll_down .sub_tabbox .tab_list.fixed{top:0;}
.sub_tabbox .tab_list li{display:inline-block;position:relative;height:100%;}
.sub_tabbox .tab_list li + li{margin-left:40px;}
.sub_tabbox .tab_list li:before{display:block;position:absolute;bottom:-2px;left:0;width:100%;height:3px;background-color:#262626;transform:rotateY(90deg);content:"";}
.sub_tabbox .tab_list li .tab_btn{display:inline-flex;justify-content:center;align-items:center;height:100%;color:#717171;font-size:20px;font-weight:500;padding: 0 5px;background-color: transparent;}
.sub_tabbox .tab_list li.active:before{transform:rotateY(0);transition:300ms ease-in-out;}
.sub_tabbox .tab_list li.active .tab_btn{color: #000;}

.ctab_list{max-width:1200px;margin: 0 auto;display: flex;align-items: stretch;flex-wrap: wrap;}
.ctab_list li{border: 1px solid #ddd;height: 55px;}
.ctab_list li.active {background-color: #0e4d90;color: #fff;}
.ctab_list li .ctab_btn{display:inline-flex;justify-content:center;align-items:center;height:100%;color:#717171;font-size:20px;font-weight:500;padding: 0 15px;background-color: transparent;}
.sub_tabbox .ctab_list li + li{margin-left:-1px;}
.ctab_list li .ctab_btn:hover{color: #0e4d90;}
.ctab_list li.active .ctab_btn{color: #fff;}

.matchbox{display:none;}
.matchbox.active{display:block;}
.ctab_content{max-width:1200px;margin: 0 auto;}

.slogan_en{font-size: 52px;font-weight: 500;color: #0e4d90;margin-bottom: 12px;line-height: 1;word-break: keep-all;}
.slogan_kr{font-size: 36px;font-weight: 400;margin-bottom: 41px;line-height: 1;}
.slogan_text{margin-bottom: 40px;}
.slogan_text p{font-size: 20px;line-height: 32px;word-break: keep-all;}
.slogan_text p + p{margin-top: 32px;}
.subject {font-size: 42px; font-weight: 500; text-align: center; margin-bottom: 27px; position: relative; line-height: 54px;}

.profilebx{background-color: #eee;padding: 80px 0;}
.profilebx .profile{display: flex;align-items: stretch;justify-content:space-between; max-width:1200px;margin: 50px auto 20px; }
.profilebx .profile img{ width: 450px; height: 100%;}
.profilebx .profile ul{font-size: 20px;line-height: 34px;text-align: left;}
.profilebx .profile ul b.ls2 {letter-spacing: 22px;}
.profilebx .profile ul b.ls3{letter-spacing: 14px;}
.profilebx .profile ul b.ls4{letter-spacing: 3px;}
.profilebx .profile ul b{display: inline-block;width:110px;color: #000;position: relative;padding-left: 10px;}
.profilebx .profile ul b:before{position: absolute;top:50%;left:0px; width: 3px; height: 3px; background-color: #333; border-radius: 0;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}
.profilebx .profile ul li{color: #555;}

.visionbx{background:url(../images/bg_vision.jpg) center bottom no-repeat;background-size: cover; padding: 120px 0;color: #fff;}
.visionbx .vision{font-size: 48px;line-height: 1.3;font-weight: 500;width:100%;height: 100%;text-shadow:0 0px 2px rgba(12, 12, 12, 0.3);word-break: keep-all;}

.philosophybx{padding: 100px 0;}
.philosophy{max-width:1200px;margin: 50px auto 0;}
.philosophy ul{display: flex;justify-content: center;align-items: flex-start;}
.philosophy li{width:calc(100% / 4);position:relative;padding: 0 20px;}
.philosophy li:before{display: inline-block;width: 130px;height: 130px;margin-bottom: 28px;border-radius: 50%;content: "";}
.philosophy li:after{display: block;position: absolute;top: 48px;left: -15px;width: 30px;height: 30px;background:url(../images/ic_plus.svg) center center no-repeat;content: "";}
.philosophy li:nth-child(1):after{display: none;}
.philosophy li:nth-child(1):before{background: #f0f4f8 url(../images/ic_philosophy1.png) no-repeat center;background-size: 90px;}
.philosophy li:nth-child(2):before{background: #f0f4f8 url(../images/ic_philosophy2.png) no-repeat center;background-size: 90px;}
.philosophy li:nth-child(3):before{background: #f0f4f8 url(../images/ic_philosophy3.png) no-repeat center;background-size: 80px;}
.philosophy li:nth-child(4):before{background: #f0f4f8 url(../images/ic_philosophy4.png) no-repeat center;background-size: 80px;}
.philosophy .keyword{margin-bottom: 22px;color: #0e4d90;font-size: 28px;font-weight: 500;}
.philosophy .text{font-size: 16px;line-height: 26px;word-break: keep-all;}

.innerbx{max-width: 1200px;margin: 0 auto;}
.greeting{display: flex;max-width: 1200px;margin: 120px auto;justify-content: space-between;padding: 0 20px;}
.greeting .text{font-size: 20px;width:43%;line-height: 1.5;word-break: keep-all;margin-right: 100px;}
.greeting .text b{color: #0e4d90;display: block;font-size: 48px;padding: 30px 0;font-family: 'NanumSquare'; font-weight: 600;}
.greeting .text p{text-align: right;font-size: 18px;color: #777;margin-top: 50px;margin-right: 30px;}
.greeting .text p span{color: #000;}
.greeting .img{width:calc(57% - 100px)}
.greeting .img img{width:100%;height: auto;}

.movbx{max-width: 1200px;margin: 120px auto;}

.his_nav { position: relative;  max-width: 1200px;  margin:0 auto 90px;  padding: 0 100px;}
.his_nav.fixed{position:fixed;top:0px;z-index:9;transition:250ms ease-in-out;}
.scroll_down .his_nav.fixed{top:0;}
.his_nav ul { display: flex;  flex-wrap: wrap;  width: 100%;}
.his_nav:before { display: block;  content: "";  position: absolute;  top: 15px;  left: 0;  width: 100%;  height: 1px;  background: #0096e0;}
.his_nav ul:before, .his_nav ul:after { display: block;  content: "";  width: 7px;  height: 7px;  background: #0096e0;  border: 0px solid #fff;  border-radius: 50%;  position: absolute;  top: 12px;  left: 0;  box-sizing: border-box;  transform-origin: top center;}
.his_nav ul:after {  left: auto;  right: 0;}
.his_nav li{width:calc(100% / 3);}
.his_nav li button {display: block; position: relative;  padding-top: 45px;  font-size: 1.5rem;  color: #000;  font-family: 'NanumSquare';    font-weight: 600;background-color: transparent;width:100%;text-align: center;}
.his_nav li button span { font-weight: 500;}
.his_nav li button:hover,
.his_nav li.on a{color: #0096e0;}
.his_nav li button:before { display: block;  content: "";  width: 7px;  height: 7px;  background: #0096e0;  border: 0px solid #fff;  border-radius: 50%;  position: absolute;  top: 12px;  left: 50%;  transform: translateX(-50%);  box-sizing: border-box;  transform-origin: top center;}
.his_nav li button:after {  display: block;  content: "";  width: 29px;  height: 29px;  background: #fff;  border: 11px solid #0096e0;  position: absolute;  top: 0;  left: 50%;  border-radius: 50%;  transform: translateX(-50%) scale(0);  transition: 0.5s;  box-sizing: border-box;}
.his_nav li.on button:after { transform: translateX(-50%) scale(1);}

.history_con { position: relative; width: 100%;margin-bottom: 150px;display: none;}
.history_con.active{display: block;}
.history_con:before { display: block;  content: "";  position: absolute;  top: 26px;  left: 50%;  width: 1px;  height: calc(100% - 106px);  background: #dbdbdb;}
.history_con .his_g {  position: relative;  display: flex;  flex-wrap: wrap;}
.history_con .his_g:before { display: block; content: ""; width: 17px;  height: 17px;  border: 1px solid #dbdbdb;  border-radius: 50%;  background: #fff;  position: absolute;  top: 18px;  left: calc(50% - 8px);  z-index: 10;  box-sizing: border-box;}
.history_con .his_g:after { display: block; content: "";  position: absolute;  width: 9px;  height: 9px;  background: #0096e0;  border-radius: 50%;  top: 22px;  left: calc(50% - 4px); z-index: 10;}
.history_con .his_g + .his_g {  margin-top: 120px;}
.history_con .his_g .year { position: relative; width: 50%; font-family: 'NanumSquare';  font-size: 55px;  color: #0096e0;  font-weight: 600;  letter-spacing: -1px;  line-height: 1;  text-align: right;  padding-right: 175px;}
.history_con .his_g .year:before { display: block; content: "";  position: absolute;  width: 197px;   height: 1px;   background: #aaaaaa;   top: 26px;   right: -40px;   z-index: -1;}
.history_con .his_g .con { position: relative;  width: 50%;  padding: 11px 0px 0 70px;text-align: left;line-height: 1.5;}
.history_con .his_g .con ul li {  position: relative;   width: 100%;  display: flex;  flex-wrap: wrap;align-items: center;}
.history_con .his_g .con ul li .m {  width: 40px;  color: #0096e0;  font-size: 20px;  font-family: 'NanumSquare';  font-weight: 600;  padding-top: 4px;}
.history_con .his_g .con ul li .txt1 { width: calc(100% - 40px);font-size: 16px;}
.history_con .his_g:nth-child(even) .year:before { right: auto; left: -40px;}
.history_con .his_g:nth-child(even):after { background: #0e4d90;}
.history_con .his_g:nth-child(even) .year { color: #0e4d90;  order: 3;  text-align: left;  padding: 0 0 0 175px;}
.history_con .his_g:nth-child(even) .con { order: 2; padding: 11px 70px 0 0;}
.history_con .his_g:nth-child(even) .con ul li .m { text-align: right; color: #0e4d90;  order: 2;}
.history_con .his_g:nth-child(even) .con ul li .txt1 { text-align: right; order: 1;}

.location_nm {  font-size: 26px;  font-weight: 500;  margin-bottom: 38px;max-width:1200px;margin: 0 auto;padding:0 20px;}
.location_info {  font-size: 20px;  line-height: 28px; max-width:1200px;margin: 30px auto;padding:0 20px;}
.location_info .dl_line { display: flex;}
.location_info .dl_line + .dl_line {  margin-top: 35px;}
.location_info dt {  font-weight: 600;  width: 28px;}
.location_info dd { font-weight: 300;   word-break: keep-all;  margin-bottom: 0;}
.map{max-width: 1200px; margin: 0 auto;padding: 0 20px;}
.map iframe { width: 100%;  height: 500px;border: 1px solid #ddd;}

.traffic .dl_line{align-items: stretch;}
.traffic dt{width:160px;font-weight: 500;position: relative;padding-left: 60px;line-height: 1.1;height: 48px;}
.traffic dt::before{width: 48px; height: 48px;border-radius: 7px;background-color: #dbeaff;display: block;  content: "";  position: absolute;  top: 50%;  left: 0; transform: translateY(-50%);}
.ic_traffic01::before{background-image: url(../images/ic_traffic1.png);background-position: center;}
.ic_traffic02::before{background-image: url(../images/ic_traffic2.png);background-position: center;}
.ic_traffic03::before{background-image: url(../images/ic_traffic3.png);background-position: center;}

.biz_info1{max-width:1200px;margin: 100px auto 50px;border-radius: 15px;border: 1px solid #ccc; text-align: center;font-size: 20px;overflow: hidden;position: relative;}
.biz_info1::after{display: block;  content: "";  position: absolute;  top: 0;  left: 50%;  width: 300px;  height: 300px;  background: url(../images/bg_biz_info1.png) center 70px no-repeat ;transform: translateX(-50%);z-index: -1;}
.biz_info1 b{font-size: 22px;margin: 0 auto;border-radius: 0 0 40px 40px;background-color:#0e4d90 ;color: #fff;max-width:500px;display: block;line-height: 48px;text-align: center;margin-bottom: 50px;font-weight: 400;}
.biz_info1 ul{width:90%;display: flex;align-items: center; justify-content: space-between;margin: 0 auto;line-height: 1.3; margin-top: 50px;}
.biz_info1 ul li{width:calc((100% / 3) - 30px); background-color: #dbeaff;border-radius: 50px;padding: 15px 0;font-weight: 500;}
.biz_info1 ul li span{display: block;font-size: 16px;font-weight: normal;}
.biz_info1 div{text-align: left;padding: 35px 35px 20px;line-height: 1.5;}

.biz_info2{max-width:1200px;margin: 0 auto;display: flex;align-items: stretch;flex-wrap: wrap;}
.biz_info2 > li{width:calc((100% / 2) - 20px);margin: 20px 20px 20px 0;}
.biz_info2 > li:nth-child(even){margin: 20px 0 20px 20px;}
.biz_info2 > li dl{border: 1px solid #ddd; border-radius: 7px;display: block;height: 100%;}
.biz_info2 > li dt{font-size: 22px;color: #0e4d90 ;margin-bottom: 15px;display: block;border-bottom: 1px solid #ddd;padding: 7px 20px;display: flex;justify-content: space-between;align-items: center;}
.biz_info2 > li dt button{border: none;width:36px;height: 36px;background-image: url(../images/ic_arrow.png);background-position: 0 0;background-repeat: no-repeat;background-color: transparent;}
.biz_info2 > li dt button:hover{background-position: 0 -36px;}
.biz_info2 > li dt button span{display: none;}
.biz_info2 > li dd{display: block;font-size: 18px;word-break: keep-all;line-height: 1.5;padding: 0 20px 15px;}

.linkbx {display: flex;align-items: stretch;justify-content: center;flex-wrap: wrap;margin-top: 20px;}
.linkbx li{border: 1px solid #ddd;background-color: #f4f5f9;}
.linkbx li:hover{border: 1px solid #0e4d90;}
.linkbx li a{font-size: 13px;display: block;width: 100%;height: 100%;text-align: center;color: #222;line-height: 28px;}
.linkbx li a:hover{color: #0e4d90;background-color: #d7eafd;}

.biz_info03{margin-top: 50px;padding: 0 20px;}
.biz_info03 > li{margin-bottom: 50px;padding-bottom: 50px;border-bottom: 1px dotted #aaa;display: flex;justify-content: space-between;align-items: flex-start;}
.biz_info03 > li div.biz_txt{width:calc(100% - 450px) ;font-size: 18px;word-break: keep-all;line-height: 1.5;}
.biz_info03 > li .imgbx{max-width:400px;width:100%; padding: 10px;border: 1px solid #ddd;}
.biz_info03 > li .imgbx img{width:100%;height: auto;}
.biz_info03 > li:last-child{border-bottom: none;}
.biz_info03.full > li{display: block;}
.biz_info03.full div.biz_txt{width:100%  ;}
.biz_info03.full > li .imgbx{width:100%;text-align: center;}
.biz_info03.full > li .imgbx img{width: auto;}

.sys_title{margin-bottom: 30px;color: #0e4d90;font-size: 28px;font-weight: 500;display: block;}
.sys_stitle{margin-bottom: 0px;color: #222;font-size: 24px;font-weight: 500;display: block;}

.sys_ul1{display: flex;align-items: stretch;width: 100%;padding: 20px 0 50px;}
.sys_ul1 li{font-size: 18px;font-weight: 500;text-align: center;padding-top: 160px;position: relative;line-height: 1.5;}
.sys_ul1 li::before{width: 150px; height: 150px;border-radius: 50%;background-color: #dbeaff;display: block;  content: "";  position: absolute;  top: 0;  left: 50%; transform: translateX(-50%);background-image: url(../images/ic_biz.png);}
.sys_ul1 li.ic_biz1::before{background-position: 0 0;}
.sys_ul1 li.ic_biz2::before{background-position: -150px 0;}
.sys_ul1 li.ic_biz3::before{background-position: -300px 0;}
.sys_ul1 li.ic_biz4::before{background-position: -450px 0;}
.sys_ul1 li.ic_biz5::before{background-position: -600px 0;}
.sys_ul1 li.ic_biz6::before{background-position: -750px 0;}
.sys_ul1 li.ic_biz7::before{background-position: -900px 0;}
.sys_ul1 li.ic_biz8::before{background-position: -1050px 0;}
.sys_ul1 li.ic_biz9::before{background-position: -1200px 0;}
.sys_ul1 li.ic_biz10::before{background-position: -1350px 0;}
.sys_ul1 li.ic_biz11::before{background-position: -1500px 0;}
.sys_ul1 li.ic_biz12::before{background-position: -1650px 0;}
.sys_ul1 li.ic_biz13::before{background-position: -1800px 0;}
.sys_ul1 li.ic_biz14::before{background-position: -1950px 0;}
.sys_ul1 li.ic_biz15::before{background-position: -2100px 0;}
.sys_ul1 li.ic_biz16::before{background-position: -2250px 0;}
.sys_ul1 li.ic_biz17::before{background-position: -2400px 0;}
.sys_ul1 li.ic_biz18::before{background-position: -2550px 0;}
.sys_ul1 li.ic_biz19::before{background-position: -2700px 0;}
.sys_ul1 li.ic_biz20::before{background-position: -2850px 0;}
.sys_ul1 li.ic_biz21::before{background-position: -3000px 0;}
.sys_ul1 li.ic_biz22::before{background-position: -3150px 0;}
.sys_ul1 li.ic_biz23::before{background-position: -3300px 0;}
.sys_ul1 li.ic_biz24::before{background-position: -3450px 0;}
.sys_ul1 li.ic_biz25::before{background-position: -3600px 0;}
.sys_ul1 li.ic_biz26::before{background-position: -3750px 0;}

.sys_ul2 li{font-size: 18px;text-align: left;padding-left: 15px;position: relative;line-height: 1.5;margin-bottom: 10px;}
.sys_ul2 li::before{width: 3px; height: 3px;background-color: #333;display: block;  content: "";  position: absolute;  top: 11px;  left: 0; }
.sys_ul2 li b{padding-right:8px;margin-right:8px;color:#0d4b8d;display: inline-block;}
.sys_ul3{display: flex;align-items: stretch;width: 100%;flex-wrap: wrap;}
.sys_ul3 li{width: calc((100% - 80px)/3);margin: 20px 0;text-align: center;font-size: 16px;line-height: 1.3;}
.sys_ul3 li:nth-child(3n-1){margin: 20px 40px;}
.sys_ul3 li img{display: block;margin-bottom: 10px;width: 100%;height: auto;border: 1px solid #ddd;}
.sys_ul3 li > b{display: block;color:#0d4b8d;margin-bottom: 5px;}
.brnone{border: none!important;}

.sys_ul4{display: flex;align-items: stretch;width: 100%;flex-wrap: wrap;}
.sys_ul4 li{width: calc((100% - 80px)/2);margin: 20px 0px 20px 0;text-align: center;font-size: 16px;line-height: 1.3;}
.sys_ul4 li:nth-child(n-1){margin: 20px 40px 20px 0;}
.sys_ul4 li img{display: block;margin-bottom: 10px;width: 100%;height: auto;border: 1px solid #ddd;}

.sys_ul5{border: 1px solid #ddd;padding: 10px 20px;}
.sys_ul5 li{border-bottom: 1px dotted #ccc;padding: 10px 0;display: flex;align-items: center;}
.sys_ul5 li:last-child{border-bottom: none;}
.sys_ul5 li b{display: block;width:200px;line-height: 60px;border: 1px solid #789de1; background:#d0dff9;text-align: center; margin-right: 20px;}
.sys_ul5 li p{width:calc((100%/3) - 30px);border: 1px solid #a78ee0; background:#dad0f1;text-align: center;line-height: 60px;}
.sys_ul5 li.jc{justify-content: space-between;}

.fxbx1{display: flex;align-items: stretch;justify-content: space-between;border-bottom: 1px dotted #aaa;padding-bottom: 50px;margin-bottom: 50px;padding: 0 0px;}
.fxbx1 > b{width: 220px; border-right: 1px dashed #ddd;margin-right: 30px;position: relative;}
.fxbx1 > b::before{display: block;  content: "";  position: absolute;  top: -3px;  right:-3px;  width: 6px;  height: 6px;background-color: #ddd;border-radius: 50%;}
.fxbx1 > b::after{display: block;  content: "";  position: absolute;  bottom: -3px;  right:-3px;  width: 6px;  height: 6px;background-color: #ddd;border-radius: 50%;}
.fxbx1 > .biz_info03{width:calc(100% - 250px)}

.c_cont{max-width: 1200px;margin: 0 auto;font-size: 18px;padding: 0 20px;}

.tbview {border-top:1px solid #4d5980; font-size:18px;line-height: 1.4;}
.tbview table{width: 100%;}
.tbview th {padding:9px 10px; color:#212121;font-weight:500;border-right:1px solid #e0e1e3; border-bottom:1px solid #e0e1e3; background-color:#f4f5f9;}
.tbview th span{font-weight: normal;color: #555;}
.tbview td {padding:9px 15px; color:#555; border-right:1px solid #e0e1e3; border-bottom:1px solid #e0e1e3;min-height:20px;}
.tbview th:last-child, .tbview td:last-child{border-right:none}


.prod01 { display: flex;  align-items: center;  padding: 0 20px 40px;margin: 0 auto;max-width: 1200px;width: 100%;flex-wrap: wrap;}
.prod01 .leftBox {  width: calc(100% - 440px);}
.prod01 .leftBox .plogo {    margin-bottom: 50px;font-size: 50px;font-weight: 500;color: #0d4b8d;}
.prod01 .leftBox .plogo img { max-height: 92px;  height: 100%;}
.prod01 .leftBox .p_txt { font-size: 20px; line-height: 1.6; font-weight: 400;  margin-bottom: 40px;  letter-spacing: -1px;word-break: keep-all;}
.prod01 .leftBox .p_txt p{margin-bottom: 15px;}
.prod01 .leftBox p > b{color: #443198;}
.prod01 .rightBox { width: 440px; flex: none;  height: 400px;  position: relative;}
.prod01 .rightBox .bookBox { position: absolute;  right: 0;  bottom: 0;  z-index: 1;}
.prod01 .rightBox .bookBox img {  max-width: 335px;  width: 100%;  max-height: 420px;  height: 100%;  transform: translateX(-20px);float: right;}

.pro_slogan{font-size: 36px;font-weight: 400;margin-bottom: 30px;line-height: 1.3;}
.pro_slogan b{display: block;margin-bottom: 20px;font-size: 36px;}


.xi-paperclip{color: #1262cc}

.prod02 { background-color: #f5f5f5;padding: 50px 20px;}
.prod02 > div { max-width:1200px;margin: 0 auto;}
.prod02 .topBox{margin:10px 0 20px;}
.prod02 .topBox h3 { font-size: 30px;  font-weight: 500;  margin: 10px 0 20px;color: #0d4b8d;line-height: 1.3; }
.prod02 .topBox div { color: #444; line-height: 1.8; padding-bottom: 20px; letter-spacing: -.5px;font-size: 18px; opacity: 0; transform: translateY(10%);}
.prod02 .topBox div p{margin-bottom: 15px;}
.prod02 .botBox ul { display: flex;  flex-direction: column;  gap: 20px;}
.prod02 .botBox li {display: flex; align-items: stretch;justify-content: space-between;flex-wrap: wrap;}
.prod02 .botBox li dl{ padding:35px 40px; background: #fff;  border-radius: 10px;  width: 49%;  box-sizing: border-box;  box-shadow: 0 5px 15px rgba(0, 0, 0, .1);  transition: .5s ease;}
.prod02 .botBox li dt {  font-size: 20px;  margin-bottom: 10px;}
.prod02 .botBox li dt i { transform: rotate(45deg);  margin-right: 5px;}
.prod02 .botBox li dd{font-size: 16px;word-break: keep-all; }
.prod02 .botBox li dd p { letter-spacing: -.6px; position: relative;  padding-left: 15px; font-size: 15px;  color: #767676;  line-height: 1.6;}
.prod02 .botBox li dd p:before { content: "-";  position: absolute;  top: 0;  left: 0;}
.prod02 .botBox li dd p b{color: #000;}
.ptitleText {font-size: 18px;}
.prod02 .topBox.aos-animate div,
.prod03 .topBox.aos-animate div  { animation: product_prod2Text .8s .3s ease both;}
@keyframes product_prod2Text {
    0% {
        opacity: 0;
        transform: translateY(10%);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

.prod02 .botBox li {  transform: translateX(20%);   opacity: 0;}
.prod02 .botBox li:nth-child(2) {  transform: translateX(-20%);}
.prod02 .botBox.aos-animate li { animation: product_prod02List1 1s ease both;}
.prod02 .botBox.aos-animate li:nth-child(2n) {  animation-name: product_prod02List2; animation-delay: .2s;}
.prod02 .botBox.aos-animate li:nth-child(n-1) {  animation-delay: .4s}
@keyframes product_prod02List1 {
    0% {
        transform: translateX(20%);
        opacity: 0;
    }

    100% {
        transform: none;
        opacity: 1;
    }
}

@keyframes product_prod02List2 {
    0% {
        transform: translateX(-20%);
        opacity: 0;
    }

    100% {
        transform: none;
        opacity: 1;
    }
}

.prod02 .botBox li strong span {
    background-image: linear-gradient(rgba(0, 0, 0, .15), rgba(0, 0, 0, .15));
    background-repeat: no-repeat;
    background-position: left bottom 1px;
    background-size: 0 30%;
    transition: .5s ease;
    -webkit-box-sizing: border-box;
    display: initial;
}

.prod02 .botBox.aos-animate li strong span {animation: product_prod02ListText 1s .5s ease both;}
.prod02 .botBox.aos-animate li:nth-child(2n) strong span { animation-delay: .8s;}
.prod02 .botBox.aos-animate li:nth-child(n-1) strong span {animation-delay: 1.2s;}

@keyframes product_prod02ListText {
    0% {
        background-size: 0% 30%;
    }

    30% {
        background-size: 100% 30%;
        background-position: left bottom 1px;
    }

    60% {
        background-size: 100% 30%;
        background-position: right bottom 1px;
    }

    100% {
        background-size: 0 30%;
        background-position: right bottom 1px;
    }
}



.prod03 {padding: 0px 20px 50px;}
.prod03 > div { max-width:1200px;margin: 0 auto;}
.prod03 .topBox{margin:10px 0 20px;}
.prod03 .topBox h3 { font-size: 30px;  font-weight: 500;  margin: 10px 0 20px;color: #0d4b8d;line-height: 1.3; }
.prod03 .topBox div { color: #444; line-height: 1.8; padding-bottom: 20px; letter-spacing: -.5px;font-size: 18px; opacity: 0; transform: translateY(10%);}
.prod03 .topBox div p{margin-bottom: 15px;}

.prod04 {padding: 50px 20px 70px;}
.prod04 > div { max-width:1200px;margin: 0 auto;}
.prod04 .topBox{margin:10px 0 20px;}
.prod04 .topBox h3 { font-size: 30px;  font-weight: 500;  margin: 10px 0 20px;color: #0d4b8d;line-height: 1.3; }

.prod04 .botBox.ea2 ul{display: flex;align-items: stretch;justify-content: space-between;width:100%;flex-wrap: wrap;}
.prod04 .botBox.ea2 li{width:49%}

.prod04 .botBox.ea3 ul{display: flex;align-items: stretch;justify-content: space-between;width:100%;flex-wrap: wrap;}
.prod04 .botBox.ea3 li{width:32%}

.prod04 .botBox.ea4 ul{display: flex;width:100%;flex-wrap: wrap;position: relative;flex-wrap: wrap;}
.prod04 .botBox.ea4 li{width: 23.5% !important;margin-right: 2%;height: 220px;margin-bottom: 25px;}
.prod04 .botBox.ea4 li:nth-child(4n){margin-right: 0%;position: absolute;right:0;height: 460px;}

.prod04 .botBox.aos-animate li{border: 7px solid #eee;border-radius: 10px;display: flex;align-items: stretch;}
.prod04 .botBox.aos-animate li dl{border: 1px solid #ccc;border-radius: 5px;width:100%;padding:35px 40px;background-color: #fff; }
.prod04 .botBox li dt {  font-size: 20px;  margin-bottom: 10px;}
.prod04 .botBox li dt i { transform: rotate(45deg);  margin-right: 5px;}
.prod04 .botBox li dd{font-size: 16px;word-break: keep-all; }
.prod04 .botBox li dd p { letter-spacing: -.6px; position: relative;  padding-left: 15px; font-size: 15px;  color: #767676;  line-height: 1.6;}
.prod04 .botBox li dd p:before { content: "-";  position: absolute;  top: 0;  left: 0;}


.imgbxul{display: flex;align-items: stretch;width: 100%;padding: 20px 0 50px;}
.imgbxul li{text-align: center;}
.imgbxul li span{display: block;margin-top: 5px;}

.pro7_7{padding: 20px 40px;display: flex; justify-content: space-between;}

.pro7_7 > div{width:23%;text-align: center;position: relative;}
.pro7_7 > div::after{display: block;  content: "";  position: absolute; top:40px;  bottom: 8px;  right:50%;  width: 1px;background-color: #c5c9d6;z-index: -1;}
.pro7_7 > div h4{background-color: #3c709d;color: #fff;margin-bottom: 15px;padding: 10px;font-size: 20px;}
.pro7_7 > div p{border: 1px solid #c5c9d6;margin-bottom: 8px;padding: 10px;font-size: 16px;background-color: #fff;}


.pro8_bg{background: url(../images/pro8_7.png) right center no-repeat;}


.rnd1{max-width:1200px;margin: 100px auto 50px;text-align: center;}
.rnd2{background:#c2d6fd;}
.rnd2_bg{max-width:1200px;margin: 100px auto 50px;background: url(../images/rnd2_bg.png) 0 0 no-repeat;padding: 70px 20px;background-size: auto 100%;}

.rnd2 .botBox ul { display: flex; gap: 20px;justify-content: flex-end;flex-wrap: wrap;}
.rnd2 .botBox li {border-radius: 10px;  box-sizing: border-box;  box-shadow: 0 5px 15px rgba(0, 0, 0, .1);  transition: .5s ease;padding:180px 18px 25px;font-size: 17px;width: 23%;line-height: 1.4;text-align: center;letter-spacing: -1.3px;}
.rnd2 .botBox li:nth-child(1){background:#fff url(../images/ic_rnd1.png) center 30px no-repeat;}
.rnd2 .botBox li:nth-child(2){background:#fff url(../images/ic_rnd2.png) center 30px no-repeat;}
.rnd2 .botBox li:nth-child(3){background:#fff url(../images/ic_rnd3.png) center 30px no-repeat;}
.rnd2 .botBox li b{display: block;font-size: 22px;margin-top: 5px;color: #0e4d90;}

.rnd3{max-width:1200px;margin: 70px auto 70px;padding: 0 20px;}
.rnd3 .grayline{padding: 40px;display: flex; justify-content: space-between;flex-wrap: wrap;}
.rnd3 .grayline> div{width:calc(30%- 10px);text-align: center;position: relative;}
.rnd3 .grayline> div::after{display: block;  content: "";  position: absolute; top:40px;  bottom: 8px;  right:50%;  width: 1px;background-color: #c5c9d6;z-index: -1;}
.rnd3 .grayline> div:nth-child(1):after{bottom: 68px;}
.rnd3 .grayline> div h4{background-color: #3c709d;color: #fff;margin-bottom: 15px;padding: 10px;font-size: 20px;}
.rnd3 .grayline> div p{border: 1px solid #c5c9d6;margin-bottom: 8px;padding: 10px;font-size: 16px;background-color: #fff;}

.recruiter1{background:#f0f1f3;}
.recruiter1_bg{max-width:1200px;margin: 100px auto 50px;background: url(../images/recruiter1_bg.png) 0 center no-repeat;padding: 70px 20px;background-size: auto 70%;}
.recruiter1 .botBox {display: flex;justify-content: end;}
.recruiter1 .botBox ul { display: flex; gap: 20px;justify-content: flex-end;flex-wrap: wrap;width: 65%;}
.recruiter1 .botBox li {border-radius: 10px;  box-sizing: border-box;  box-shadow: 0 5px 15px rgba(0, 0, 0, .1);  transition: .5s ease;padding:150px 18px 25px;width: calc((100% / 3) - 60px);line-height: 1.4;text-align: center;background-color: #fff;font-size: 22px;color: #0e4d90;}
.recruiter1 .botBox li:nth-child(1){background:#fff url(../images/ic_recruiter1.png) center 30px no-repeat;}
.recruiter1 .botBox li:nth-child(2){background:#fff url(../images/ic_recruiter2.png) center 30px no-repeat;}
.recruiter1 .botBox li:nth-child(3){background:#fff url(../images/ic_recruiter3.png) center 30px no-repeat;}
.recruiter1 .botBox li:nth-child(4){background:#fff url(../images/ic_recruiter4.png) center 30px no-repeat;}
.recruiter1 .botBox li:nth-child(5){background:#fff url(../images/ic_recruiter5.png) center 30px no-repeat;}
.recruiter1 .botBox li:nth-child(6){background:#fff url(../images/ic_recruiter6.png) center 30px no-repeat;}

.recruiter2{max-width:1200px;margin: 100px auto 50px;padding: 0 20px;}
.btn_recruiter{font-size: 21px; background-color: #fff;border: 1px solid #2d7dd1;border-radius: 7px;padding: 12px 35px;}
.btn_recruiter:hover{background-color: #eff5fb;color: #004bd6;}
.recruitbx ul{display: flex; gap: 20px;flex-wrap: wrap;justify-content: space-between;}
.recruitbx li{width: calc((100% / 3) - 20px);border: 1px solid #ccc;border-radius: 10px; font-size: 18px; color: #666; text-align: left; margin-bottom: 20px; line-height: 1.5;padding: 30px 30px 120px;}
.recruitbx li b {font-size: 24px;  display: block;   text-align: left;  margin-bottom: 10px;color: #000;}
.recruitbx li.ic1{background: url(../images/ic_recruiter7.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic2{background: url(../images/ic_recruiter8.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic3{background: url(../images/ic_recruiter9.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic4{background: url(../images/ic_recruiter10.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic5{background: url(../images/ic_recruiter11.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic6{background: url(../images/ic_recruiter12.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic7{background: url(../images/ic_recruiter13.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic8{background: url(../images/ic_recruiter14.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic9{background: url(../images/ic_recruiter15.png) right 10px bottom 10px no-repeat;}
.recruitbx li.ic10{background: url(../images/ic_recruiter16.png) right 10px bottom 10px no-repeat;}

.sstit{background:url(../images/ic_stit.gif) 0 center no-repeat; color:#333;padding-left: 22px; font-size:18px;font-weight:500;display: block;}

.step {display: flex;align-items: center; justify-content: space-between;margin: 20px auto 50px;width:90%;flex-wrap: wrap;}
.step li{width:180px;height: 180px;border-radius: 50%;background-color: #fff;font-size: 24px;display: flex;align-items: center;justify-content: center;border: 7px solid #2572c4;letter-spacing: -1px;position: relative;}
.step li span{font-size: 13px;display: block;width:60px;text-align: center;background-color: #2572c4;margin: -15px auto 5px;border-radius: 20px;letter-spacing:0;color: #fff;}
.step li:nth-child(2n){border: 7px solid #2b457f;}
.step li:nth-child(2n) span{background-color: #2b457f;}
.step li:after{position: absolute;top:50%;left:125%; width: 36px; height: 36px; background:url(../images/ic_arrow.png) 0 0 no-repeat; border-radius: 0;content: '';transform: translateY(-50%);}
.step li:last-child::after{display: none;}
.grayline{border:1px solid #e0e1e3}



/* ====================== TABLET ======================*/
@media all and (max-width:1199px) {
    .menu{display: inline-block;}
    #header{position: fixed;background-color: rgba(0,0,0,.8);}
    #gnb{display: none;position: fixed;bottom: 0;top:0;left:0;right:0; width:100%;background-color: #fff;}
    #gnb > ul{ height:auto;margin:0 auto;}
    #gnb > ul > li.mb_logo{display: flex;align-items: center;justify-content: space-between;border-bottom: 2px solid #aaa;}
    #gnb > ul > li.mb_logo img{padding-left: 10px;}
    #gnb > ul > li {float:initial; width:100%;border-bottom: 1px solid #ddd;background-image:url(../images/bg_lnb.png);background-position:center right 20px;background-repeat:no-repeat}
    #gnb > ul > li:first-child{background:none}
    #gnb > ul > li:last-child{background:url(../images/bg_lnb.png);background-position:center right 20px;background-repeat:no-repeat}
    #gnb > ul > li > a {display:block;line-height:70px;font-size:20px;color:#333;text-align:left;font-weight:400;padding-left: 30px;}
    #gnb > ul > li > a:hover,
    #gnb > ul > li.active > a{color:#fff;background-color:#006ecd;background-image:url(../images/bg_lnb_on.png);background-position:center right 20px;background-repeat:no-repeat}

    #gnb > ul > li > a:after{display:block;position:absolute;top:67px;z-index:1;width:100%;width:100%;height:3px;background-color:#2f6cdd;transform:rotateY(90deg);transition:0ms ease-in-out;content:"";}
    #gnb > ul > li.active > a:after,
    #gnb > ul > li > a:hover:after{transform:rotateY(0);}
    #gnb > ul > li .submenu{position:relative;top:0px; z-index:98;left:0;right:0; display:none;background-color: #fff;}
    #gnb > ul > li:first-child .submenu > ul{border-left:none;}
    #gnb > ul > li .submenu > ul{border-right:none;height:auto;padding-top: 8px;padding:8px 15px;}
    #gnb > ul > li .submenu > ul > li{text-align:left;}
    #gnb > ul > li .submenu > ul > li:last-child{background:none}
    #gnb > ul > li .submenu > ul > li a{display:block; font-size:1rem; color:#333; line-height:40px;position:relative;text-indent:20px}
    #gnb > ul > li .submenu > ul > li a:hover,
    #gnb > ul > li .submenu > ul > li a:focus{color:#2f6cdd;}
    #gnb > ul > li .submenu > ul > li a:before{position: absolute;top:50%;left:10px; width: 3px; height: 3px; background-color: #aaa; border-radius: 0;-webkit-box-flex: 0; -ms-flex: 0 0 auto;  flex: 0 0 auto; content: '';}
    .profilebx .profile{justify-content:space-between; flex-wrap: wrap;padding:0 20px;}
    .profilebx .profile ul{font-size: 18px;margin-top: 30px;width: 100%;}
    .profilebx .profile ul b.ls2 {
        letter-spacing: 20px !important;
    }
    .profilebx .profile ul b.ls4 {
        letter-spacing: 4px !important;
    }

    .greeting{flex-wrap: wrap;justify-content: flex-end;}
    .greeting .text{width:100%;}
    .greeting .text b{color: #0e4d90;display: block;font-size: 48px;padding: 30px 0;font-family: 'NanumSquare'; font-weight: 600;}
    .greeting .text p{text-align: right;font-size: 18px;color: #777;margin-top: 50px;margin-right: 30px;}
    .greeting .text p span{color: #000;}
    .greeting .img{width:80%;margin-top: 30px;}
    .ctab_list li{width: 25%;}
    .ctab_list li .ctab_btn{font-size: 16px;word-break: keep-all;width: 100%!important;white-space:unset}
    .fxbx1{display: block; border-bottom: none;}
    .fxbx1 > b{width: 100%; border-right: none;padding-left: 20px;}
    .fxbx1 > b::before{display: none; }
    .fxbx1 > b::after{display: none; }
    .fxbx1 > .biz_info03{width:100%}
    .pro8_bg{background: none;}
    .step li:after{left:110%;}
}

@media all and (max-width:1023px){

    .prod04 .botBox.ea4 li{width: 100% !important;height: auto;margin-bottom: 25px;}
    .prod04 .botBox.ea4 li:nth-child(4n){margin-right: 0%;position: relative;right:0;height: auto;}
    .rnd3 .grayline> div{width: 100%;}
    .rnd3 .grayline> div:nth-child(1):after{bottom: 38px;}
    .recruiter1 .botBox ul{width: 100%;justify-content: center;margin-top: 350px;}
    .recruiter1 .botBox li {padding:150px 18px 25px;width: calc((100% / 3) - 18px);}
    .recruiter1_bg{background: url(../images/recruiter1_bg.png) center 20px no-repeat;background-size: 80% auto;}
    .step {width: 100%;}
    .step li{width:100%;height: 80px;border-radius: 50px;justify-content: left;margin-bottom: 50px;}
    .step li p{display: flex;align-items: center;padding: 0 6px;}
    .step li span{margin:0;border-radius: 30px;letter-spacing:0;color: #fff;height: 60px;line-height: 60px;margin-right: 20px;}
    .step li:after{position: absolute;top:80px;left:50%; width: 36px; height: 36px; background:url(../images/ic_arrow.png) 0 0 no-repeat; border-radius: 0;content: '';transform: translateX(-50%) rotate(90deg);}

}


/* ====================== MOBILE ======================*/
@media all and (max-width:720px) {
    .footerIn{flex-wrap: wrap;justify-content: space-between;}
    .footerIn > div{margin-left: 0!important; margin: 10px 0; }
    .sub_tabbox .tab_list li + li{margin-left:10px;}
    .sub_tabbox .tab_list li .tab_btn{font-size: 16px;}
    .slogan_en{font-size: 38px;padding: 0 20px}
    .slogan_kr{font-size: 26px;padding: 0 20px}
    .slogan_text p{font-size: 18px;padding: 0 20px}
    .visionbx .vision {font-size: 32px;padding: 0 20px;}
    .philosophy ul{flex-wrap: wrap;}
    .philosophy li{width:100%;text-align: left;padding: 30px 20px;}
    .philosophy li > div{width:calc(100% - 180px);float: right;}
    .philosophy li .keyword{margin-bottom: 0px;}
    .philosophy li:after{display: none;}
    .philosophy li:before{display: inline-block;width: 130px;height: 130px;margin-top: 15px;border-radius: 50%;content: "";}

    .his_nav {padding: 0 0px;margin: 0 20px 50px;}
    .his_nav li button {font-size: 0.933rem;}



    .history_con:before { display: none;  }
    .history_con .his_g {  position: relative;  display: flex;  flex-wrap: wrap;}
    .history_con .his_g:before { display: none; }
    .history_con .his_g:after { display: none; }
    .history_con .his_g + .his_g {  margin-top: 50px;}
    .history_con .his_g .year { width:100px;padding-left: 30px; font-size: 40px;  color: #0096e0;  padding-right: 75px;}
    .history_con .his_g .year:before { width: 35px; top: 17px;   right: -60px; }
    .history_con .his_g .con { position: relative;  width: calc(100% - 140px);  padding: 5px 0px 0 70px;}
    .history_con .his_g .con ul li { align-items: stretch;line-height: 1.2;margin-bottom: 5px;}
    .history_con .his_g .con ul li .m{padding-top: 0;}
    .history_con .his_g .con ul li .txt1{line-height: 1.3;}
    .history_con .his_g:nth-child(even) .year:before { right: -60px; left: initial;}
    .history_con .his_g:nth-child(even) .year { color: #0e4d90;  order: 2;  text-align: left;  padding: 0 75px 0 30px;}
    .history_con .his_g:nth-child(even) .con { order: 3; padding: 5px 0px 0 70px;}
    .history_con .his_g:nth-child(even) .con ul li .m { text-align: left;  order: 1;}
    .history_con .his_g:nth-child(even) .con ul li .txt1 { text-align: left; order: 2;}
    .traffic .dl_line{flex-wrap: wrap;}
    .traffic dt{width:100%;}
    .traffic dd{width:100%;margin-top: 10px;}
    .biz_info2 > li{width:100% ;margin: 20px 0 20px 0;}
    .biz_info2 > li:nth-child(even){margin: 20px 0 20px 0;}
    .ctab_list li{width: 33.3%;}
    .biz_info03 > li {flex-wrap: wrap;}
    .biz_info03 > li .imgbx{margin: 0 auto 20px;}
    .biz_info03 > li div.biz_txt{width:100% ;order: 2;}
    .sys_ul5 li {flex-wrap: wrap;align-items: stretch;}
    .sys_ul5 li b{display: block;width:100%;min-width: 200px; margin-right: 0px;}
    .sys_ul5 li p{width:calc((100%/3) - 10px);min-height:60px;line-height: 1.3;display: flex;align-items: center;justify-content: center;}
    .sys_ul5 li.jc{justify-content: space-between;}

    .sm_list.ea8{flex-wrap: wrap;height: 100px;}
    .sm_list.ea8 li{width:calc(100% / 4)}
    .sm_list.ea8 li a{line-height: 50px;height: 50px;font-size: 16px;}
    .subtit.mo{height: 340px;}

    .prod01 .leftBox{width: 100%;}
    .prod01 .rightBox {width: 100%;height: auto;}
    .prod01 .rightBox .bookBox{position: relative;display: flex;align-items: center;justify-content: center;}
    .prod01 .rightBox .bookBox img {transform: none;max-height: 100%;}
    .prod02 .botBox li dl{width: 100%;}
    .prod02 .botBox li dl:first-child{margin-bottom: 20px;}
    .prod04 .botBox.ea3 li{width:100%;margin-bottom: 20px;}
    .prod04 .botBox.ea2 li{width:100%;margin-bottom: 20px;}

    .imgbxul.ea4{flex-wrap: wrap;}
    .imgbxul.ea4 li{width:50%!important;}
    .pro_slogan{font-size: 28px;}
    .pro_slogan b{font-size: 28px;}
    .prod01 .leftBox .p_txt { font-size: 18px; }
    .rnd2 .botBox ul { padding:280px 20px 0;}
    .rnd2 .botBox li {width: 100%;}
    .rnd2_bg{background-size:  100% auto; }

    .recruitbx li{width: calc((100% / 2) - 20px);}
    /*소개동영상*/
    .movbx {
        width: 100% !important;
        height: auto !important;
        margin: 40px auto !important;
        padding: 0 16px !important;
        box-sizing: border-box !important;
    }

    .movbx iframe {
        width: 100% !important;
        height: 220px !important;
    }

    .movbx object {
        width: 100% !important;
        height: auto !important;
    }
}

@media all and (max-width:450px) {
    .slogan_en{font-size: 32px;padding: 0 20px}
    .history_con .his_g .year:before{display: none;}
    .history_con .his_g .con { width:100% ;  padding: 15px 0px 0 35px;}
    .history_con .his_g:nth-child(even) .con {padding: 15px 0px 0 35px;}
    .biz_info1 ul{flex-wrap: wrap;}
    .biz_info1 ul li{width:100%; margin-bottom: 10px;}
    .biz_info1 {font-size: 16px;}
    .biz_info1 p{word-break: keep-all;margin: 10px ;}
    .biz_info1 b{font-size: 18px;line-height: 1.4;margin: 0 20px;padding: 5px;word-break: keep-all;}
    .linkbx li a{line-height: 1.2;padding: 4px 0;word-break: break-all;}
    .ctab_list li{width: 50%;}
    .sys_ul1.ea4 {flex-wrap: wrap;}
    .sys_ul1.ea4 li{width: 50%!important;margin-bottom: 30px;}
    .sys_ul3{display: block;}
    .sys_ul3 li{width: 100%;}
    .sys_ul3 li img{max-width: 300px;margin: 0 auto 10px;}
    .sys_ul3 li:nth-child(3n-1){margin: 0;}
    .tab_list.mo li .tab_btn{font-size: 14px!important;padding: 0 2px;letter-spacing: -0.5px;}
    .imgbxul.ea4 li{width:100%!important;padding: 5px;}
    .recruiter1 .botBox ul{margin-top: 250px;}
    .recruiter1 .botBox li {width: calc((100% / 2) - 18px);}
    .recruitbx li{width: 100%;}
    .philosophy li:after{display: none;}
    .philosophy li:before{display: inline-block;width: 130px;height: 130px;margin-top: 50px;border-radius: 50%;content: "";}
}

@media all and (max-width:320px) {
    .sub_tabbox .tab_list li + li{margin-left:0px;letter-spacing: -1px;}
    .sub_tabbox .tab_list li .tab_btn{font-size: 15px;}


}

@media screen and (max-width: 1199px) {
    #header:hover {
        border-bottom: none;
        background-color: rgba(0,0,0,.8);
    }
}