@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700&display=swap');
#footer{background: #eef0f1}
#header.sub #gnb > ul > li > a{color: #282b35}
#sub{padding-top: 110px;}
#sub .sub_loc{background: #f4f6f8;position: relative;z-index: 9999;width: 100%;top: 0}
#sub .sub_loc.on{position: fixed;top: 0}
#sub .loc_wrap{position: relative;z-index: 999;height: 80px;width: 100%}
#sub .sub_loc > div:after{content: '';display: block;clear: both;}
#sub .sub_loc > div > div{float: left}
#sub .sub_loc > div > div.dep01 button{background: url(/img/sub/btn_arrow.jpg) no-repeat right center;height: 80px;width: 180px;text-align: left;padding-left: 0;border-right: 1px solid #d9dce0;font-size: 18px;color: #55575e;}
#sub .sub_loc > div > div.dep02 button{background: url(/img/sub/btn_arrow.jpg) no-repeat right center;;height: 80px;width: 180px;text-align: left;padding-left: 0;font-size: 18px;color: #55575e;display: none}
#sub .sub_loc > div > div.dep02 ul:after{content: '';display: block;clear: both;}
#sub .sub_loc > div > div.dep02{padding-left: 20px;}
#sub .sub_loc > div > div.dep02 ul li{float: left;}
#sub .sub_loc > div > div.dep02 ul li a{display: block;line-height: 80px;font-size: 18px;color: #8e9097;padding: 0 20px;}
#sub .sub_loc > div > div.dep01{position: relative;}
#sub .sub_loc > div > div.dep01 ul{position: absolute;width: 100%;box-shadow: 0 0 15px rgba(0,0,0,0.1);border-radius: 20px;padding: 10px 0;margin-top: 15px;background: #fff;display: none}
#sub .sub_loc > div > div.dep01 ul li a{display: block;line-height: 45px;font-size: 16px;color: #8e9097;padding: 0 20px;}
#sub .sub_loc > div > div.dep02 ul li.on a:before{content: '';display: inline-block;width: 5px;height: 5px;border-radius: 50%;background: #11bced;vertical-align: middle;margin-right: 8px;}
#sub .sub_loc > div > div.dep02 ul li.on a{color: #11bced;font-weight: 500}
#sub .sub_loc2{border-bottom: 1px solid #d9dce0}
#sub .sub_loc2 ul{padding-left: 203px}

#sub .sub_loc2 ul:after{content: '';display: block;clear: both;}
#sub .sub_loc2 ul li{float: left;}
#sub .sub_loc2 ul li a{display: block;line-height: 80px;padding: 0 20px;color: #8e9097;font-size: 18px;}
#sub .sub_loc2 ul li.on a{color: #55575e;}

#sub .sub_con{padding-top: 160px;padding-bottom: 160px;}
#sub.product .sub_con{position: relative;}
#sub.product .sub_con:before{content: '';display: block;width: 158px;height: 1152px;background: url(/img/sub/tech_typo.jpg);position: absolute;right: 0;bottom: 136px;z-index: -1}
#sub .sub_tit{margin-bottom: 50px;}
#sub .sub_tit strong{display: block;text-align: center;line-height: 1;font-weight: 500;color: #3a3c42;font-size: 55px;}
#sub .sub_tit strong span{color: #00a4d3}

#sub.greeting .con01 .n_logo{text-align: center;margin-bottom: 125px;}
#sub.greeting .con01 .img{position: relative;}
#sub.greeting .con01 .img .img_w{border-radius: 40px;overflow: hidden;}
#sub.greeting .con01 .img .img_w img{display: block;}
#sub.greeting .con01 .img .b_logo{position: absolute;top: -40px;right: -50px;}
#sub.greeting .con02{padding-top: 105px;}
#sub.greeting .con02:after{content: '';display: block;clear: both;}
#sub.greeting .con02 > div{float: left;}
#sub.greeting .con02 .left{padding-right: 145px;}
#sub.greeting .con02 .right{width:70%;}
#sub.greeting .con02 .left > *{display: block;line-height: 1}
#sub.greeting .con02 .left span, #sub.strategy .con01 .tit strong{font-size: 26px;color: #5a5e69;margin-bottom: 30px;font-weight: 600}
#sub.greeting .con02 .left span em{font-weight: 600;color: #5a5e69;}
#sub.greeting .con02 .left strong{font-size: 50px;color: #232838;}
#sub.greeting .con02 .right p{font-size: 22px;line-height: 42px;color: #5a5e69;margin-bottom: 42px;}
#sub.greeting .con02 .right p span{font-weight: 500;color: #232838}
#sub.ci .con01{padding-top: 50px;text-align: center;}
#sub.ci .con01 .n_logo{margin-bottom: 50px;}
#sub.ci .con01 p{font-size: 32px;color: #5a5e69;line-height: 50px;letter-spacing: -0.5px;font-weight: 500}
#sub.ci .con01 p span{color: #11bced}
#sub.ci .con02{margin-top: 130px;position: relative;padding-bottom: 60px;}
#sub.ci .con02:before{content: '';display: block;width: 100%;height: 1px;top: 40px;position: absolute;background: #d9dce0}
#sub.ci .con02 ul{text-align: center;position: relative;z-index: 2}
#sub.ci .con02 ul li{display: inline-block;width: 275px;}
#sub.ci .con02 ul li span{display: block;width: 80px;line-height: 80px;text-align: center;background: #11bced;border-radius: 20px;margin: 0 auto;font-family: 'Orbitron', sans-serif;font-size: 26px;color: #fefefe;font-weight: 600;margin-bottom: 30px;position: relative;}
#sub.ci .con02 ul li:nth-child(2) span{background: #1d2b55}
#sub.ci .con02 ul li span:before{content: '';display: block;width: 42px;height: 27px;background: url(/img/sub/ci_bul01.png);left: -42px;top: 50%;margin-top: -13.5px;position: absolute;}
#sub.ci .con02 ul li span:after{content: '';display: block;width: 42px;height: 27px;background: url(/img/sub/ci_bul02.png);right: -42px;top: 50%;margin-top: -13.5px;position: absolute;}

#sub.ci .con02 ul li:nth-child(2) span:before{background: url(/img/sub/ci_bul03.png);}
#sub.ci .con02 ul li:nth-child(2) span:after{background: url(/img/sub/ci_bul04.png);}
#sub.ci .con02 ul li strong{display: block;font-family: 'Orbitron', sans-serif;font-weight: 600;color: #1d2b55;font-size: 18px;margin-bottom: 10px;}
#sub.ci .con02 ul li p{font-size: 18px;color: #5a5e69;}
#sub.ci .con03 .txt{background: #f4f5f8;border-radius: 20px;}
#sub.ci .con03 .txt p{display: block;line-height: 92px;color: #555862;font-size: 20px;text-align: center;}
#sub.ci .con03 .txt p span{color: #1d2b55}
#sub.ci .con04{text-align: center;padding-top: 150px;}
#sub.ci .con04 ul:after{content: '';display: block;clear: both}
#sub.ci .con04 ul li{float: left;width: 28.28%;margin-right: 7.58%}
#sub.ci .con04 ul li:nth-child(3){margin-right: 0}
#sub.ci .tit{margin-bottom: 40px}
#sub.ci .tit strong{display: block;font-size: 26px;color: #1d2b55}
#sub.people .sub_con{background: url(/img/sub/people_bg.png) no-repeat bottom left}
#sub.field .sub_con{background: url(/img/sub/people_bg.png) no-repeat bottom left}
#sub.people .con01{overflow: hidden;}
#sub.people .con01 .c01 > div:after{content: '';display: block;clear: both;}
#sub.people .con01 .c01 > div > div{float: right;}
#sub.people .con01 .c01 > div > div img{display: block;filter: drop-shadow(16px 16px 20px rgba(0,0,0,0.1));}
#sub.people .con01 .c02 > div > div img{display: block;filter: drop-shadow(16px 16px 20px rgba(0,0,0,0.1));}
#sub.people .con01 .c01{position: relative;top: 90px;z-index: 2}
#sub.people .con01 .c02{padding-bottom: 80px;position: relative;}
#sub.people .con01 .c01:before{content: '';display: block;width: 840px;height: 485px;right: 50%;margin-right: -970px;background: #00a4d3;position: absolute;bottom: -120px;z-index: -1;border-radius: 50px 0 0 50px;}
#sub.people .con01 .c02:before{content: '';display: block;width: 670px;height: 370px;left: 50%;margin-left: -970px;background: #1d2b55;position: absolute;bottom: 0;z-index: -1;border-radius: 0 50px 50px 0}
#sub.people .con01 .c02 > div > div img{display: block;}
#sub.people .con01 .c02 > div:after{content: '';display: block;clear: both}
#sub.people .con01 .c02 > div > div{float: left;}
#sub.people .con01 .c02 > div > div.c_logo{padding-top: 255px;float: right}
#sub.people .con02{padding-top: 145px;}
#sub.people .con02:after{content: '';display: block;clear: both;}
#sub.people .con02 ul{width: 860px;margin: 0 auto;}
#sub.people .con02 ul:after{content: '';display: block;clear: both;}
#sub.people .con02 ul li{float: left;width: 25.58%;margin-right: 11.63%;margin-bottom: 90px;}
#sub.people .con02 ul li:nth-child(1){margin-left: 37.21%}
#sub.people .con02 ul li:nth-child(2){clear: left}
#sub.people .con02 ul li:nth-child(3n+1){margin-right: 0}
#sub.people .con02 ul li:nth-child(5){}
#sub.people .con02 ul li img{display: block;}
#sub.people .con02 ul li strong{display: block;text-align: center;color: #fff;border-radius: 20px;background: #1d2b55;color: #fff;line-height: 80px;font-size: 22px;margin-top: 20px;margin-bottom: 20px;}
#sub.people .con02 ul li:nth-child(2n) strong{background: #474a59}
#sub.people .con02 ul li p{font-size: 18px;color: #868992;width: 120%;margin-left: -10%;text-align: center;}

#sub.iprs .con01 ul.list{margin-bottom: 35px;}
#sub.iprs .con01 ul.list:after{content: '';display: block;clear: both;}
#sub.iprs .con01 ul.list li{float: left;width: 31.25%;margin-right: 3.125%;margin-bottom: 3.125%}
#sub.iprs .con01 ul.list li:nth-child(3n){margin-right: 0}
#sub.iprs .con01 ul.list li a{display: block;background: #f5f8fa;border-radius: 20px;height: 225px;padding: 40px;box-sizing: border-box;}
#sub.iprs .con01 ul.list li:hover a{background: #1fc0ee}
#sub.iprs .con01 ul.list li a strong{color: #1d2b55;font-size: 18px;line-height: 30px;overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;
height: 60px;}
#sub.iprs .con01 ul.list li:hover a strong{color: #fff;}
#sub.iprs .con01 ul.list li .info{margin-top: 40px;}
#sub.iprs .con01 ul.list li .info span{float: left;display: block;line-height: 57px;color: #bfc1c6;font-size: 16px;}
#sub.iprs .con01 ul.list li:hover .info span{color: #fff;}
#sub.iprs .con01 ul.list li .info i{float: right;width: 57px;height: 57px;background: url(/img/sub/down01.png)}
#sub .sch_area {margin-bottom: 65px}
#sub.iprs .con01 ul.list li:hover .info i{background: url(/img/sub/down02.png)}}
#sub .sch_area .sch_w{width: 450px;margin: 0 auto;position: relative;border-bottom: 3px solid #e9ecef;padding-left: 105px;box-sizing: border-box;}
#sub .sch_area .sch_w select{position: absolute;left: 0;height: 46px;width: 100px;border: none;font-size: 16px;color: #afb5bb;}
#sub .sch_area .sch_w{width: 440px;margin: 0 auto;position: relative;padding-left: 105px;box-sizing: border-box;border-bottom: 3px solid #e9ecef}
#sub .sch_area .sch_w input{height: 46px;width: 100%;display: block;border: none;font-size: 16px;color: #555;}
#sub .sch_area .sch_w input::placeholder{color: #afb5bb;}
#sub .sch_area .sch_w button{position: absolute;right: 0;bottom: 0;}
#sub .sch_area .sch_w button img{display: block;}
#sub .paging ul{text-align: center;}
#sub .paging ul li{display: inline-block;margin-right: 10px;vertical-align: top}
#sub .paging ul li:last-child{margin-right: 0}
#sub .paging ul li a{display: block;width: 36px;line-height: 36px;font-size: 16px;color: #aaacb2;height: 36px;}
#sub .paging ul li.on a{border-radius: 8px;background: #11bced;color: #fff;}
#sub .paging ul li.btn a{height: 36px;text-indent: -9999px;width: 36px;line-height: 36px;}
#sub .paging ul li.prev a{background: url(/img/sub/prev.png)}
#sub .paging ul li.next a{background: url(/img/sub/next.png)}
/* .inner{width: 1280px;} */
#sub.field .con01{text-align: center;padding-bottom: 95px;border-bottom: 1px solid #d9dce0}
#sub.field .con01 strong{display: block;font-size: 26px;color: #1d2b55}
#sub.field .con01 p{font-size: 22px;line-height: 40px;color: #5a5e69;margin-top: 25px;}
#sub.field .con01 p span{color: #11bced}
#sub.field .con02{position: relative;padding-top: 105px;padding-left: 420px;;position: relative}
#sub.field .con02:before{content: '';display: block;width: 135px;height: 29px;background: url(/img/sub/field_deco.jpg);position: absolute;left: 50%;margin-left: -67px;top: -15px}
#sub.field .con02 .left{position: absolute;left: 0;}
#sub.field .con02 .left strong{display: block;color: #1d2b55;font-size: 26px;}
#sub.field .con02 .right p{font-size: 18px;color: #5a5e69;line-height: 36px;word-break: keep-all;}
#sub.field .con02 .right ul:after{content: '';display: block;clear: both;}
#sub.field .con02 .right ul li{float: left;width: 28%;margin-right: 8%;margin-top: 40px;}
#sub.field .con02 .right ul li:nth-child(3n){margin-right: 0}
#sub.field .con02 .right ul li img{display: block;max-width: 100%;display: block;margin: 0 auto}
#sub.field .con02 .right ul li strong:before{content: '';display: block;height: 49px;width: 9px;background: url(/img/sub/f_bul.jpg);margin: 0 auto;margin-bottom: 15px;}
#sub.field .con02 .right ul li strong{text-align: center;display: block;font-size: 18px;color: #464a58;}

#sub.strategy .con01 .tit{margin-bottom: 105px;text-align: center;}
#sub.strategy .con01 .tit strong{display: block;}
#sub.strategy .con01 ul:after{content: '';display: block;clear: both;}
#sub.strategy .con01 ul li{float: left;width: 30.4%;margin-right: 4.4%}
#sub.strategy .con01 ul li:last-child{margin-right: 0}
#sub.strategy .con01 ul li i{display: block;text-align: center;margin-bottom: 55px;}
#sub.strategy .con01 ul li i img{display: block;margin: 0 auto}
#sub.strategy .con01 ul li .img{position: relative;}
#sub.strategy .con01 ul li .img:before{content: '';display: block;width: 1px;height: 71px;background: url(/img/sub/stra_line.png);position: absolute;left: 50%;top: -55px;}
#sub.strategy .con01 ul li .img img{display: block;filter: drop-shadow(0 0 20px rgba(0,0,0,0.2));max-width: 100%}
#sub.strategy .con01 ul li .txt{text-align: center;padding-top: 30px;}
#sub.strategy .con01 ul li .txt strong{display: block;font-size: 24px;color: #1d2b55;margin-bottom: 15px;}
#sub.strategy .con01 ul li .txt p{font-size: 18px;line-height: 30px;color: #5a5e69;}
#sub.strategy .con01 ul li .txt p span{font-style: italic;}
#sub.cooperative .con{margin-bottom: 80px;}
#sub.cooperative .con ul:after{content: '';display: block;clear: both;}
#sub.cooperative .con ul{display: flex; flex-wrap: wrap; border-left: 1px solid #d9dce0}
#sub.cooperative .con ul li{float: left;border-top: 1px solid #d9dce0;border-right: 1px solid #d9dce0;box-sizing: border-box;width:25%}
#sub.cooperative .con ul li img{max-width: 100%;display: block;}
#sub.cooperative .con ul li.btm{border-bottom: 1px solid #d9dce0;}
#sub.cooperative .con .tit{margin-bottom: 25px;}
#sub.cooperative .con .tit strong{font-size: 26px;color: #1d2b55;}

#sub .loc03{text-align: center;width: 100%;margin: 0 auto;position: relative;overflow: }
#sub .loc03:before{content: '';display: block;width: 100%;height: 1px;background: #e9ecef;top: 8px;position: absolute;}
#sub .loc03 ul{position: relative;z-index: 1}
#sub .loc03 li{display: inline-block;margin-right: 85px;}
#sub .loc03 li:last-child{margin-right: 0}
#sub .loc03 li a{display: block;font-size: 20px;color: #b5bec9;}
#sub .loc03 li a:before{content: '';display: block;width: 17px;height: 17px;box-sizing: border-box;border: 5px solid #b5bec9;border-radius: 50%;margin: 0 auto;margin-bottom: 15px;}
#sub .loc03 li.on a:before{border-color: #00a4d3}
#sub .loc03 li.on a{font-weight: 500;color: #00a4d3}
#sub.tech {overflow: hidden;}
#sub.tech .con01{padding-top: 105px;margin-bottom: 80px;}
#sub.tech .con01 .tit{margin-bottom: 55px;text-align: center;}
#sub.tech .con01 .tit strong{color: #11bced;font-size: 30px;display: block;}
#sub.tech .con01 .txt{background: url(/img/sub/tech_bg01.jpg);padding: 95px 0;border-radius: 40px}
#sub.tech02 .con01 .txt{background: url(/img/sub/tech_bg02.jpg);}
#sub.tech03 .con01 .txt{background: url(/img/sub/tech_bg03.jpg);}
#sub.tech .con01 .txt p{display: block;font-size: 30px;line-height: 48px;color: #ffffff;text-align: center;font-weight: 500}
#sub.tech .con02{position: relative;padding-top: 80px;margin-bottom: 90px;}
#sub.tech .con02 .left{position: absolute;left: 0;background: #1d2b55;border-radius: 40px;top: 0}
#sub.tech .con02 .left .txt{padding: 60px 75px;position: relative;}
#sub.tech03 .con02 .left .txt{padding-top: 105px;padding-bottom: 105px;}
#sub.tech .con02 .left .txt strong{font-size: 24px;letter-spacing: -0.3px;line-height: 44px;color: #ffffff;font-weight: 500;position: relative;z-index: 3}
#sub.tech .con02 .left .txt:before{content: '';display: block;width: 248px;height: 276px;background: url(/img/sub/tech_icon.png);position: absolute;left: -70px;bottom: -85px}
#sub.tech .con02{padding-left: 250px;position: relative;}
#sub.tech .con02 .bg{position: absolute;right: -311px;top: 75px;z-index: -1}
#sub.tech .con02 .right{padding-left: 400px;background: #f7f8fa;border-radius: 40px;padding-top: 80px;padding-bottom: 80px;}
#sub.tech .con02 .right p{font-size: 20px;line-height: 36px;letter-spacing: -0.3px;color: #878a91;}
#sub.tech .con02 .right ul li{position: relative;padding-left: 24px;margin-top: 35px;}
#sub.tech .con02 .right ul li span{position: absolute;color: #d4e0ee;font-size: 26px;font-weight: 500;padding-left: 0;top: -7px;left: 0}
#sub.tech .con02 .right ul li p{position: relative;z-index: 2}

#sub.gmp01 .con01{text-align: center;margin-bottom: 90px;}
#sub.gmp01 .con01 strong, #sub.gmp02 .con01 p{display: block;font-size: 26px;color: #60636a;line-height: 48px;font-weight: 500;margin-bottom: 30px;}
#sub.gmp01 .con01 strong span{color: #00a4d3}
#sub.gmp01 .con01 p{font-size: 18px;color: #5a5e69;line-height: 34px;}
#sub.gmp01 .con02{text-align: center;}
#sub.gmp02 .con01 p{margin-bottom: 80px;}
#sub.gmp02 .con01 p span{color: #00a4d3}
#sub.gmp02 .con01 .img{display: inline-block;border-radius: 40px;overflow: hidden;box-shadow: 20px 20px 45px rgba(0,0,0,0.15)}
#sub.gmp02 .con01 .img img{display: block;}
#sub.gmp02 .con02{text-align: right;margin-top: -60px;}
#sub.gmp02 .con02 p{font-size: 18px;line-height: 34px;color: #5a5e69;margin-top: 40px;}

#sub.gmp03{overflow: hidden;}
#sub.gmp03 .con01{position: relative;}
#sub.gmp03 .con01 .img{border-radius: 40px 0 0 40px;overflow: hidden;width: 1600px;}
#sub.gmp03 .con01 .img img{display: block;}
#sub.gmp03 .con01 .product{position: absolute;bottom: -225px;right: -100px;}
#sub.gmp03 .con02{padding-top: 95px;margin-bottom: 90px;}
#sub.gmp03 .con02 strong{font-size: 40px;color: #60636a;line-height: 70px;letter-spacing: -0.5px;font-weight: 500;word-break: keep-all;}
#sub.gmp03 .con02 strong span{color: #00a4d3}
#sub.gmp03 .con03{border-top: 1px solid #d9dce0;border-bottom: 1px solid #d9dce0}
#sub.gmp03 .con03 .con{position: relative;padding-left: 360px;padding-top: 60px;}
#sub.gmp03 .con03 .con .left{position: absolute;left: 0}
#sub.gmp03 .con03 .con .right{padding-bottom: 60px;border-bottom: 1px solid #d9dce0}
#sub.gmp03 .con03 .con .left strong{font-size: 26px;color: #1d2b55;font-weight: 600}
#sub.gmp03 .con03 .con .right > ul > li{font-size: 20px;line-height: 42px;color: #42454c;font-weight: 500;position: relative;padding-left: 20px;}
#sub.gmp03 .con03 .con .right > ul > li:before{content: '';display: block;position: absolute;width: 7px;height: 7px;box-sizing: border-box;;border: 2px solid #42454c;border-radius: 50%;top: 17px;left: 0}
#sub.gmp03 .con03 .con .right > ul > li ul{margin-bottom: 30px;}
#sub.gmp03 .con03 .con_last .right > ul > li ul{margin-bottom: 0;}
#sub.gmp03 .con03 .con .right > ul > li ul li{font-size: 18px;line-height: 36px;color: #5a5e69;}
#sub.gmp03 .con03 .con_last .right{border-bottom: none}
#sub.gmp04 .con01{margin-bottom: 80px;}
#sub.gmp04 .con01 p{text-align: center;font-size: 20px;line-height: 40px;text-align: center;color: #60636a;word-break: keep-all;}
#sub.gmp04 .con01 p span{color: #11bced}
#sub.gmp04 .con02 > ul > li{position: relative;padding-left: 360px;padding-top: 40px;border-top: 1px solid #d9dce0}
#sub.gmp04 .con02 > ul > li .left{position: absolute;left: 0}
#sub.gmp04 .con02 > ul > li .left strong{font-size: 26px;color: #1d2b55;font-weight: 600}
#sub.gmp04 .con02 > ul > li .right ul:after{content: '';display: block;clear: both;}
#sub.gmp04 .con02 > ul > li .right ul li{float: left;width: 22.82%;margin-right: 2.9%;margin-bottom: 45px;}
#sub.gmp04 .con02 > ul > li .right ul li:last-child{margin-right: 0}
#sub.gmp04 .con02 > ul > li .right ul li img{display: block;max-width: 100%}
#sub.gmp04 .con02 > ul > li .right ul li strong{display: block;text-align: center;color: #5a5e69;font-weight: 400;margin-top: 18px;}
#sub.gmp04 .con02 > ul > li .right ul li strong:before{content: '';display: inline-block;width: 5px;height: 5px;box-sizing: border-box;border: 1px solid #626670;border-radius: 50%;vertical-align: middle;margin-right: 9px;}
#sub.gmp04 .sub_con{background: url(/img/sub/people_bg.png) no-repeat bottom left}
#sub.list_board .loc03{margin-bottom: 95px;}
#sub.list_board .list{margin-bottom: 40px;}
#sub.list_board .list ul:after{content: '';display: block;clear: both;}
#sub.list_board .list ul li{float: left;width: 31.25%;margin-right: 3.125%;margin-bottom: 3.125%}
#sub.list_board .list ul li:nth-child(3n){margin-right: 0}
#sub.list_board .list ul li .img{overflow: hidden;border-radius: 20px;position: relative;}
#sub.list_board .list ul li .img img{max-width: 100%}
#sub.list_board .list ul li .img:before{content: '';display: block;width: 100%;height: 100%;background: url(/img/sub/over.png);position: absolute;top: 0;left: 0;transition: 0.8s;opacity: 0}
#sub.list_board .list ul li:hover .img:before{opacity: 1}
#sub.list_board .list ul li .img img{display: block;}
#sub.list_board .list ul li .txt{padding-top: 20px;}
#sub.list_board .list ul li .txt strong{display: block;font-size: 18px;line-height: 30px;color: #373b44;overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;
height: 60px;}
#sub.list_board .list ul li .txt strong br{display: none}
#sub.list_board .list ul li .txt span{display: block;color: #bfc1c6;font-size: 16px;margin-top: 15px;}
#sub.list_board .list table{width: 100%;border-collapse: collapse;border-top: 1px solid #d9dce0;}
#sub.list_board .list table td{border-bottom: 1px solid #d9dce0;height: 80px;text-align: center;color: #5a5e69;font-size: 18px;}
#sub.list_board .list table td.notice{border-left: 3px solid #00a4d3}
#sub.list_board .list table td.notice span{display: block;width: 80px;line-height: 33px;text-align: center;background: #00a4d3;border-radius: 10px;margin: 0 auto;font-size: 14px;color: #ffffff;max-width: 90%}
#sub.list_board .list table td.tit{width: 70%;text-align: left;}
#sub.list_board .list table td.tit2{width: 60%;}
#sub.list_board .list table td.cate span.job{width: 60px;line-height: 33px;background: #23315a;border-radius: 10px;color: #ffffff;font-size: 14px;font-weight: 600;display: inline-block;;}
#sub.list_board .list table td.cate span.status{width: 60px;line-height: 29px;;border-radius: 10px;color: #8b9dae;font-size: 14px;font-weight: 600;display: inline-block;border: 2px solid #8b9dae;width: 72px;margin-left: 4px;}
#sub.list_board .list table td.cate span.status.on{color: #00a4d3;border-color: #00a4d3}
#sub.list_board .list table td.tit a{font-size: 20px;color: #5a5e69;font-weight: 500}
#sub.list_board .list table td.num{width: 10%;}
#sub .sch_area02{margin-bottom: 50px;}
#sub .sch_area02:after{content: '';display: block;clear: both;}
#sub .sch_area02 .sch_w{float: right}
#sub .sch_area02 .sch_w input{height: 43px;border: none;width: 240px;background: #f4f6f8;border-radius: 10px}
#sub .sch_area02 .sch_w button{background: #11bced;border-radius: 10px;overflow: hidden;margin-left: 10px;}
#sub .sch_area02 .sch_w button img{display: block;}

#sub.view .tit{padding-bottom: 40px;border-bottom: 1px solid #e9ecef}
#sub.view .tit ul{margin-bottom: 20px;}
#sub.view .tit ul:after{content: '';display: block;clear: both;}
#sub.view .tit ul li{float: left;font-size: 18px;color: #aaacb2;}
#sub.view .tit ul li:nth-child(1){color: #16bae9;font-weight: 600;margin-right: 30px;}
#sub.view .tit strong{font-size: 36px;color: #3a3c42;font-weight: 500}

#sub.view .tit{position: relative;}
#sub.view .tit .cate{position: absolute;right: 0;text-align: center;bottom: 40px;}
#sub.view .tit .cate span.job{width: 60px;line-height: 33px;background: #23315a;border-radius: 10px;color: #ffffff;font-size: 14px;font-weight: 600;display: inline-block;;}
#sub.view .tit .cate span.status{width: 60px;line-height: 29px;;border-radius: 10px;color: #8b9dae;font-size: 14px;font-weight: 600;display: inline-block;border: 2px solid #8b9dae;width: 72px;margin-left: 4px;}
#sub.view .tit .cate span.status.on{color: #00a4d3;border-color: #00a4d3}
#sub.view .txt{min-height: 550px;border-bottom: 1px solid #e9ecef;padding: 50px 0;box-sizing: border-box;margin-bottom: 60px;}
#sub.view .btn_area{position: relative;height: 62px;}
#sub.view .btn_area .prev{position: absolute;left: 0;background: url(/img/sub/more_prev.jpg) no-repeat left center;padding-left: 26px;transition: 0.6s}
#sub.view .btn_area .prev:hover{background: url(/img/sub/more_prev_on.jpg) no-repeat left center;;}
#sub.view .btn_area .next{position: absolute;right: 0;background: url(/img/sub/more_next.jpg) no-repeat right center;padding-right: 26px;transition: 0.6s}
#sub.view .btn_area .next:hover{background: url(/img/sub/more_next_on.jpg) no-repeat right center;;}
#sub.view .btn_area .btn a{display: block;font-size: 18px;color: #afb5bb;line-height: 62px;transition: 0.6s}
#sub.view .btn_area .btn a:hover{color: #00a4d3}
#sub.view .btn_area .list_btn a{display: block;width: 62px;margin: 0 auto}

#sub.view .frame{ position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;margin-top: 10px;}
#sub.view .frame iframe{ position:absolute; top:0; left:0; width:100%; height:100%; }
#sub.company{overflow: hidden;}
#sub.company .con01 .n_logo{margin-bottom: 130px;}
#sub.company .con01 .n_logo img{display: block;margin: 0 auto}
#sub.company .con02{margin-bottom: 100px;}
#sub.company .con02 .img{overflow: hidden;border-radius: 40px}
#sub.company .con02 .img img{display: block;}
#sub.company .con02 .txt{margin-top: -45px;padding-left: 85px;}
#sub.company .con02 .txt p{font-size: 26px;line-height: 48px;color: #5a5e69;margin-top: 35px;}
#sub.company .con02 .txt p span{font-weight: 600}
#sub.company .con03{position: relative;min-height: 580px;}
#sub.company .con03 .con{position: relative;z-index: 2;padding-left: 524px;padding-top: 145px;}
#sub.company .con03 .con .left{position: absolute;left: -36px;}
#sub.company .con03 .con .left ul li{position: relative;}
#sub.company .con03 .con .left ul li a{display: block;width: 430px;line-height: 92px;padding-left: 108px;font-size: 26px;color: #fefefe;font-weight: 600;font-family: 'Orbitron', sans-serif;border-radius: 20px;box-sizing: border-box;position: relative;}
#sub.company .con03 .con .left ul li a:before{content: '';display: block;width: 89px;height: 2px;background: #ffffff;position: absolute;top: 50%;margin-top: -1px;right: -58px;width: 0}
#sub.company .con03 .con .left ul li.on a:before{width: 89px}
#sub.company .con03 .con .left ul li.on a{background: #16bae9}

#sub.company .con03 .con .right{padding-top: 30px;}
#sub.company .con03 .con .right > ul >li{display: none}
#sub.company .con03 .con .right > ul > li.on{display: block}
#sub.company .con03 .con .right > ul > li .txt strong{display: block;font-size: 32px;color: #ffffff;font-weight: 600;margin-bottom: 20px;}
#sub.company .con03 .con .right > ul > li .txt p{display: block;font-size: 26px;color: #ffffff;line-height: 48px;}
#sub.company .con03 .con .right > ul > li ul:after{content: '';display: block;clear: both;}
#sub.company .con03 .con .right > ul > li ul li{float: left;text-align: center;margin-right: 70px}
#sub.company .con03 .con .right > ul > li ul li:last-child{margin-right: 0}
#sub.company .con03 .con .right > ul > li ul li i{display: block;margin-bottom: 20px;}
#sub.company .con03 .con .right > ul > li ul li i img{display: block;margin: 0 auto;border-radius: 50%;box-shadow: 15px 15px 30px rgba(0,0,0,0.2)}
#sub.company .con03 .con .right > ul > li ul li strong{display: block;font-size: 26px;color: #ffffff;font-weight: 500;margin-bottom: 25px;}
#sub.company .con03 .con .right > ul > li ul li p{display: block;font-size: 20px;color: #ffffff;}
#sub.company .con03 .bg{position: absolute;top: 0;left: 0;overflow: hidden;border-radius: 60px 0 0 60px;}
#sub.company .con03 .bg img{display: block;}
#sub.pipeline .pipe_loc{position: relative;margin-bottom: 100px;}
#sub.pipeline .pipe_loc ul{position: absolute;width: 100%;height: 100%;top: 0;left: 0}
#sub.pipeline .pipe_loc ul li{width: 12.5%;float: left;display: block;height: 100%}
#sub.pipeline .pipe_loc ul li a{display: block;width: 100%;height: 100%;text-indent: -9999px;}
#sub.pipeline .con01{margin-bottom: 105px;}
#sub.pipeline .con01 .tit strong{display: block;font-size: 30px;color: #11bced;font-weight: 500;text-align: center;margin-bottom: 55px;}
#sub.pipeline .con01 .txt{background: url(/img/sub/pipe_bg01.jpg) center center;width: 100%;height: 335px;display: table;border-radius: 40px;}
#sub.pipeline.pipeline02 .con01 .txt{background: url(/img/sub/pipe_bg02.jpg) center center;}
#sub.pipeline.pipeline03 .con01 .txt{background: url(/img/sub/pipe_bg03.jpg) center center;}
#sub.pipeline.pipeline04 .con01 .txt{background: url(/img/sub/pipe_bg04.jpg) center center;}
#sub.pipeline.pipeline05 .con01 .txt{background: url(/img/sub/pipe_bg05.jpg) center center;}
#sub.pipeline.pipeline06 .con01 .txt{background: url(/img/sub/pipe_bg06.jpg) center center;}
#sub.pipeline.pipeline07 .con01 .txt{background: url(/img/sub/pipe_bg07.jpg) center center;}
#sub.pipeline.pipeline08 .con01 .txt{background: url(/img/sub/pipe_bg08.jpg) center center;}

#sub.pipeline .pipe_loc2{position: relative;width: 1240px;margin: 0 auto;max-width: 100%;margin-bottom: 70px;}
#sub.pipeline .pipe_loc2 img{width: 100%}
#sub.pipeline .pipe_loc2{position: relative}
#sub.pipeline .pipe_loc2 ul li{position: absolute;background: #000;;width: 16%;height: 10%;opacity: 0}
#sub.pipeline .pipe_loc2 ul li a{display: block;width: 100%;height: 100%}
#sub.pipeline .pipe_loc2 ul li.btn08{right: 0;top: 23%}
#sub.pipeline .pipe_loc2 ul li.btn07{left: 0;top: 29.5%}
#sub.pipeline .pipe_loc2 ul li.btn06{left: 0;top: 1.5%}
#sub.pipeline .pipe_loc2 ul li.btn05{left: 0;top: 15.5%}
#sub.pipeline .pipe_loc2 ul li.btn03{left: 0;top: 43.7%}
#sub.pipeline .pipe_loc2 ul li.btn04{bottom: 7.5%;left: 59%;}
#sub.pipeline .pipe_loc2 ul li.btn02{bottom: 1.3%;left: 42.3%;}
#sub.pipeline .pipe_loc2 ul li.btn01{bottom: 7.5%;left: 25.8%;}
#sub.pipeline .con01 .txt div{display: table-cell;width: 100%;vertical-align: middle;text-align: center;}
#sub.pipeline .con01 .txt div strong{font-size: 30px;font-weight: 500;color: #ffffff;line-height: 48px;}
#sub.pipeline .con02{margin-bottom: 120px;}
#sub.pipeline .con03{background: #f7f8fa url(/img/sub/pipe_bg.jpg) no-repeat bottom left;border-radius: 40px;padding: 60px 70px;margin-bottom: 100px;}
#sub.pipeline .con03 p{font-size: 20px;color: #878a91;line-height: 36px;}
#sub.pipeline .con03 p span{font-weight: 600;color: #878a91}
#sub.pipeline .con04 .graph{position: relative;padding: 9px 0}
#sub.pipeline .con04 .graph ul li{position: relative;padding: 16px 0}
#sub.pipeline .con04 .graph ul li:after{content: '';display: block;clear: both;}
#sub.pipeline .con04 .graph ul li > div{float: left;}
#sub.pipeline .con04 .graph ul li .tit{;width: 14.28571428571429%}
#sub.pipeline .con04 .graph ul li .tit strong{line-height: 18px;display: block;font-size: 18px;}
#sub.pipeline .con04 .graph ul li .tit strong:before{content: '';display: inline-block;width: 9px;height: 9px;border: 2px solid #00a4d3;box-sizing: border-box;border-radius: 50%;vertical-align: middle;position: relative;top: -3px;margin-right: 10px;}
#sub.pipeline .con04 .graph ul li .bar{width: 85.71428571428571%;height: 13px;background: #f7f8fa;position: relative;}
#sub.pipeline .con04 .graph ul li .bar i{position: absolute;width: 0;height: 100%;border-radius: 0 9px 9px 0;background: #bcd9e9;transition:1.2s}
#sub.pipeline .con04 .graph ul li.on .bar i{background: url(/img/sub/bar_on.jpg) no-repeat center center;}
#sub.pipeline .con04 .graph ul li .bar .tag{position: absolute;left: 50%;margin-left: -66.5px;top: -45px;}
#sub.pipeline .con04 .graph ul li .bar .tag span{display: block;width: 133px;line-height: 33px;color: #fff;background: #11bced;font-size: 16px;color: #ffffff;font-weight: 500;text-align: center;border-radius: 2px;}
#sub.pipeline .con04 .graph ul li .bar05 .tag{left: 100%;margin-left: -108.5px;}
#sub.pipeline .con04 .graph ul li .bar06 .tag{left: 100%;margin-left: -108.5px;}
#sub.pipeline .con04 .graph ul li .bar06 .tag01{left: 16.66%;}
#sub.pipeline .con04 .graph ul li .bar06 .tag02{left: 50%;}
#sub.pipeline .con04 .graph ul li .bar05 .tag span{width: 217px;}
#sub.pipeline .con04 .graph ul li .bar06 .tag span{width: 217px;}
#sub.pipeline .con04 .graph ul li .bar .tag span:before{content: '';display: block;width: 11px;height: 6px;background: url(/img/sub/tag_line.png);position: absolute;left: 50%;margin-left: -5.5px;bottom: -6px;}
#sub.pipeline .con04 .graph ul li:nth-child(1) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(2) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(3) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(4) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(5) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(6) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(7) .bar i{width: 0%}
#sub.pipeline .con04 .graph ul li:nth-child(8) .bar i{width: 0%}

#sub.pipeline .con04.on .graph ul li:nth-child(1) .bar i{width: 66.66666666666668%}
#sub.pipeline .con04.on .graph ul li:nth-child(2) .bar i{width: 50%}
#sub.pipeline .con04.on .graph ul li:nth-child(3) .bar i{width: 50%}
#sub.pipeline .con04.on .graph ul li:nth-child(4) .bar i{width: 50%}
#sub.pipeline .con04.on .graph ul li:nth-child(5) .bar i{width: 100%}
#sub.pipeline .con04.on .graph ul li:nth-child(6) .bar i{width: 50%}
#sub.pipeline .con04.on .graph ul li:nth-child(7) .bar i{width: 50%}
#sub.pipeline .con04.on .graph ul li:nth-child(8) .bar i{width: 16.66666666666667%}


#sub.pipeline .con04 .info{padding-left: 14.28571428571429%;padding-top: 30px;}
#sub.pipeline .con04 .info ul li{float: left;width: 16.66666666666667%;height: 20px;position: relative;}
#sub.pipeline .con04 .info ul li span{display: block;position: absolute;width: 100%;right: 50%;text-align: center;font-size: 18px;color: #878a91;}
#sub.pipeline .con04 .info ul li span.last{left: 50%}
/*  */
#sub.pipeline .con04 .txt{margin-bottom: 40px;}
#sub.pipeline .con04 .txt strong{display: block;font-size: 24px;color: #232838;font-weight: 500}
#sub.pipeline .con04 .graph{position: relative;}
#sub.pipeline .con04 .graph i.line{position: absolute;height: 100%;width: 1px;background: #d9e2ea;top: 0}
#sub.pipeline .con04 .graph i.line01{left: 14.28571428571429%}
#sub.pipeline .con04 .graph i.line02{left: 28.57142857142858%}
#sub.pipeline .con04 .graph i.line03{left: 42.85714285714287%}
#sub.pipeline .con04 .graph i.line04{left: 57.14285714285716%}
#sub.pipeline .con04 .graph i.line05{left: 71.42857142857145%}
#sub.pipeline .con04 .graph i.line06{left: 85.71428571428574%}
#sub.pipeline .con04 .graph i.line07{left: 100%}

#sub.product .con01{text-align: center;}
#sub.product .con01 p{font-size: 26px;color: #5a5e69;line-height: 48px;;}
#sub.product .con01 span{font-size: 26px !important;color: #5a5e69 !important;line-height: 48px !important;;}
#sub.product .con01 p *{font-size: inherit !important;color: inherit !important;line-height: inherit !important}

#sub.product .con01 .img{margin-top: 100px;}
#sub.product .con02{background: #f7f8fa;padding: 55px 40px;border-radius: 20px;margin-top: 60px;}
#sub.product .con02 > ul > li{margin-bottom: 30px;}
#sub.product .con02 ul > li:last-child{margin-bottom: 0}
#sub.product .con02 ul li strong{display: block;font-size: 22px;color: #232838;font-weight: 600;margin-bottom: 10px;}
#sub.product .con02 ul li strong:before{content: '';display: inline-block;width: 9px;height: 9px;box-sizing: border-box;;border: 2px solid #00a4d3;border-radius: 50%;vertical-align: middle;position: relative;top: -4px;margin-right: 10px;}
#sub.product .con02 ul li ul{padding-left: 20px;}
#sub.product .con02 ul li ul li{display: block;font-size: 18px;color: #5a5e69;padding-left: 9px;position: relative;word-break: keep-all;}
#sub.product .con02 ul li ul li:before{content: '';display: block;width: 4px;height: 4px;background: #5a5e69;border-radius: 50%;position: absolute;left: 0;top: 11px;}
#sub.product .con03 .wrap{transform: scale(0.8);border-radius: 20px;overflow: hidden;position: relative;background: #000}
#sub.product .con03 .wrap img{display: block;opacity: 0.8}
#sub.product .con03 .swiper-slide-active .wrap img{display: block;opacity: 1}
#sub.product .con03 .swiper-slide-active{z-index: 9999 !important}
#sub.product .con03 .swiper-slide-active .wrap{transform: scale(1);;transition: transform 1s;box-shadow: 0 0 30px rgba(0,0,0,0.1)}
#sub.product .con03 .swiper-slide{padding-top: 90px;padding-bottom: 90px;}
#sub.product .con03 .swiper-slide-prev .wrap{right: -356px;}
#sub.product .con03 .swiper-slide-next .wrap{left: -356px;}
#sub.product .con03 .swiper-pagination-progressbar{top: auto;bottom: 0;background: #e4e6eb;height: 3px;}
#sub.product .con03 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #00a4d3}

#sub.contact .con01{margin-bottom: 110px;}
#sub.contact .con01 ul:after{content: '';display: block;clear: both;}
#sub.contact .con01 ul li{float: left;width: 48.4375%;margin-right: 3.125%}
#sub.contact .con01 ul li:last-child{margin-right: 0}
#sub.contact .con01 ul li .img{overflow: hidden;border-radius: 20px;}
#sub.contact .con01 ul li .img .root_daum_roughmap{width: 100% !important;height: 100% !important}
#sub.contact .con01 ul li .img .root_daum_roughmap .wrap_map{height: 100% !important}
#sub.contact .con01 ul li .img{height: 385px;}
#sub.contact .con01 ul li .img img{display: block;}
#sub.contact .con01 ul li .txt > *{display: inline-block;vertical-align: middle;}
#sub.contact .con01 ul li .txt{margin-top: 30px;}
#sub.contact .con01 ul li .txt strong{font-size: 26px;font-weight: 600;color: #232838;margin-right: 30px;}
#sub.contact .con01 ul li .txt p{font-size: 22px;color: #5a5e69;font-weight: 500}
#sub.contact .con02 .tit_w strong{display: block;font-size: 26px;color: #1d2b55;margin-bottom: 15px;font-weight: 600}
#sub.contact .con02 ul{border-top: 1px solid #1d2b55;padding-top: 35px;}
#sub.contact .con02 ul li{position: relative;padding-left: 155px;margin-bottom: 20px;}
#sub.contact .con02 ul li .txt{position: absolute;left: 0;}
#sub.contact .con02 ul li .txt span{display: block;line-height: 54px;font-size: 18px;color: #5a5e69;font-weight: 500}
#sub.contact .con02 ul li input, #sub.contact .con02 ul li textarea{display: block;border: 1px solid #d9dce0;border-left:2px solid #1d2b55; border-radius: 0 8px 8px 0;padding-left: 25px;box-sizing: border-box;}
#sub.contact .con02 ul li input{height: 54px;width: 33.5%}
 #sub.contact .con02 ul li textarea{width: 100%;height: 235px;padding-top: 20px;}

 #sub.contact .con02 .chk_txt{margin-top: 50px;margin-bottom: 25px;}
 #sub.contact .con02 .chk_txt .tit strong{font-size: 24px;color: #3b3f4d;font-weight: 500}
 #sub.contact .con02 .chk_txt .txt{padding: 33px;background: #f7f8fa;border-radius: 20px;margin-top: 20px;}
 #sub.contact .con02 .chk_txt .txt p{color: #5a5e69;font-size: 18px;line-height: 40px;}

 #sub.contact .con02 .chk_w{text-align: center;}
 #sub.contact .con02 .chk_w > div{display: inline-block;position: relative;}
  #sub.contact .con02 .chk_w > div input{position: absolute;width: 100%;height: 100%;opacity: 0;left: 0;top: 0}
 #sub.contact .con02 .chk_w > div > *{display: inline-block;vertical-align: middle;}
 #sub.contact .con02 .chk_w > div div{width: 12px;height: 12px;box-sizing: border-box;border: 1px solid #5a5e69;position: relative;margin-right: 5px;}
 #sub.contact .con02 .chk_w > div div:after{content: '';display: block;width: 6px;height: 6px;background: #11bced;position: absolute;top: 50%;left: 50%;margin-top: -3px;margin-left: -3px;display: none}
 #sub.contact .con02 .chk_w > div.on div:after{display: block;}
 #sub.contact .con02 .chk_w > div p{font-size: 18px;color: #5a5e69;}
 #sub.contact .con02 .submit_btn{margin-top: 50px;}
 #sub.contact .con02 .submit_btn a{display: block;width: 255px;line-height: 56px;background: #11bced;border-radius: 10px;margin: 0 auto;padding-left: 25px;font-weight: 500;color: #ffffff;font-size: 18px;position: relative;}
 #sub.contact .con02 .submit_btn a:before{content: '';display: block;width: 52px;height: 2px;background: #ffffff;position: absolute;right: 0;top: 50%;margin-top: -1px;}
 #sub.history .con01{margin-bottom: 100px}
 #sub.history .con01 .img{border-radius: 0 60px 60px 0;overflow: hidden;display: inline-block;box-shadow: 6px 10px 51px 0px rgba(114, 114, 114, 0.2);
}
#sub.history .sub_con{padding-bottom: 300px;background: url(/img/sub/his_img.jpg) no-repeat bottom left}
 #sub.history .con01 .img img{display: block;}
 #sub.history .con02 > ul > li{position: relative;padding-bottom: 90px;}
 #sub.history .con02 > ul > li .year{text-align: right}
 #sub.history .con02 > ul > li .year strong{display: inline-block;;font-size: 100px;line-height: 100px;color: #e4e6ee;font-family: 'Orbitron', sans-serif;padding-right: 105px;position: relative;transition: 0.6s}
 #sub.history .con02 > ul > li .year strong:before{content: '';display: block;width: 69px;height: 1px;background: #1d2b55;position: absolute;top: 50%;left: -110px;opacity: 0}
 #sub.history .con02 > ul > li .year strong.year2{letter-spacing: 10px;}
 #sub.history .con02 > ul > li.on .year strong:before{opacity: 1}
 #sub.history .con02 > ul > li.on .year strong{color: #1d2b55}
 #sub.history .con02 > ul > li:hover .year strong{color: #1d2b55}
 #sub.history .con02 > ul > li > ul {position: absolute;right: 584px;top: 30px;display: none}
  #sub.history .con02 > ul > li.on > ul{display: block;}
 #sub.history .con02 > ul > li > ul li{text-align: right;font-size: 20px;color: #5a5e69;line-height: 50px;margin-bottom: 15px;padding-right: 70px;}
#sub.history .con02 > ul > li > ul li b{position: absolute;right: 0;font-size: 26px;color: #1d2b55;font-weight: 600}
#sub.pipeline .con02 img{max-width: 100%}
#sub.pipeline.pipeline08 .con02 .img img{width: 600px;display: block;margin: 0 auto;max-width: 100%}

#sub.vision .sub_con{background: url(/img/sub/vision_bg.jpg) no-repeat center bottom;padding-bottom: 247px;}
#sub.vision .vi_list ul{text-align: center;padding-right: 40px}
#sub.vision .vi_list ul li{display: inline-block;vertical-align: top;margin-right: 73px;position: relative;}
/* #sub.vision .vi_list ul li:nth-child(1){left: -10} */
#sub.vision .vi_list ul li:last-child{margin-right: 0}
#sub.vision .vi_list ul li .img{border-radius: 20px;position: relative;}
#sub.vision .vi_list ul li .img .img_w{border-radius: 20px;overflow: hidden;box-shadow: 0 0 15px rgba(0,0,0,0.2)}
#sub.vision .vi_list ul li .img:before{content: '';display: block;width: 1px;left: 50%;top: 100%;border-left: 1px dashed #c7cfdc;position: absolute;}
#sub.vision .vi_list ul li .img:after{content: '';display: block;width: 9px;height: 9px;border-radius: 50%;box-sizing: border-box;left: 50%;margin-left: -4px;border: 2px solid #cad4d7;position: absolute;z-index: 5}
#sub.vision .vi_list ul li:nth-child(1) .img:before{height: 367px;}
#sub.vision .vi_list ul li:nth-child(2) .img:before{height: 265px;}
#sub.vision .vi_list ul li:nth-child(3) .img:before{height: 210px;}
#sub.vision .vi_list ul li:nth-child(4) .img:before{height: 165px;}
#sub.vision .vi_list ul li:nth-child(5) .img:before{height: 40px;}

#sub.vision .vi_list ul li:nth-child(1) .img:after{bottom: -376px;}
#sub.vision .vi_list ul li:nth-child(2) .img:after{bottom: -274px;border-color: #a8bec4}
#sub.vision .vi_list ul li:nth-child(3) .img:after{bottom: -219px;border-color: #11bced}
#sub.vision .vi_list ul li:nth-child(4) .img:after{bottom: -174px;border-color: #1550a1}
#sub.vision .vi_list ul li:nth-child(5) .img:after{bottom: -49px;border-color: #1d2b55}
#sub.vision .vi_list ul li .img img{display: block;}
#sub.vision .vi_list ul li:nth-child(1) .img{margin-bottom: 420px}
#sub.vision .vi_list ul li:nth-child(2) .img{margin-bottom: 313px}
#sub.vision .vi_list ul li:nth-child(3) .img{margin-bottom: 260px}
#sub.vision .vi_list ul li:nth-child(4) .img{margin-bottom: 260px}
#sub.vision .vi_list ul li:nth-child(5) .img{margin-bottom: 90px}
#sub.vision .vi_list ul li i{display: block;background: #cad4d7;width: 74px;line-height: 60px;border-radius: 20px; margin: 0 auto;font-family: 'Orbitron', sans-serif;font-style: normal;font-size: 24px;color: #fefefe;font-weight: 600;margin-bottom: 20px;}
#sub.vision .vi_list ul li:nth-child(2) i{background: #a8bec4}
#sub.vision .vi_list ul li:nth-child(3) i{background: #11bced}
#sub.vision .vi_list ul li:nth-child(4) i{background: #1550a1}
#sub.vision .vi_list ul li:nth-child(5) i{background: #1d2b55}

#sub.vision .vi_list ul li strong{display: block;font-size: 20px;color: #1d2b55;line-height: 30px;font-weight: 500}

#sub .sub_tit strong{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub .sub_tit.on strong{transform: translateY(0);opacity: 1;}
#sub.company .con01 .n_logo, #sub.greeting .con01 .n_logo, #sub.ci .con01 .n_logo{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.company .con01.on .n_logo, #sub.greeting .con01.on .n_logo, #sub.ci .con01.on .n_logo{transform: translateY(0);opacity: 1;}
#sub.company .con02 .img{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.company .con02.on .img{transform: translateY(0);opacity: 1;}
#sub.company .con02 .txt{position: relative;z-index: 2}
#sub.company .con02 .txt strong{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.company .con02.on .txt strong{transform: translateY(0);opacity: 1;}
#sub.company .con02 .txt p{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.9s}
#sub.company .con02.on .txt p{transform: translateY(0);opacity: 1;}
#sub.company .con03 .bg{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.company .con03.on .bg{transform: translateY(0);opacity: 1;}
#sub.company .con03 .con{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.company .con03.on .con{transform: translateY(0);opacity: 1;}

#sub.company .con03 .con .right > ul > li .txt strong{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.0s}
#sub.company .con03 .con .right > ul > li.act .txt strong{transform: translateY(0);opacity: 1;}
#sub.company .con03 .con .right > ul > li .txt p{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.company .con03 .con .right > ul > li.act .txt p{transform: translateY(0);opacity: 1;}

#sub.company .con03 .con .right > ul > li ul{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.company .con03 .con .right > ul > li.act ul{transform: translateY(0);opacity: 1;}


#sub.greeting .con01 .img .img_w{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.greeting .con01.on .img .img_w{transform: translateY(0);opacity: 1;}
#sub.greeting .con01 .img .b_logo{transform: translateX(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.9s}
#sub.greeting .con01.on .img .b_logo{transform: translateX(0);opacity: 1;}

#sub.greeting .con02 .left{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.0s}
#sub.greeting .con02.on .left{transform: translateY(0);opacity: 1;}
#sub.greeting .con02 .right{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.greeting .con02.on .right{transform: translateY(0);opacity: 1;}
#sub.ci .tit strong{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.ci .on .tit strong{transform: translateY(0);opacity: 1;}
#sub.ci .con01 p{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.9s}
#sub.ci .con01.on p{transform: translateY(0);opacity: 1;}
#sub.ci .con02 ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.ci .con02 ul li:nth-child(2){transition-delay: 0.3s}
#sub.ci .con02 ul li:nth-child(3){transition-delay: 0.6s}
#sub.ci .con02.on ul li{transform: translateY(0);opacity: 1;}
#sub.ci .con04 .tit strong{transition-delay: 0}
#sub.ci .con03 .txt{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.9s}
#sub.ci .con03.on .txt{transform: translateY(0);opacity: 1;}

#sub.ci .con04 ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.ci .con04.on ul li{transform: translateY(0);opacity: 1;}
#sub.ci .con04 ul li:nth-child(2){transition-delay: 0.6s}
#sub.ci .con04 ul li:nth-child(3){transition-delay: 0.9s}

#sub.people .con01 .c01{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.people .con01.on .c01{transform: translateY(0);opacity: 1;}
#sub.people .con01 .c02{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.people .con01.on .c02{transform: translateY(0);opacity: 1;}

#sub.people .con02 ul{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.people .con02.on ul{transform: translateY(0);opacity: 1;}

#sub.contact .con01 ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.contact .con01.on ul li{transform: translateY(0);opacity: 1;}
#sub.contact .con01 ul li:nth-child(1){transition-delay: 0.6s}
#sub.contact .con01 ul li:nth-child(2){transition-delay: 0.9s}

#sub.field .con01 strong{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.field .con01.on strong{transform: translateY(0);opacity: 1;}
#sub.field .con01 p{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.field .con01.on p{transform: translateY(0);opacity: 1;}
#sub.field .con02 .left{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.field .con02.on .left{transform: translateY(0);opacity: 1;}
#sub.field .con02 .right p{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.field .con02.on .right p{transform: translateY(0);opacity: 1;}
#sub.field .con02 .right ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.field .con02.on .right ul li{transform: translateY(0);opacity: 1;}
#sub.field .con02 .right ul li:nth-child(1){transition-delay: 0.9s}
#sub.field .con02 .right ul li:nth-child(2){transition-delay: 1.2s}
#sub.field .con02 .right ul li:nth-child(3){transition-delay: 1.5s}
#sub.field .con02 .right ul li:nth-child(4){transition-delay: 1.8s}
#sub.field .con02 .right ul li:nth-child(5){transition-delay: 2.1s}
#sub.field .con02 .right ul li:nth-child(6){transition-delay: 2.4s}

#sub.strategy .con01 .tit{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.strategy .con01.on .tit{transform: translateY(0);opacity: 1;}

#sub.strategy .con01 ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.strategy .con01.on ul li{transform: translateY(0);opacity: 1;}
#sub.strategy .con01 ul li:nth-child(2){transition-delay: 1.2s}
#sub.strategy .con01 ul li:nth-child(3){transition-delay: 1.5s}
#sub.cooperative .con{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.cooperative .con.on{transform: translateY(0);opacity: 1;}

#sub.tech .loc03{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.tech .loc03.on{transform: translateY(0);opacity: 1;}
#sub.tech .con01 .tit{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.tech .con01.on .tit{transform: translateY(0);opacity: 1;}
#sub.tech .con01 .txt{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.9s}
#sub.tech .con01.on .txt{transform: translateY(0);opacity: 1;}

#sub.tech .con02 .left{transform: translateX(-70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;z-index: 5}
#sub.tech .con02.on .left{transform: translateX(0);opacity: 1;}
#sub.tech .con02 .right{transform: translateX(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.tech .con02.on .right{transform: translateX(0);opacity: 1;}
#sub.tech .con03{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.tech .con03.on{transform: translateY(0);opacity: 1;}

#sub.pipeline .pipe_loc{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.pipeline .pipe_loc.on{transform: translateY(0);opacity: 1;}


#sub.gmp02 .con01 p{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp02 .con01.on p{transform: translateY(0);opacity: 1;}
#sub.gmp02 .con01 .img{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.gmp02 .con01.on .img{transform: translateY(0);opacity: 1;}
#sub.gmp02 .con02 i{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0s}
#sub.gmp02 .con02.on i{transform: translateY(0);opacity: 1;}
#sub.gmp02 .con02 p{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp02 .con02.on p{transform: translateY(0);opacity: 1;}
#sub.gmp01 .con01 strong{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp01 .con01.on strong{transform: translateY(0);opacity: 1;}
#sub.gmp01 .con01 p{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.gmp01 .con01.on p{transform: translateY(0);opacity: 1;}
#sub.gmp01 .con02{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.gmp01 .con02.on{transform: translateY(0);opacity: 1;}
#sub.gmp03 .con01 .img{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp03 .con01.on .img{transform: translateY(0);opacity: 1;}
#sub.gmp03 .con01 .product{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.gmp03 .con01.act .product{transform: translateY(0);opacity: 1;}
#sub.gmp03 .con02 strong{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.gmp03 .con02.on strong{transform: translateY(0);opacity: 1;}
#sub.gmp03 .con03{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.gmp03 .con03.on{transform: translateY(0);opacity: 1;}

#sub.gmp04 .con01 p{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp04 .con01.on p{transform: translateY(0);opacity: 1;}
#sub.gmp04 .con02 > ul > li{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.gmp04 .con02.on > ul > li{transform: translateY(0);opacity: 1;}
#sub.product .con01 p{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.product .con01.on p{transform: translateY(0);opacity: 1;}
#sub.product .con01 .img{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.6s}
#sub.product .con01.on .img{transform: translateY(0);opacity: 1;}
#sub.product .con02{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.product .con02.on{transform: translateY(0);opacity: 1;}
#sub.product .con03{display: block;transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.product .con03.on{transform: translateY(0);opacity: 1;}

#sub.vision .vi_list ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.vision .vi_list.on ul li{transform: translateY(0);opacity: 1;}
#sub.vision .vi_list ul li:nth-child(2){transition-delay: 0.6s}
#sub.vision .vi_list ul li:nth-child(3){transition-delay: 0.9s}
#sub.vision .vi_list ul li:nth-child(4){transition-delay: 1.2s}
#sub.vision .vi_list ul li:nth-child(5){transition-delay: 1.5s}

#sub.history .con02 > ul > li > ul li{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;}
#sub.history .con02 > ul > li.act > ul li{transform: translateY(0);opacity: 1;}
#sub.history .con02 > ul > li > ul li:nth-child(2){transition-delay: 0.3s}
#sub.history .con02 > ul > li > ul li:nth-child(3){transition-delay: 0.6s}
#sub.history .con02 > ul > li > ul li:nth-child(4){transition-delay: 0.9s}
#sub.history .con02 > ul > li > ul li:nth-child(5){transition-delay: 1.2s}
#sub.history .con02 > ul > li > ul li:nth-child(6){transition-delay: 1.5s}
#sub.history .con02 > ul > li > ul li:nth-child(7){transition-delay: 1.8s}
#sub.history .con02 > ul > li > ul li:nth-child(8){transition-delay: 2.1s}
#sub.history .con02 > ul > li > ul li:nth-child(9){transition-delay: 2.4s}
#sub.history .con02 > ul > li > ul li:nth-child(10){transition-delay: 2.7s}
#sub.history .con02 > ul > li > ul li:nth-child(11){transition-delay: 3.0s}
#sub.history .con02 > ul > li > ul li:nth-child(12){transition-delay: 3.3s}
#sub.history .con02 > ul > li > ul li:nth-child(13){transition-delay: 3.6s}

#sub.history .con01{transform: translateY(70px);opacity: 0;transition: transform 1.2s, opacity 1.2s;transition-delay: 0.3s}
#sub.history .con01.on{transform: translateY(0);opacity: 1;}
@media (max-width: 1600px){
  #sub.vision .sub_con{background-size: 1600px auto}
  #sub.vision .vi_list ul li{margin-right: 20px;}
  #sub.vision .sub_con{padding-bottom: 157px;}
}
@media (max-width: 1300px){
  #sub.company .con02 .txt{padding-left: 20px;}
  #sub.company .con03 .con .left{position: static;}
  #sub.company .con03 .con{padding-left: 20px;padding-top: 80px;}
  #sub.company .con03 .con .left{margin-bottom: 30px}
  #sub.company .con03 .con .left ul:after{content: '';display: block;clear: both;}
  #sub.company .con03 .con .left ul li a{width: 100%;text-align: center;padding: 0}
  #sub.company .con03 .con .left ul li{float: left;width: 33.33%}
  #sub.company .con03 .con .left ul li.on a:before{display: none}
  #sub.company .con03 .con .right > ul > li .txt{text-align: center;}
  #sub.company .con03 .con .right > ul > li ul li{margin-right: 0;width: 33.33%}
  #sub.greeting .con02 .left{margin-bottom: 60px;}
  #sub.ci .con04 ul li img{max-width: 100%}
  #sub.ci .con03 .txt p{padding: 20px;line-height: 1.8;word-break: keep-all;}
  #sub.people .con01 .c01 > div > div img{width: 600px;}
  #sub.people .con01 .c01 > div > div img{width: 650px;}
  #sub.people .con01 .c02 .img img{width: 500px}
  #sub.people .con01 .c02 > div > div.c_logo img{width: 400px;}
  #sub.people .con01 .c01:before{height: 400px;bottom: -70px}
  #sub.people .con01 .c02 > div > div.c_logo{padding-top: 225px;}
  #sub.iprs .con01 ul.list li a strong br{display: none}
  #sub.contact .con01 ul li .txt > *{display: block;}
  #sub.contact .con01 ul li .txt strong{margin-bottom: 10px;margin-right: 0}
  #sub.field .con02 .left{position: static;margin-bottom: 20px;}
  #sub.field .con02{padding-left: 0}
  #sub.strategy .con01 ul li .txt p br{display: none}
  #sub.strategy .con01 ul li .txt p{word-break: keep-all;}
  #sub.tech .con02 .right p br{display: none}
  #sub.tech .con02 .right p{word-break: keep-all;padding-right: 20px}
  #sub.tech .con03 img{max-width: 100%}
  #sub .loc03 li a{font-size: 13px;}
  #sub .loc03 li a:before{transform: scale(0.8);}
  #sub .loc03 li{margin-right: 40px;}
  #sub.tech .con01 .txt p br{display: none}
  #sub.tech .con01 .txt p{word-break: keep-all;}
  #sub.pipeline .pipe_loc img{max-width: 100%}
  #sub.gmp02 .con01 p br{display: none}
  #sub.gmp02 .con01 p{word-break: keep-all;}
  #sub.gmp02 .con01 .img img{max-width: 100%}
  #sub.gmp03 .con01 .product{bottom: -85px;}
  #sub.gmp03 .con03 .con{padding-left: 150px}
  #sub.gmp03 .con03 .con .right > ul > li{word-break: keep-all;}
  #sub.gmp04 .con01 p{font-size: 15px;line-height: 1.8}
  #sub.gmp04 .con01 p br{display: none}
  #sub.gmp04 .con02 > ul > li{padding-left: 0}
  #sub.gmp04 .con02 > ul > li .left{position: static;margin-bottom: 20px;}
  #sub.product .con03 .wrap img{width: 100%}
  #sub.product .con03 .swiper-slide-prev .wrap{right: -50px}
  #sub.product .con03 .swiper-slide-next .wrap{left: -50px}
  #sub.product .con03 .swiper-slide{padding: 30px 0;}
  #sub .sub_loc > div > div.dep02 ul li a{padding: 0 10px;}
  #sub.vision .sub_con{background: none}
  #sub.vision .vi_list ul{text-align: left;}
  #sub.vision .vi_list ul:after{content: '';display: block;clear: both;}
  #sub.vision .vi_list ul li{margin-left: -5px;width: 50%;margin-right: 0;padding: 0 10px;box-sizing: border-box;margin-bottom: 45px;text-align: center;}
  #sub.vision .vi_list ul li .img{display: inline-block;}
  #sub.vision .vi_list ul li .img:before{height: 20px !important}
  #sub.vision .vi_list ul li .img:after{bottom: -29px !important}
  #sub.vision .vi_list ul li .img{margin-bottom: 35px !important}
  #sub.vision .vi_list ul{padding-right: 00}
  #sub.history .con02 > ul > li .year strong{padding-right: 0}
  #sub.history .con02 > ul > li .year strong:before{display: none}
  #sub.history .con02 > ul > li > ul{right: 424px}
  #sub.history .con02 > ul > li > ul li{word-break: keep-all;}
  #sub.history .con01 .img img{max-width: 100%}
  #sub.history .con02 > ul > li .year strong{font-size: 65px;}
  #sub.history .con02 > ul > li .year strong.year2{letter-spacing: 4px;}
  #sub.history .con02 > ul > li > ul{right: 264px;}
  #sub.history .con02 > ul > li > ul li{font-size: 15px;line-height: 1.8;margin-bottom: 10px;}
  #sub.history .con02 > ul > li > ul li b{font-size: 18px}
  #sub.history .con02 > ul > li{padding-left: 30px;}
  #sub.pipeline .con04 .graph ul li .bar .tag{display: none}
}
@media (max-width: 960px){
  #sub .sub_tit strong{font-size: 30px;}
  #sub.company .con01 .n_logo img, #sub.greeting .con01 .n_logo img, #sub.ci .con01 .n_logo img{width: 230px;}
  #sub .sub_tit{margin-bottom: 30px;}
  #sub .sub_con{padding-top: 85px;padding-bottom: 85px;}
  #sub.company .con02 .img img{width: 100%}
  #sub.company .con02 .txt{margin-top: -35px;}
  #sub.company .con02 .txt img{width: 450px;}
  #sub.company .con02 .txt p{word-break: keep-all;}
  #sub.product .con01 img{max-width: 100%}
  #sub.company .con02 .txt p br{display: none}
  #sub.company .con02 .txt p, #sub.field .con01 strong{font-size: 18px;line-height: 1.8;margin-top: 20px;}
  #sub.company .con03 .con .left ul li a{line-height: 50px;font-size: 16px;border-radius: 8px;}
  #sub.field .con01 p, #sub.product .con01 p{font-size: 16px;line-height: 1.5;word-break: keep-all;}
  #sub.product .con01 span{font-size: 16px !important;line-height: 1.5 !important;word-break: keep-all !important;}
  #sub.field .con01 p br, #sub.product .con01 p br{display: none}
  #sub.company .con03 .con .right > ul > li ul li strong{font-size: 16px;margin-bottom: 10px;}
  #sub.company .con03 .con .right > ul > li ul li p{font-size: 13px;line-height: 1.8}
  #sub.company .con03 .con .right > ul > li ul li i img{width: 70px;}
  #sub.company .con03 .con .right > ul > li .txt strong, #sub.ci .con01 p{font-size: 20px;line-height: 1.5;word-break: keep-all;}
  #sub.company .con03 .con .right > ul > li .txt p{font-size: 13px;line-height: 1.7}
  #sub.company .con03{min-height: 0;padding-bottom: 65px;}
  #sub.company .con03 .bg{height: 100%}
  #sub.company .con03 .bg img{height: 100%}
  #sub.company .con03 .con .right{padding-top: 0}
  #sub.greeting .con01 .img .img_w img{height: 350px;}
  #sub.greeting .con01 .img .b_logo{bottom: -50px;top: auto}
  #sub.greeting .con01 .img .b_logo img{height: 350px}
  #sub.greeting .con02 .right p{font-size: 14px;line-height: 1.7;margin-bottom: 17px;}
  #sub.greeting .con02 .left{float: none;padding-right: 0}
  #sub.greeting .con02 .left span{font-size: 16px;margin-bottom: 12px;}
  #sub.greeting .con02 .left strong{font-size: 30px;}
  #sub.greeting .con02 .left{margin-bottom: 30px;}
  #sub.greeting .con02{padding-top: 65px;}
  #sub.ci .tit strong{font-size: 16px;}
  #sub.ci .tit{margin-bottom: 20px;}
  #sub.ci .con02 ul li{width: 32%;margin: 0;vertical-align: top}
  #sub.ci .con02 ul li span{width: 50px;line-height: 50px;font-size: 16px;border-radius: 12px}
  #sub.ci .con02 ul li strong{font-size: 14px;margin-bottom: 5px;}
  #sub.ci .con02 ul li p{font-size: 13px;}
  #sub.ci .con02 ul li span{margin-bottom: 20px;}
  #sub.ci .con02:before{top: 25px;}
  #sub.ci .con03 .txt p{font-size: 14px;line-height: 1.8}
  #sub.ci .con04{padding-top: 65px;}
  #sub.ci .con02{margin-top: 65px;padding-bottom: 30px;}
  #sub.people .con01 .c01{display: none}
  #sub.people .con01 .c02 > div > div{float: none;text-align: center;}
  #sub.people .con01 .c02 .img img{margin: 0 auto}
  #sub.people .con01 .c02 > div > div.c_logo{float: none}
  #sub.people .con01 .c02 > div > div.c_logo{padding-top: 50px;text-align: center;}
  #sub.people .con01 .c02 > div > div img{margin: 0 auto}
  #sub.people .con01 .c02{padding-bottom: 0;padding-top: 30px;}
  #sub.people .con01 .c02:before{top: 0}
  #sub.people .con02 ul{max-width: 100%}
  #sub.people .con02 ul li img{width: 100%}
  #sub.people .con01 .c02:before{left: 0;width: 60%;margin-left: 0}
  #sub.people .con02 ul li strong{font-size: 17px;line-height: 40px;border-radius: 10px;}
  #sub.people .con02 ul li p{font-size: 13px;line-height: 1.5}
  #sub.people .con02 ul li strong{margin: 10px 0}
  #sub.iprs .con01 ul.list li{width: 49%;margin-right: 2%}
  #sub.iprs .con01 ul.list li:nth-child(3n){margin-right: 2%}
  #sub.iprs .con01 ul.list li:nth-child(2n){margin-right: 0%}
  #sub.iprs .con01 ul.list li a strong{font-size: 13px;line-height: 20px;height: 40px;}
  #sub.iprs .con01 ul.list li .info i{width: 38px;height: 38px;background-size: 100% 100% !important}
  #sub.iprs .con01 ul.list li .info span{font-size: 12px;line-height: 38px;}
  #sub.iprs .con01 ul.list li a{padding: 20px;}
  #sub.iprs .con01 ul.list li .info{margin-top: 20px;}
  #sub.iprs .con01 ul.list li a{height: 135px;}
  #sub .sch_area .sch_w{width: 100%}
  #sub .sch_area .sch_w select{font-size: 13px;}
  #sub .sch_area .sch_w input{font-size: 13px;}
  #sub .sch_area{margin-bottom: 35px;}
  #sub.contact .con01 ul li .txt strong{font-size: 18px;margin-bottom: 5px;}
  #sub.contact .con01 ul li .txt p{font-size: 15px;}
  #sub.contact .con01 ul li .txt{margin-top: 15px;}
  #sub.contact .con02 ul li input{width: 100%}
  #sub.contact .con02 ul li{padding-left: 70px;}
  #sub.contact .con02 ul li .txt span{font-size: 13px;}
  #sub.contact .con02 ul li input, #sub.contact .con02 ul li textarea{font-size: 13px;padding-left: 10px;}
  #sub.contact .con02 ul li input{height: 40px;}
  #sub.contact .con02 ul li textarea{height: 160px;}
  #sub.contact .con02 ul li{margin-bottom: 10px;}
  #sub.contact .con02 ul li .txt span{line-height: 40px;}
  #sub.contact .con02 .tit_w strong{font-size: 20px;}
  #sub.contact .con01{margin-bottom: 30px;}
  #sub.contact .con02 .chk_txt .tit strong{font-size: 18px;}
  #sub.contact .con02 .chk_txt .txt p{font-size: 13px;line-height: 1.7;word-break: keep-all;}
  #sub.contact .con02 .chk_txt .txt{padding: 15px;}
  #sub.contact .con02 .chk_w > div p{font-size: 13px;}
  #sub.contact .con02 .submit_btn a{font-size: 13px;width: 100%;box-sizing: border-box;}
  #sub.contact .con02 .submit_btn{margin-top: 30px;}
  #sub.contact .con02 .chk_txt{margin-top: 25px;}
  #sub.field .con02 .right p br{display: none}
  #sub.field .con02 .right p{font-size: 13px;line-height: 1.8}
  #sub.field .con02 .left strong{font-size: 20px;}
  #sub.field .con02{padding-top: 60px}
  #sub.field .con02 .right ul li strong{font-size: 13px;}
  #sub.field .con02 .right ul li strong:before{height: 23px;background-position: bottom}
  #sub.strategy .con01 ul li .txt strong{font-size: 16px;margin-bottom: 10px;}
  #sub.strategy .con01 ul li .txt p{font-size: 13px;line-height: 1.8}
  #sub.strategy .con01 ul li .txt{padding-top: 20px;}
  #sub.strategy .con01 ul li i img{width: 65px;}
  #sub.strategy .con01 ul li i{margin-bottom: 25px}
  #sub.strategy .con01 ul li i{position: relative;z-index: 2}
  #sub.strategy .con01 .tit{margin-bottom: 40px;}
  #sub.strategy .con01 .tit strong{font-size: 16px;}
  #sub.cooperative .con .tit strong{font-size: 18px;}
  #sub.cooperative .con .tit{margin-bottom: 15px;}
  #sub.cooperative .con{margin-bottom: 40px}
  #sub.tech .con01 .txt p{font-size: 20px;line-height: 1.5}
  #sub.tech .con01 .txt{padding: 60px 0}
  #sub.tech .con02 .left{position: static;}
  #sub.tech .con02 .right{padding: 20px;border-radius: 10px;}
  #sub.tech .con02{padding-left: 0;padding-top: 0}
  #sub.tech .con02 .left .txt{margin-bottom: 40px;}
  #sub.tech .con02 .left .txt:before{bottom: -35px;}
  #sub.tech .con02 .left .txt strong br{display: none;word-break: keep-all;}
  #sub.tech .con02 .left{border-radius: 15px;}
  #sub.tech .con02 .right p{font-size: 13px;line-height: 1.5}
  #sub.tech .con02 .left .txt:before{width: 160px;background-size: 100% auto;height: 178px;bottom: -20px;}
  #sub.tech .con02 .left .txt{padding: 30px;word-break: keep-all;}
  #sub.tech .con02 .left .txt strong{font-size: 16px;line-height: 1.5}
  #sub.tech .con02{margin-bottom: 60px;}
  #sub.tech .con01 .tit strong{font-size: 20px}
  #sub.tech .con01 .tit{margin-bottom: 30px;}
  #sub.pipeline .con01 .tit strong{font-size: 23px;margin-bottom: 25px;}
  #sub.pipeline .con01 .txt div strong br{display: none}
  #sub.pipeline .con01 .txt div strong{word-break: keep-all;font-size: 16px;line-height: 1.8}
  #sub.pipeline .con01 .txt{height: 210px;}
  #sub.pipeline .con03 p{font-size: 13px;line-height: 1.8;word-break: keep-all;}
  #sub.pipeline .con03 p br{display: none}
  #sub.pipeline .con03{padding: 30px 20px;border-radius: 20px;margin-bottom: 55px;}
  #sub.pipeline .con02{margin-bottom: 55px;}
  #sub.pipeline .con04 .txt strong{font-size: 18px;}
  #sub.pipeline .con04 .graph ul li .tit strong{font-size: 14px;margin-bottom: 0}
  #sub.pipeline .con01{margin-bottom: 60px;}
  #sub.gmp01 .con01 strong, #sub.gmp02 .con01 p{font-size: 16px;word-break: keep-all;;line-height: 1.8}
  #sub.gmp02 .con01 p{margin-bottom: 40px;}
  #sub.gmp02 .con02{margin-top: -20px;}
  #sub.gmp02 .con02 img{width: 400px;}
  #sub.gmp02 .con02 p{font-size: 13px;line-height: 1.8;margin-top: 20px;}
  #sub.gmp03 .con02 strong{font-size: 22px;line-height: 1.8}
  #sub.gmp03 .con01 .img img{height: 350px;}
  #sub.gmp03 .con01 .product img{width: 400px;}
  #sub.gmp03 .con03 .con .right > ul > li{font-size: 14px;line-height: 2}
  #sub.gmp03 .con03 .con .right > ul > li:before{top: 10px;}
  #sub.gmp03 .con03 .con .right > ul > li ul li{font-size: 13px;line-height: 1.7}
  #sub.gmp03 .con03 .con .right > ul > li ul{margin-bottom: 10px;}
  #sub.gmp03 .con03 .con .left strong{font-size: 16px;}
  #sub.gmp04 .con02 > ul > li .right ul li strong{font-size: 13px;margin-top: 10px;}
  #sub.gmp04 .con02 > ul > li .left strong{font-size: 20px;}
  #sub.product .con02 ul li ul li{font-size: 13px;line-height: 1.7}
  #sub.product .con02 ul li ul li:before{top: 7px;}
  #sub.product .con02 ul li strong{font-size: 17px;}
  #sub.product .con02{padding: 30px 20px;}
  #sub.list_board .list table td.tit a, #sub.list_board .list table td{font-size: 13px;}
  #sub.list_board .list table td{height: 45px}
  #sub.list_board .list table td.notice span{width: 50px;font-size: 12px;line-height: 25px;}
  #sub.list_board .loc03{margin-bottom: 30px;}
  #sub.list_board .list ul li .txt strong{font-size: 14px;line-height: 25px;height: 50px}
  #sub.list_board .list ul li .txt span{font-size: 12px;margin-top: 5px}
  #sub.list_board .list ul li .txt{padding-top: 15px}
  #sub .sub_loc > div > div{position: relative;width: 50%;box-sizing: border-box;}
  #sub .sub_loc > div > div.dep02 button{display: block;}
  #sub .sub_loc > div > div button{width: 100% !important}
  #sub .sub_loc > div > div ul li{float: none}
  #sub .sub_loc > div > div ul{position: absolute;;}
  #sub.vision .vi_list ul{padding-left: 10px;}
  #sub .sub_loc > div > div.dep02 ul li{float: none;width: 100%;}
  #sub .sub_loc > div > div.dep02 ul li.on a:before{display: none}
  #sub .sub_loc > div > div.dep02 ul li a{line-height: 40px;}
  #sub .sub_loc > div > div.dep02 ul{position: absolute;width: 100%;box-shadow: 0 0 15px rgba(0,0,0,0.1);border-radius: 20px;padding: 10px 0;margin-top: 15px;}
  #sub .sub_loc > div > div.dep02 ul li a, #sub .sub_loc > div > div.dep01 ul li a{font-size: 13px;line-height: 30px;}
  #sub .sub_loc > div > div.dep02 ul{background: #fff}
  #sub .sub_loc > div > div.dep02 ul{display: none}
  #sub .sub_loc > div > div.dep01 button, #sub .sub_loc > div > div.dep02 button{height: 45px;font-size: 15px}
  #sub.vision .vi_list ul li i{font-size: 16px;width: 45px;line-height: 35px;border-radius: 15px;margin-bottom: 10px;}
  #sub.vision .vi_list ul li strong{font-size: 15px;line-height: 1.7}
  #sub.vision .vi_list ul li .img img{max-width: 100%}
  #sub.vision .sub_con{padding-bottom: 65px;}
  #sub .loc_wrap{height: 65px;}
  #sub.view .tit ul li:nth-child(1){font-size: 13px;}
  #sub.view .tit ul li{font-size: 13px;}
  #sub.view .tit .cate{position: static;text-align: left;margin-top: 8px;}
  #sub.view .tit .cate span{text-align: center;}
  #sub.view .tit strong{font-size: 22px;}
  #sub.view .tit ul{margin-bottom: 10px;}
  #sub.view .tit .cate span.job{font-size: 13px}
  #sub.view .tit .cate span.status{font-size: 13px}
  #sub.view .txt{min-height: 200px;}
  #sub.view .btn_area .btn{display: none}
  #sub.view .btn_area .list_btn a img{width: 45px;}
  #sub.product .sub_con:before{display: none}
  #sub .sub_loc2 ul{padding-left: 0}
  #sub .sub_loc2 ul li{width: 25%}
  #sub .sub_loc2 ul li a{padding: 0;text-align: center;font-size: 14px;line-height: 40px}
}

@media (max-width: 800px){
  #sub{padding-top: 65px;}
}
@media (max-width: 600px){
  #sub.pipeline .con04 .graph ul li .tit{float: none;width: 100%;margin-bottom: 10px;background: #fff;padding: 5px;}
  #sub.pipeline .con04 .graph ul li .bar{width: 100%}
  #sub.pipeline .con04 .info ul li span{font-size: 9px;}
  #sub.pipeline .con04 .info{padding-top: 10px;}
  #sub.company .con03 .con .left ul li a{font-size: 14px;line-height: 30px;}
  #sub.company .con01 .n_logo, #sub.greeting .con01 .n_logo{margin-bottom: 60px;}
  #sub.company .con02{margin-bottom: 55px;}
  #sub.greeting .con02 .right p br{display: none}
  #sub.greeting .con02 .right p{word-break: keep-all;}
  #sub.ci .con04 ul li{width: 100%;margin-bottom: 25px;}
  #sub.ci .con01 p{word-break: keep-all;}
  #sub.ci .con01 p br{display: none}
  #sub.people .con02 ul li{margin-right: 0;width: 50%;padding: 0 10px;box-sizing: border-box;}
  #sub.people .con02 ul li{margin-bottom: 25px;}
  #sub.people .con01 .c02 .img img{width: 100%}
  #sub.people .con01 .c02 > div > div.c_logo img{width: 100%;max-width: 100%}
  #sub.people .con01 .c02 > div > div.c_logo img{width: 60%}
  #sub.people .con01 .c02:before{height: 50%}
  #sub.people .con02{padding-top: 60px;}
  #sub.contact .con01 ul li{width: 100%;margin-bottom: 35px;}
  #sub.contact .con01 ul li .img {height: 270px}
  #sub.field .con02 .right ul li{width: 33.33%;margin-right: 0;padding: 0 6px;box-sizing: border-box;}
  #sub.field .con02 .right ul li{margin-top: 25px;}
  #sub.field .con01{padding-bottom: 65px;}
  #sub.strategy .con01 ul li .img img{margin: 0 auto}
  #sub.cooperative .con ul{padding-left: 2px;border-left: none}
  #sub.cooperative .con ul li{width: 49%;border:1px solid #d9dce0 !important ;margin-top: -1px;margin-left: -1px;}
  #sub.tech .con01{padding-top: 65px;margin-bottom: 30px;}
  #sub.pipeline .pipe_loc .img{display: none}
  #sub.pipeline .pipe_loc ul{position: static;}
  #sub.pipeline .pipe_loc ul:after{content: '';display: block;clear: both;}
  #sub.pipeline .pipe_loc ul li{height: auto;width: 25%;padding: 3px;box-sizing: border-box;}
  #sub.pipeline .pipe_loc ul li a{text-indent: 0;font-size: 13px;text-align: center;line-height: 35px;background: #f4f6f8;border-radius: 5px;}
  #sub.pipeline .pipe_loc ul li.on a{background: #11bced;color: #fff;}
  #sub.pipeline .pipe_loc{margin-bottom: 40px;}
  #sub.gmp02 .con02 p br{display: none}
  #sub.gmp02 .con02 p{word-break: keep-all;}
  #sub.gmp02 .con02 img{width: 300px;max-width: 90%}
  #sub.gmp02 .con01 .img{border-radius: 20px}
  #sub.gmp03 .con01 .img img{height: 250px;}
  #sub.gmp03 .con01 .product img{width: 300px;}
  #sub.gmp03 .con02 strong br{display: none}
  #sub.gmp03 .con02 strong{word-break: keep-all;}
  #sub.gmp03 .con02{margin-bottom: 30px;}
  #sub.gmp03 .con03 .con .left{position: static;}
  #sub.gmp03 .con03 .con{padding-top: 30px;padding-left: 0}
  #sub.gmp03 .con03 .con .right{padding-bottom: 30px;}
  #sub.gmp03 .con03 .con .left{margin-bottom: 10px;}
  #sub.gmp03 .con01 .product{right: -50px;}
  #sub.gmp04 .con02 > ul > li .right ul li{width: 49%;margin-right: 2%;margin-bottom: 2%}
  #sub.gmp04 .con02 > ul > li .right ul li:nth-child(2n){margin-right: 0}
  #sub.gmp04 .con01{margin-bottom: 40px;}
  #sub.list_board .list ul li{width: 49%;margin-right: 2%}
  #sub.list_board .list ul li:nth-child(3n){margin-right: 2%}
  #sub.list_board .list ul li:nth-child(2n){margin-right: 0%}
  #sub.history .con02 > ul > li > ul{position: static;}
  #sub.history .con02 > ul > li{padding-left: 0;padding-bottom: 25px;}
  #sub.history .con02 > ul > li > ul li{padding-right: 50px;}
  #sub.history .con01 .img{border-radius: 0 0 0 0}
  #sub.history .con01{margin-bottom: 50px;}
  #sub.history .con02 > ul > li .year strong{font-size: 55px;}
  #sub.history .con02 > ul > li > ul{margin-top: 25px;}
  #sub.history .con02 > ul > li > ul li{padding-left: 0}
  #sub.history .con02 > ul > li > ul li{font-size: 13px;}
  #sub.history .con02 > ul > li > ul li b{font-size: 15px;}
  #sub.history .con02 > ul > li .year strong{line-height: 1}
  #sub.history .con02 > ul > li{padding-bottom: 60px;}
  #sub.history .sub_con{background-size: 90% auto;padding-bottom: 65px;}
  #sub.list_board .list table td.cate{display: none}
    #sub.people .con02 ul li:nth-child(1){margin-left: 25%}


}
@media (max-width: 550px){
  #sub.strategy .con01 ul li{width: 100%;margin-bottom: 30px;}
}
@media (max-width: 400px){
  #sub.company .con03 .con .left ul li {width: 100%;margin-bottom: 10px;}
  #sub.company .con03 .con{padding-top: 30px}
  #sub.company .con03 .bg{border-radius: 20px;}
  #sub.company .con03 .con .right > ul > li ul li p br{display: none}
  #sub.company .con03 .con .right > ul > li ul li p{word-break: keep-all;}
  #sub.company .con02 .txt{margin-top: -20px}
  #sub.company .con02 .txt img{max-width: 90%}
  #sub.company .con02 .img{border-radius: 15px}
  #sub .sub_tit strong{font-size: 22px;word-break: keep-all;line-height: 1.7}
  #sub.greeting .con01 .img .b_logo img{height: 220px;}
  #sub.greeting .con01 .img .img_w img{height: 200px;}
  #sub.company .con03 .con .right > ul > li .txt strong, #sub.ci .con01 p{font-size: 16px;}
  #sub.ci .con02:before{display: none}
  #sub.ci .con02 ul li{width: 100%;margin-bottom: 25px;position: relative;}
  #sub.people .con02 ul li strong{font-size: 15px}
  #sub.ci .con02 ul li:before {content: '';display: block;width: 100%;height: 1px;top: 25px;position: absolute;background: #d9dce0;}
  #sub.tech .con01 .txt p{font-size: 16px;}
  #sub.gmp03 .con02 strong{font-size: 17px;}
  #sub .loc03 li{margin-right: 20px}
}
/*  */