/* Common **********************************************************************/ /* @import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css); <-- 기존에 있던 것 */ /* Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess */ @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 100; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype'); } @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 300; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype'); } @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 400; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype'); } @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 500; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype'); } @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 700; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype'); } @font-face { font-family: 'Noto Sans KR'; font-style: normal; font-weight: 900; src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'), url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype'); } @font-face { font-family: 'Pretendard'; font-style: normal; font-weight: 200; src: url(/font/SUIT-Thin.otf) format('opentype'); src: url(/font/SUIT-Thin.otf) format('opentype'), url(/font/SUIT-Thin.ttf) format('truetype'); } @font-face { font-family: 'Pretendard'; font-weight: 100; src: url('/font/Pretendard-Thin.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 200; src: url('/font/Pretendard-ExtraLight.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 300; src: url('/font/Pretendard-Light.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 400; src: url('/font/Pretendard-Regular.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 500; src: url('/font/Pretendard-Medium.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 600; src: url('/font/Pretendard-SemiBold.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 700; src: url('/font/Pretendard-Bold.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 800; src: url('/font/Pretendard-ExtraBold.woff2') format('woff2'); } @font-face { font-family: 'Pretendard'; font-weight: 900; src: url('/font/Pretendard-Black.woff2') format('woff2'); } /* Common **********************************************************************/ html,body {width:100%; } html {overflow-y:scroll; box-sizing:border-box;} *, *:before, *:after{box-sizing:inherit;} *{ -webkit-text-size-adjust:none; -webkit-text-size-adjust - auto | none | N% (default auto) } body {word-break:break-all;-ms-word-break:break-all; } body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0; padding:0;} fieldset,img {border:0px none; vertical-align:top;} dl,ul,ol,menu,li {list-style:none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after,q:before, q:after {content:''; content:none;} button {border:0 none; background-color:transparent; cursor:pointer;} body { background:#fff;} body,th,td,input,select,textarea,button {font-size:13px; line-height:1.6; font-family: 'Pretendard'; color:#7d7d7d;} input, select, textarea, button{vertical-align:middle; } a:link,a:active,a:visited{color:#7d7d7d; text-decoration:none; border:0px;} a:hover,a:focus{color:#333; text-decoration:none} table {border-collapse:collapse; border-spacing:0;} address,caption,cite,code,dfn,em,var {font-style:normal; font-weight:normal;} summary, caption, legend, hr {width:0; height:0; font-size: ; line-height: ; overflow: hidden; visibility: hidden; border: none; position:absolute; left:-1000em;} caption {position:static;} /* label hidden 처리 */ .invisible, .hide{overflow:hidden; visibility:hidden; width:0; height:0; font-size:0; line-height:0; position:absolute;} label.invisible{*position:Absolute;} /* common */ .clfix:after {content: "."; display: block; height:0px; clear: both; visibility: hidden;} .clfix {display:inline-block;} .clfix {display:block;} * html .clfix {height:1%;} /* Hides from IE-mac */ .clfix {zoom:1;} /*for IE 5.5-7*/ .list {border-top:2px solid #1c1815; border-bottom:1px solid #1c1815;} /*멤버스킨*/ .title{font-size:15px; font-weight:bold;} /*테이블*/ .tbl_type,.tbl_type th,.tbl_type td{border:0} .tbl_type{width:100%;border-bottom:1px solid #e2e2e5; } .tbl_type th{padding:10px 0 10px 0;border-top:2px solid #383d4a; font-weight:bold; border-bottom:1px solid #e2e2e5;} .tbl_type p{font-size:11px; color:#b6b7bc;} .tbl_type td{padding:7px 0 7px 0;border-top:1px solid #e5e5e5;color:#4c4c4c; border-bottom:none; border-top:none; line-height:18px;} .tbl_type2,.tbl_type2 th,.tbl_type2 td{border:0} .tbl_type2{width:100%;border-bottom:1px solid #e7e7e7; } .tbl_type2 th{padding:10px 0 10px 0; background:#f9f9f9; text-align:center;} .tbl_type2 p{font-size:11px; color:#b6b7bc;} .tbl_type2 td{padding:10px 0 10px 10px; border-bottom:none; border-top:none; line-height:18px;} /*로그인스킨*/ #login_wrap {width:100%; background:#f7f7f7; padding:50px;} .login_top {width:100%; height:50px; border-bottom:1px solid #eaeaea; margin-bottom:20px;} .login_top h2 {font-size:30px; color:#4b4f58; line-height:1; font-weight:600;} .login_top h2 span {font-size:15px; font-weight:400; } .login_mid {display: flex; justify-content: space-between; width:100%; overflow: hidden;} .login_mid .login_con { width:50%; height:100%; } .login_mid .login_con h2 {text-align:center; color:#222; font-size:40px; margin-bottom:20px;} .login_mid .login_con .login_id {width:100%; height:40px; background:#fff; border:1px solid #fff; margin-bottom:10px;} .login_mid .login_con .login_id #mb_id {height:100%; width:90%; border:none; background:none; font-size:14px; color:#666; line-height:40px; vertical-align: top;} .login_mid .login_con .login_pw {width:100%; height:40px; background:#fff; border:1px solid #fff; margin-bottom:20px;} .login_mid .login_con .login_pw #mb_pass {height:100%; width:90%; border:none; background:none; font-size:14px; color:#666; line-height:40px; vertical-align: top;} .login_mid .login_con span {display:inline-block;width:10%; height:100%; text-align:center; line-height:40px; } .login_mid .login_con span img {vertical-align:middle;} .login_mid .login_con input::placeholder {font-size:14px; color:#c3c3c3;} .login_mid .login_con input::-webkit-input-placeholder { /* Chrome/Opera/Safari */font-size:14px; color:#c3c3c3;} .login_mid .login_con input::-moz-placeholder { /* Firefox 19+ */font-size:14px; color:#c3c3c3;} .login_mid .login_con input:-ms-input-placeholder { /* IE 10+ */font-size:14px; color:#c3c3c3;} .login_mid .login_con input:-moz-placeholder { /* Firefox 18- */font-size:14px; color:#c3c3c3;} .login_mid .login_btn {width:100%; height:55px; margin-top:20px;} .login_mid .login_btn button {width:100%; height:100%; background:#4b4f58; border:1px solid #4b4f58; text-align:center; color:#fff; font-size:18px; line-height:53px;} .login_mid .login_bottom {text-align:center;} .login_mid .login_bottom li {display:inline-block; margin-left:20px; padding-left:20px; position:relative; line-height:35px;} .login_mid .login_bottom li::before {width:1px; height:13px; background:#ddd; content:''; position:absolute; left:0; top:11px;} .login_mid .login_bottom li:first-child {margin-left:0; padding-left:0;} .login_mid .login_bottom li:first-child::before {display:none;} .login_mid .login_bottom li a {color:#666; font-size:15px; line-height:15px;} .login_mid .login_bottom li a img {vertical-align:middle; margin-right:5px;} .login_mid .login_bottom li label {color:#666; font-size:15px; line-height:15px;} .login_mid .login_bottom li input[type="checkbox"] {vertical-align:-3px;} .login_mid .login_bottom li .naver_login {display:inline-block; background: #00ce38; width: 200px; height: 35px; font-size: 14px; color: #fff; text-align: center; line-height: 35px; border-left: 1px solid #DDD; border-radius: 5px; vertical-align: middle;} .login_mid .login_bottom li .naver_login img {vertical-align:-1px;} .login_mid .login_img {width:47.27%;} .login_mid .login_img .img_wrap{position:relative; padding-bottom: 42.3%;} .login_mid .login_img .img_wrap img{position:Absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto; width: auto; height: auto; max-width: 100%; max-height:100%;} /*회원가입 스킨*/ .inWrap {width:98%; border:1px solid #353638; border-width:1px 0; padding:30px 0;} .inWrap.type1 { padding:50px 0;} .inWrap.type2 { padding:0;} .inWrap.type3 { padding:5px 0; border-bottom-width:0;} .inWrap.width1 { width:680px !important; margin:0 auto;} .tbox1 { border:1px solid #cdcdcd; } .tbox1 .boxTit { padding:20px 20px 10px; color:#333; font-weight:700; font-size:16px;} .tbox1 .txt_scroll { height:200px; padding:0 20px; overflow-y:auto;} .txt_type { line-height:25px; font-size:13px; color:#666;} .agreement input{vertical-align:middle; border:none;} .btnType { display:inline-block; position:relative; transition:all 0.3s;} .btnType.btn1 { height:30px; line-height:28px; padding:0 45px; font-size:13px;} .btnType.btn1.color2 {border:1px solid #333; background:#333; cursor:pointer; } .btnWrap input{color:#fff;} .center{text-align:center;} .pc_img {display:block;} .tab_img {display:none;} .mob_img {display:none;} .pc {display:block;} .tab {display:none;} .mob {display:none;} /* ==main== */ #wrap{ position: relative; width: 100%; max-width: 100%; min-width: 1400px; margin: 0 auto; overflow: hidden;} .inner{width: 1400px; margin: 0 auto; max-width:100%;} /* header */ #header{position: relative; z-index: 5000;height: 100px;} #header .inner{display: flex; justify-content:space-between; align-items:center; height: 100%;} #header h1 a{display: block;background: url(/images/main/main_logo_pc.png)center no-repeat; background-size: cover; width: 90px; height: 50px;} /* #header .gnb{display: flex;} #header .gnb li a{color: #222; font-size: 18px; padding: 30px;} */ /* #header .lang_box{display: flex;gap:30px;align-items:center;} #header .lang_box .a_box{display: flex;gap:19px;} #header .lang_box .a_box a{position: relative;font-size: 16px;color: #666;} #header .lang_box .a_box a:nth-child(1):after{content:'';position: absolute;right: -10px;top: 8px;width: 1px;height: 10px;background: #dfdfdf;} */ #header .lang_box .btn_box .pc_btn{width: 30px;height: 20px;background:url(/images/main/ham_pc.png)center no-repeat;background-size:cover ;} #header .lang_box .btn_box .tab_btn{display: none;} #header .lang_box{display: flex;position: relative;margin-right: 24px;align-items:center;} #header .lang_box a{display: block;position: relative;font-size: 15px;color: #222;margin-right: 65px;} #header .lang_box a:after{content:'';position: absolute;right: -14px;top: 10px;width: 7px;height: 4px;background:url(/images/main/lan_pc.png)center no-repeat;background-size:cover ;} #header .lang_box .a_box{display: none;position: absolute;z-index: 6000;top: 30px;left: -25px;padding: 7px 0;width: 80px;height: fit-content;border: 1px solid #ddd;border-radius: 5px;background: #fff;} #header .lang_box a.off:after{transform:rotate(180deg);} #header .lang_box .a_box a:after{display: none;} #header .lang_box .a_box a{display: block;margin-bottom: 10px;text-align: center;margin-right: 0;} #header .lang_box .a_box a:last-child{margin-bottom: 0;} /* gnb */ .gnb{display: flex;gap:60px;margin-left: 40px;} .gnb li a{font-size: 18px;color: #222;height: 100%;line-height: 100px;font-weight: 500;} /* all_menu */ .gnb_wrap { display:none; position:absolute; left:0; right:0; top:100px; background:#fff; border-top:1px solid #ddd;z-index: 3000;} .all_menu { display:flex; line-height:1; height:440px;} .all_menu > li { flex:1;border-right:1px solid #ddd;padding-top: 30px;padding-left: 25px;} .all_menu li p{margin-bottom: 22px;} .all_menu li p a{font-size: 20px;font-weight: 500;color: #222;} .all_menu > li:first-child { border-left:1px solid #ddd;} .all_menu > li:hover, .all_menu > li.on{ background:#f5f5f5;} .all_menu .all_sub_menu {} .all_menu .all_sub_menu li ~ li { margin-top:22px;} .all_menu .all_sub_menu li a { font-size:16px; color:#222;} .all_menu .all_sub_menu li:hover a, .all_menu .all_sub_menu li.on a { color:#555; font-weight:500;} .navigation{display: none;} #visual_wrap{position: relative;line-height: 1;overflow: hidden;height: 880px;background: #111;} .video_container{position: relative;width: 100%;height: 100%;overflow: hidden;} .video_container video{width: 100%;height: 100%;object-fit:cover;} #visual_wrap .video_wrap { overflow:hidden; position:relative; width:1920px;height: 1200px;margin: 0 auto;} #visual_wrap .video_wrap .video { position:absolute;width:100%; height:100%; } #visual_wrap ul li{position: relative;} #visual_wrap ul li .text_box{position: absolute;/* animation:ani04 ease 1s forwards;opacity: 0;animation-delay: .5s; */top: 44.5%;left: 50%;transform:translate(-50% , -50% ); text-shadow: 2px 2px 5px #222;} #visual_wrap ul li .text_box em{display:block; font-size:54px; color:#FD8204; font-weight:600; margin-bottom:35px; animation:ani03 ease 1s forwards; filter: drop-shadow(4px 5px 4px #222);} #visual_wrap ul li .text_box .visu_wrap_all{display:flex; justify-content: space-between;} #visual_wrap ul li .text_box .visual_logo_wrap{margin-bottom:35px; animation:ani03 ease 1s forwards;} #visual_wrap ul li .text_box .visual_logo_wrap img{} #visual_wrap ul li .text_box strong{display: block;font-size: 55px; color: #fff;font-weight: 700;line-height: 70px;margin-bottom: 20px;animation:ani03 ease 1s forwards;} #visual_wrap ul li .text_box strong b{display: block;} #visual_wrap ul li .text_box p{font-size: 20px;color: #fff;font-weight: 300;line-height: 30px;transform:translateY(0px);opacity: 1;animation:ani03 ease 1s forwards; -webkit-animation-delay: .3s; } #visual_wrap ul li .text_box p.p01 {font-size:25px;} #visual_wrap ul li .text_box p span{display: block;} #visual_wrap ul li .text_box div.visual_txt_list{display:flex;flex-wrap: wrap; justify-content: space-between;text-align: center;} #visual_wrap ul li .text_box div.visual_txt_list p{width:21%; font-size: 45px;color: #fff;font-weight: 700;line-height: 70px;margin-bottom: 20px;animation:ani03 ease 1s forwards;} #visual_wrap ul li .text_box .a_box{margin-top: 100px;} #visual_wrap ul li .text_box .a_box a{display: block;width: 200px;height: 60px;font-size:22px;/* color: #FD8204; */ background:#FD8204; color:#fff; text-align: center;line-height: 58px;} #visual_wrap ul li .text_box .visu_wrap_all .visu_right_wrap{margin-top:-180px; margin-right:-251px; opacity: 0.7;} #visual_wrap ul li .text_box .visu_wrap_all .visu_right_wrap p{font-size:30px; color:#FD8204; border:3px solid #FD8204; width:330px; height:80px; background:#fff;line-height:80px; text-align:center; font-weight:700; text-shadow: none;} #visual_wrap ul li .text_box .visual_logo_wrap img {filter: drop-shadow(4px 5px 4px #000);} #visual_wrap ul li .text_box .visual_logo_wrap img.techl_main_logo{filter: drop-shadow(4px 5px 4px #fff);} #visual_wrap ul li.dkt .text_box strong{font-size:55px;} #visual_wrap ul li.dkt .text_box .a_box{margin-top:47px;} #visual_wrap ul li .img_box p{animation:ani02 linear 5s forwards;animation-delay: .5s;} #visual_wrap ul li .visu_right_wrap{position: absolute;top: 0px;right: 0;z-index: 2000;} #visual_wrap ul li .visu_right_wrap p{font-size:30px; color:#FD8204; width:330px; height:80px; background:#fff;line-height:80px; text-align:center; font-weight:700; text-shadow: none; opacity:.8;} .flowplayer .fp-controls{display: none;} #visual_wrap .visual_items{} #visual_wrap .swiper-pagination{position: absolute;bottom: 130px;left: 50%;z-index: 5000;width: 1400px;display: flex;transform:translateX(-50%);} #visual_wrap .swiper-pagination span{position: relative;display: block;width: 11.111%;border-radius:0;background: rgba(255,255,255,.3);margin: 0;height: 4px;opacity: 1;/* text-shadow: 2px 2px 5px #222; */} #visual_wrap .swiper-pagination span:nth-child(1):after{content:'BH그룹';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 50%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(1):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span:nth-child(2):after{content:'IT';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 150%;transform:translateX(-50%);opacity: 0;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(2):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(2) + span:after{opacity: 0;} #visual_wrap .swiper-pagination span:nth-child(3):after{content:'IT';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 49.6%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(3):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(3) + span:after{opacity: 0;} #visual_wrap .swiper-pagination span:nth-child(4):after{content:'IT';position: absolute;width: 100px;text-align: center;top: -36px;color: rgba(255,255,255,.8);font-size: 24px;left: -50%;transform:translateX(-50%);opacity: 0;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(4):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span:nth-child(5):after{content:'전장';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 50%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(5):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span:nth-child(6):after{content:'장비&소재';position: absolute;width: 105px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 100%;transform:translateX(-50%);opacity: 0;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(6):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(6) + span:after{opacity: 0;} #visual_wrap .swiper-pagination span:nth-child(7):after{content:'장비&소재';position: absolute;width: 105px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 0%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(7):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span:nth-child(8):after{content:'문화';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 50%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(8):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span:nth-child(9):after{content:'사회공헌';position: absolute;width: 100px;text-align: center;top: -35px;color: rgba(255,255,255,.8);font-size: 24px;left: 50%;transform:translateX(-50%);opacity: .9;z-index: 5100;} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:nth-child(9):after{opacity: 1;font-size: 24px;color: #FD8204;z-index: 5200;} #visual_wrap .swiper-pagination span em{position: relative;display: block;width: 100%;height: 4px;background:rgba(255,255,255,.3);margin-bottom: 25px;} #visual_wrap .swiper-pagination span em:after{content:'';position: absolute;width: 0;height: 4px;top: 0px;left: 0;background: #fff;} #visual_wrap .swiper-pagination span:nth-child(1).swiper-pagination-bullet-active em:after{animation:ani01 linear 29s forwards;} #visual_wrap .swiper-pagination span:nth-child(2).swiper-pagination-bullet-active em:after{animation:ani01 linear 10s forwards;} #visual_wrap .swiper-pagination span:nth-child(3).swiper-pagination-bullet-active em:after{animation:ani01 linear 10s forwards;} #visual_wrap .swiper-pagination span:nth-child(4).swiper-pagination-bullet-active em:after{animation:ani01 linear 11s forwards;} #visual_wrap .swiper-pagination span:nth-child(5).swiper-pagination-bullet-active em:after{animation:ani01 linear 5s forwards;} #visual_wrap .swiper-pagination span:nth-child(6).swiper-pagination-bullet-active em:after{animation:ani01 linear 10s forwards;} #visual_wrap .swiper-pagination span:nth-child(7).swiper-pagination-bullet-active em:after{animation:ani01 linear 9s forwards;} #visual_wrap .swiper-pagination span:nth-child(8).swiper-pagination-bullet-active em:after{animation:ani01 linear 10s forwards;} #visual_wrap .swiper-pagination span:nth-child(9).swiper-pagination-bullet-active em:after{animation:ani01 linear 5s forwards;} #visual_wrap .swiper-pagination span.active span:after{animation:ani01 linear 10s forwards;} #visual_wrap .swiper-pagination p{font-size: 18px;color: #fff;text-align: center;} #visual_wrap .swiper-pagination a.active p{color: #FD8204;} #visual_wrap .swiper-pagination span:before{width: 100%;} #visual_wrap .swiper-pagination span:nth-child(1):before{content:'BH그룹';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(2):before{content:'BH';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(3):before{content:'DKT';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(4):before{content:'TechL';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(5):before{content:'BH EVS';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(6):before{content:'BH ST';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(7):before{content:'BH Semicon';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(8):before{content:'베하필하모닉';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span:nth-child(9):before{content:'나눔과 기부';position: absolute;bottom: -35px;left: 50%;transform:translateX(-50%);font-size: 20px;color: rgba(255,255,255,.8);} #visual_wrap .swiper-pagination span.swiper-pagination-bullet-active:before{color: #FD8204;} @keyframes ani01 { 0%{width: 0;} 100%{width: 100%;} } #footer{top: -10px;line-height: 1;padding: 30px 0 20px;background: #363636;} #footer .inner{display: flex;justify-content: space-between;align-items:center;} #footer .text_box02{display: none;} #footer .text_box p{font-size: 15px;color: #bbb;font-weight: 300;line-height: 27px;} #footer .text_box p a{color:#bbb} #footer .text_box p em{display: block;} #footer .text_box p:last-child{margin-bottom: 0;} #footer .logo_box{margin-bottom: 20px;} /* =======sub=========================================================================== */ #sub_contents{padding: 100px 0 80px;} .contop h3{font-size: 50px; color: #222; font-weight: 500;text-align: center;padding-bottom: 80px;} #sub_visual_wrap{position: relative;line-height: 1;} #sub_visual_wrap .txt_box{display: none;width: 100%;position: absolute;top: 50%;transform:translateY(-50%);} #sub_visual_wrap .txt_box strong{display: block;font-size: 30px;font-weight: 500;color: #fff;text-align: center;margin-bottom: 35px;} #sub_visual_wrap .txt_box p{font-size: 35px;color: #fff;font-weight: 500;text-align: center;} #sub_visual_wrap .sub_txt_wrap{position: absolute;top: 50%;transform:translateY(-50%);display: block;;width: 100%;line-height: 1;} #sub_visual_wrap .sub_txt_wrap h2{font-size: 30px;color: #fff;font-weight: 500;margin-bottom: 25px;text-align: center;} #sub_visual_wrap .sub_txt_wrap ul{display: flex;gap:53px;justify-content: center;} #sub_visual_wrap .sub_txt_wrap ul li{position: relative;font-size: 16px;color: #fff;} #sub_visual_wrap .sub_txt_wrap ul li:after{content:'';position: absolute;right: -30px;top: 50%; transform:translateY(-50%);width: 7px;height: 13px;background:url(/images/sub/sub_nav_pc.png)center no-repeat;background-size:cover ;} #sub_visual_wrap .sub_txt_wrap ul li:last-child:after{display: none;} /* tab_menu */ .tab_menu {position: relative;display: block; width:100%; height:61px;background: linear-gradient(to right, #94c11f 30%, #FFF 70%);border-bottom: 1px solid #ddd;} .tab_menu .inner{position:relative; display: flex; height:60px;background:#fff;width: 1535px;} .tab_menu .on .arrow02{background: url(/images/sub/sub_ico05_pc.png)center no-repeat;} .tab_menu .home{display: block;width: 60px; height: 60px; background: url(/images/sub/home_pc.png)center no-repeat #94c11f;} .tab_menu .menu {display: flex;width: calc(100% - 60px); height:100%;} .tab_menu .menu > li{position:relative; min-width:357px; height:100%; background:url("/images/sub/tab_bt_pc.png") center right 20px no-repeat; background-size:7px auto;} .tab_menu .menu > li.on {background:url("/images/sub/tab_top_pc.png") center right 20px no-repeat; background-size:7px auto;} .tab_menu .menu > li > a {display:flex; align-items:center;padding: 0 40px 0 30px; width:100%; height:100%; font-size: 17px; color:#222; font-weight: 500; text-indent:0;border-right:1px solid #ddd ;} .tab_menu .menu > li ul {display:none; position:absolute;width:100%; top:100%; left:0; background-color:#fff;z-index:100;border: 1px solid #ddd;padding: 20px 0;} .tab_menu .menu > li ul li{margin-bottom: 18px;} .tab_menu .menu > li ul li:last-child{margin-bottom: 0px;} .tab_menu .menu > li ul li a {display:block;height: auto;font-size:16px; color:#222; line-height:20px; font-weight: 500;padding:0 20px;} /* depth02_box */ .depth02_box {margin-bottom:100px;} .depth02_box .depth02 {display:flex;} .depth02_box .depth02 > h3 {width:100%;height:70px;background:#fafafa;border:1px solid #c1c1c1;} .depth02_box .depth02 > h3.on {background:#2b6dcd;border:none;} .depth02_box .depth02 > h3 > a {width:100%;height:70px;display:flex;justify-content:center;align-items:center;} .depth02_box .depth02 > h3 > a > span {color:#555;font-size:17px;font-weight:600;} .depth02_box .depth02 > h3.on > a > span {color:#fff;} /* sub_tab_menu */ .sub_tab_menu {margin-bottom:100px;} .sub_tab_menu .menu02 > li > ul {display:flex;} .sub_tab_menu .menu02 > li > ul > li {width:100%;height:70px;background:#fafafa;border:1px solid #c1c1c1;} .sub_tab_menu .menu02 > li > ul > li.on {background:#2b6dcd;border:none;} .sub_tab_menu .menu02 > li > ul > li > a {width:100%;height:70px;display:flex;justify-content:center;align-items:center;} .sub_tab_menu .menu02 > li > ul > li > a > span {color:#555;font-size:17px;font-weight:600;} .sub_tab_menu .menu02 > li > ul > li.on > a > span {color:#fff;} /* depth03_pc */ .depth03_pc ul{display: flex;margin-bottom: 80px;} .depth03_pc ul li{flex:1;padding-bottom: 10px; border-bottom:1px solid #ddd;} .depth03_pc ul li a{display: block; text-align: center; font-size: 18px; color: #777; font-weight: 500;} .depth03_pc ul li.on{border-bottom:3px solid #94c11f;} .depth03_pc ul li.on a{color: #222;} /* depth03_tab */ .depth03_tab{display: none;} /* 공통 */ h5.h5_tit {font-size: 28px; color: #222; font-weight: 700; position: relative; padding-left: 40px; margin-bottom: 30px;} h5.h5_tit:before {position: absolute; content: ''; width: 20px; height: 30px; background: url(/images/sub/h5_tit.png); background-repeat: no-repeat; top: 8px; left: 0;} h5.h5_tit02 {font-size: 24px; color: #222; font-weight: 700; position: relative; padding-left: 40px; margin-bottom: 30px;} h5.h5_tit02:before {position: absolute; content: ''; width: 24px; height: 24px; background: url(/images/sub/h5_tit02.png); background-repeat: no-repeat; left: 0; top: 7px;} h4.h4_tit01 {font-size: 28px; color: #222; font-weight: 700; position: relative; padding-right: 15px; margin-bottom: 30px;} h4.h4_tit01:after {position: absolute; content: ''; width: 90%; height: 2px; background: #ddd; top: 50%; transform: translateY(-50%); right: 0;} table.tbl01{border-top:2px solid #94c11f; width:100%;} table.tbl01 th{padding:15px; font-size:18px; color:#222; background:rgba(148,193,31,0.1); border-bottom:1px solid #ddd;} table.tbl01 td{padding:15px; font-size:16px; color:#222; text-align:center; border-bottom:1px solid #ddd;} /* .ul_box {padding:30px;background:#fafafa;} .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;} .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .ul_box > li.li_n {padding-left:0;} .ul_box > li.li_n:before {content:none;} .ul_box > li p{color: #222;font-weight: 700;padding-bottom: 5px;font-size: 17px;} */ /* sub0101 */ .sub0101_wrap .slick-track .slick-active{opacity:50%;filter: grayscale(1);} .sub0101_wrap .slick-track .slick-current{opacity:100%;filter: grayscale(0);} .sub0101_wrap .slick-track .slick-active .gif_img{display: none;} .sub0101_wrap .slick-track .slick-current .png_img{display: none;} .sub0101_wrap .slick-track .slick-current .gif_img{display: block;} .sub0101_wrap .con {margin-top:100px;} .sub0101_wrap .con01 .txt_wrap > p {font-size:28px;color:#222;font-weight:700;} .sub0101_wrap .con01 .txt_wrap > p:nth-child(2) {font-size:40px;} .sub0101_wrap .con01 .txt_wrap > p .color_g {color:#94c11f;} .sub0101_wrap .con01 .txt_wrap > p .color_b {color:#2b6dcd;} .sub0101_wrap .con .ul_box {padding:30px;background:#fafafa;} .sub0101_wrap .con .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;} .sub0101_wrap .con .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .sub0101_wrap .con .ul_box > li.li_n {padding-left:0;} .sub0101_wrap .con .ul_box > li.li_n:before {content:none;} .sub0101_wrap .con01 .txt_wrap p{font-size: 20px; color: #222; text-align: center;font-weight: 500;} .sub0101_wrap .con01 .txt_wrap p em{color: #ff871c;} .sub0101_wrap .con01 .txt_wrap b{display: block;} .sub0101_wrap .con01 .icon_wrap{display: flex;gap: 140px;justify-content: center;margin-top: 45px;} .sub0101_wrap .con01 .icon_wrap .icon{width: 220px; height: 220px; background: #f5f5f5; border-radius:50%;padding: 28px;} .sub0101_wrap .con01 .icon_wrap .icon img{display: block;margin: 0 auto;} .sub0101_wrap .con01 .icon_wrap .icon span{display: block; font-size: 20px; font-weight: 700; color: #222; text-align: center;margin-top: 25px;} .sub0101_wrap .con02{padding-top: 280px;position: relative;} .sub0101_wrap .con_new {padding-top: 295px;} .sub0101_wrap .con02 .con02_menu .btn{padding: 0px 40px; border-left:1px solid #ddd;height: 143px;} .sub0101_wrap .con02 .con02_menu .btn:first-child{border:none} .sub0101_wrap .con02 .con02_menu .btn.on{} .sub0101_wrap .con02 .con02_menu .btn p{font-size: 16px; color: #222; font-weight: 700;margin-top: 40px;} .sub0101_wrap .con02 .con02_slide .slide01 .img_wrap{position:relative; width:100%; /* padding-bottom:175%; */padding-bottom:67%;} .sub0101_wrap .con02 .con02_slide .slide01 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide02 .img_wrap{position:relative; width:100%; padding-bottom:62.5%;} .sub0101_wrap .con02 .con02_slide .slide02 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide03 .img_wrap{position:relative; width:100%; padding-bottom:56.25%;} .sub0101_wrap .con02 .con02_slide .slide03 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide04 .img_wrap{position:relative; width:100%; padding-bottom:50%;} .sub0101_wrap .con02 .con02_slide .slide04 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide05 .img_wrap{position:relative; width:100%; padding-bottom:55.55%;} .sub0101_wrap .con02 .con02_slide .slide05 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide06 .img_wrap{position:relative; width:100%; padding-bottom:42.857%;} .sub0101_wrap .con02 .con02_slide .slide06 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide07 .img_wrap{position:relative; width:100%; padding-bottom:62.5%;} .sub0101_wrap .con02 .con02_slide .slide07 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .con02_slide .slide08 .img_wrap{position:relative; width:100%; /* padding-bottom:116.98%; */padding-bottom:70.98%;} .sub0101_wrap .con02 .con02_slide .slide08 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0101_wrap .con02 .slick-slide{width: 470px;transform:scale(0.7);transition:.3s;} .sub0101_wrap .con02 .slick-track{padding-top: 100px;padding-bottom: 100px;} .sub0101_wrap .con02 p.slide_txt{font-size: 25px; color: #222; font-weight: 600;text-align: center;display: none;} .sub0101_wrap .con02 .slick-slide.slick-current p.slide_txt{display: block;} .sub0101_wrap .con02 .slick-slide.slick-current {transform:scale(1.2);} .sub0101_wrap .slick-dots{position: absolute;top: -183px;display: flex;gap: 0px 0px; width:1400px; justify-content:center;} .sub0101_wrap .slick-dots li{width: 218.75px;} /* .sub0101_wrap .slick-dots:hover li::after{color: #fd8204;} */ .sub0101_wrap .slick-dots li:first-child{border:none} .sub0101_wrap .slick-dots li:nth-child(1) button{display: block; background: url(/images/sub/sub0101_icon04.png)center no-repeat;width:120px; height: 120px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(1)::after{content:'Mobile'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(1):hover::after{color: #2b6dcd; } .sub0101_wrap .slick-dots li:nth-child(2) button{display: block; background: url(/images/sub/sub0101_icon12.png)center no-repeat;width: 120px; height: 120px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(2)::after{content:'Watch'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(2):hover::after{color: #94c11f; } /* .sub0101_wrap .slick-dots li:nth-child(3) button{display: block; background: url(/images/sub/sub0101_icon06.png)center no-repeat;width: 83px; height: 83px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(3)::after{content:'TV'; display: block; font-size: 16px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(3):hover::after{color: #fd8204; } .sub0101_wrap .slick-dots li:nth-child(4) button{display: block; background: url(/images/sub/sub0101_icon07.png)center no-repeat;width: 86px; height: 77px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(4)::after{content:'게임기'; display: block; font-size: 16px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(4):hover::after{color: #fd8204; }*/ .sub0101_wrap .slick-dots li:nth-child(3) button{display: block; background: url(/images/sub/sub0101_icon08.png)center no-repeat;width: 120px; height: 120px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(3)::after{content:'차량용 디스플레이'; display: block; font-size: 20px; color: #222; font-weight: 700;width: 130px;margin: 40px auto 0;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(3):hover::after{color: #2b6dcd; } .sub0101_wrap .slick-dots li:nth-child(4) button{display: block; background: url(/images/sub/sub0101_icon09.png)center no-repeat;width: 120px; height: 120px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(4)::after{content:'VR / AR'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(4):hover::after{color: #94c11f; } /* .sub0101_wrap .slick-dots li:nth-child(7) button{display: block; background: url(/images/sub/sub0101_icon10.png)center no-repeat;width: 73px; height: 73px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(7)::after{content:'자동차용 스마트폰 무선충전기'; display: block; font-size: 16px; color: #222; font-weight: 700;width: 130px;margin: 40px auto 0;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(7):hover::after{color: #fd8204; } .sub0101_wrap .slick-dots li:nth-child(8) button{display: block; background: url(/images/sub/sub0101_icon11.png)center no-repeat;width: 69px; height: 73px;text-indent:-9999px;margin: 0 auto;} .sub0101_wrap .slick-dots li:nth-child(8)::after{content:'전기차 배터리 팩'; display: block; font-size: 16px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0101_wrap .slick-dots li:nth-child(8):hover::after{color: #fd8204; } */ .sub0101_wrap .slick-prev{position: absolute;top: 50%;transform: translateX(-50%);z-index: 100;background: url(/images/sub/sub0101_prev.png)center no-repeat; width: 40px; height: 74px; background-size: cover;text-indent:-9999px;} .sub0101_wrap .slick-next{position: absolute;top: 50%;right: 0px;transform: translateX(-50%);z-index: 100;background: url(/images/sub/sub0101_next.png)center no-repeat; width: 40px; height: 74px; background-size: cover;text-indent:-9999px;} .sub0101_wrap .con {margin-top:100px;} .sub0101_wrap .con01 .txt_wrap > p {font-size:28px;color:#222;font-weight:700;} .sub0101_wrap .con01 .txt_wrap > p:nth-child(2) {font-size:40px;} .sub0101_wrap .con01 .txt_wrap > p .color_g {color:#94c11f;} .sub0101_wrap .con01 .txt_wrap > p .color_b {color:#2b6dcd;} .sub0101_wrap .con .ul_box {padding:30px;background:#fafafa;} .sub0101_wrap .con .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;} .sub0101_wrap .con .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .sub0101_wrap .con .ul_box > li.li_n {padding-left:0;} .sub0101_wrap .con .ul_box > li.li_n:before {content:none;} /* sub0102 */ .sub0102_wrap .con02 .con02_slide .slide01 .img_wrap{position:relative; width:100%; /* padding-bottom:175%; */padding-bottom:67%;} .sub0102_wrap .con02 .con02_slide .slide01 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide02 .img_wrap{position:relative; width:100%; padding-bottom:62.5%;} .sub0102_wrap .con02 .con02_slide .slide02 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide03 .img_wrap{position:relative; width:100%; padding-bottom:56.25%;} .sub0102_wrap .con02 .con02_slide .slide03 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide04 .img_wrap{position:relative; width:100%; padding-bottom:50%;} .sub0102_wrap .con02 .con02_slide .slide04 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide05 .img_wrap{position:relative; width:100%; padding-bottom:55.55%;} .sub0102_wrap .con02 .con02_slide .slide05 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide06 .img_wrap{position:relative; width:100%; padding-bottom:42.857%;} .sub0102_wrap .con02 .con02_slide .slide06 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide07 .img_wrap{position:relative; width:100%; padding-bottom:62.5%;} .sub0102_wrap .con02 .con02_slide .slide07 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .con02 .con02_slide .slide08 .img_wrap{position:relative; width:100%; /* padding-bottom:116.98%; */padding-bottom:70.98%;} .sub0102_wrap .con02 .con02_slide .slide08 .img_wrap img{position:absolute; left:0; right:0; top:0; bottom:0; margin:auto; width:auto; height:auto; max-width:100%; max-height:100%;} .sub0102_wrap .slick-dots{position: absolute;width:1400px;top: -183px;display: flex;justify-content: center;gap: 0px 0px;} .sub0102_wrap .slick-dots li{border-left:none;width: 173px;} /* .sub0101_wrap .slick-dots:hover li::after{color: #fd8204;} */ .sub0102_wrap .slick-dots li:first-child{border:none} .sub0102_wrap .slick-dots li:nth-child(1) button{display: block; background: url(/images/sub/sub0102_ico01.png)center no-repeat;margin: 0 auto;width:120px;height:120px;} .sub0102_wrap .slick-dots li:nth-child(1)::after{content:'PCM'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0102_wrap .slick-dots li:nth-child(1):hover::after{color: #2b6dcd; } .sub0102_wrap .slick-dots li:nth-child(2) button{display: block; background: url(/images/sub/sub0102_ico02.png)center no-repeat;width:120px;height:120px;margin: 0 auto;} .sub0102_wrap .slick-dots li:nth-child(2)::after{content:'SM'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0102_wrap .slick-dots li:nth-child(2):hover::after{color: #94c11f; } .sub0102_wrap .slick-dots li:nth-child(3) button{display: block; background: url(/images/sub/sub0102_ico03.png)center no-repeat;width:120px;height:120px;margin: 0 auto;} .sub0102_wrap .slick-dots li:nth-child(3)::after{content:'BMS'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0102_wrap .slick-dots li:nth-child(3):hover::after{color: #2b6dcd; } .sub0102_wrap .slick-dots li:nth-child(4) button{display: block; background: url(/images/sub/sub0102_ico04.png)center no-repeat;width:120px;height:120px;margin: 0 auto;} .sub0102_wrap .slick-dots li:nth-child(4)::after{content:'Pack'; display: block; font-size: 20px; color: #222; font-weight: 700;margin-top: 40px;text-align: center;transition:.3s;} .sub0102_wrap .slick-dots li:nth-child(4):hover::after{color: #94c11f; } .sub0102_wrap .slick-dots li:nth-child(5) button{display: block; background: url(/images/sub/sub0102_ico05.png)center no-repeat;width:120px;height:120px;margin: 0 auto;} .sub0102_wrap .slick-dots li:nth-child(5)::after{content:'EV Charging Station'; display: block; font-size: 20px; color: #222; font-weight: 700;width: 130px;margin: 40px auto 0;text-align: center;transition:.3s;} .sub0102_wrap .slick-dots li:nth-child(5):hover::after{color: #2b6dcd; } /* .sub0102_wrap .con03 .ul_box{margin-bottom: 30px;} .sub0102_wrap .con03 .ul_box > li{padding-bottom: 20px;} .sub0102_wrap .con03 .ul_box > li:last-child{padding-bottom: 0px;} */ .sub0102_wrap .con03 .ul_box {padding:30px;background:#fafafa;margin-bottom: 30px;} .sub0102_wrap .con03 .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;padding-bottom: 20px;} .sub0102_wrap .con03 .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .sub0102_wrap .con03 .ul_box > li:last-child{padding-bottom: 0px;} .sub0102_wrap .con03 .ul_box > li.li_n {padding-left:0;} .sub0102_wrap .con03 .ul_box > li.li_n:before {content:none;} .sub0102_wrap .con03 .ul_box > li p{color: #222;font-weight: 700;padding-bottom: 5px;font-size: 17px;} /* sub0103 */ .sub0103_wrap .con {margin-top:100px;} .sub0103_wrap .con:first-child {margin-top:0;} .sub0103_wrap .con .tit_wrap {text-align:center;} .sub0103_wrap .con .tit_wrap > p {font-size:28px;color:#222;font-weight:700;} .sub0103_wrap .con .tit_wrap > p:nth-child(2) {font-size:40px;} .sub0103_wrap .con .tit_wrap > p .color_g {color:#94c11f;} .sub0103_wrap .con .tit_wrap > p .color_b {color:#2b6dcd;} .sub0103_wrap .con .con_wrap {text-align:center;} .sub0103_wrap .con .img_wrap > img {border:1px solid #ddd;} .sub0103_wrap .con .img_wrap02 {margin-top:30px;} .sub0103_wrap .con .con_wrap .p_name {font-size:25px;color:#222;font-weight:600;margin-top:20px;} .sub0103_wrap .con .ul_box {padding:30px;background:#fafafa;} .sub0103_wrap .con .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;} .sub0103_wrap .con .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .sub0103_wrap .con .ul_box > li.li_n {padding-left:0;} .sub0103_wrap .con .ul_box > li.li_n:before {content:none;} /* sub0104 */ .sub0104_wrap .con {margin-top:100px;} .sub0104_wrap .con:first-child {margin-top:0;} .sub0104_wrap .con .con_wrap {margin-top:40px;} .sub0104_wrap .con .tit_wrap {text-align:center;} .sub0104_wrap .con .tit_wrap > p {font-size:28px;color:#222;font-weight:700;} .sub0104_wrap .con .tit_wrap > p:nth-child(2) {font-size:40px;} .sub0104_wrap .con .tit_wrap > p .color_g {color:#94c11f;} .sub0104_wrap .con .tit_wrap > p .color_b {color:#2b6dcd;} .sub0104_wrap .con .ul_box {padding:30px;background:#fafafa;} .sub0104_wrap .con .ul_box > li {position:relative;padding-left:15px;font-size:16px;color:#222;} .sub0104_wrap .con .ul_box > li:before {position:absolute;content:'';left:0;top:12px;width:5px;height:1px;background:#222;} .sub0104_wrap .con .ul_box > li.li_n {padding-left:0;} .sub0104_wrap .con .ul_box > li.li_n:before {content:none;} .sub0104_wrap .con .ul_box > li.li01 {font-size:20px;font-weight:500;margin-top:30px;} .sub0104_wrap .con .ul_box > li.li01:first-child {margin-top:0;} .sub0104_wrap .con .ul_box > li.li02 {margin-left:10px;} .sub0104_wrap .con .click_all {margin-bottom:100px;} .sub0104_wrap .con .click_all .click_btn {display:flex;gap:40px;} .sub0104_wrap .con .click_all .click_btn > li {width:100%;text-align:center;opacity: 100%;filter: grayscale(1);} .sub0104_wrap .con .click_all .click_btn > li > .img_wrap {position:relative;padding-bottom:58.824%;border:1px solid #ddd;} .sub0104_wrap .con .click_all .click_btn > li > .img_wrap > img {position:absolute;left:0;top:0;right:0;bottom:0;margin:auto;height:auto;max-width:100%;max-height:100%;} .sub0104_wrap .con .click_all .click_btn > li > .img_wrap > img.on_img {display:none;} .sub0104_wrap .con .click_all .click_btn > li > .img_wrap > img.off_img {display:block;} .sub0104_wrap .con .click_all .click_btn > li .p_name {font-size:25px;color:#222;font-weight:600;margin-top:20px;} .sub0104_wrap .con .click_all .click_btn > li.on {opacity: 100%;filter: grayscale(0);} .sub0104_wrap .con .click_all .click_btn > li.on .img_wrap {border:2px solid #2b6dcd;} .sub0104_wrap .con .click_all .click_btn > li.on .img_wrap > img.on_img {display:block;} .sub0104_wrap .con .click_all .click_btn > li.on .img_wrap > img.off_img {display:none;} .sub0104_wrap .con .click_all .click_btn > li.on .p_name {color:#2b6dcd;} /* sub0201 */ .sub0201_wrap {} .sub0201_wrap p,strong {word-break: keep-all;} .sub0201_wrap .txt_wrap {margin-bottom: 80px; text-align: center;} .sub0201_wrap .txt_wrap p.tit01 {font-size: 28px; color: #222; font-weight: 600;} .sub0201_wrap .txt_wrap p.tit01 span.color {color: #94c11f; font-weight: 700;} .sub0201_wrap .txt_wrap strong.tit02 {font-size: 50px; color: #222;} .sub0201_wrap .txt_wrap strong.tit02 span.color02 {color: #2b6dcd;} .sub0201_wrap .txt_wrap p.tit03 {font-size: 24px; color: #222; line-height: 1.5; margin-top: 10px;} .sub0201_wrap .img_wrap {display: flex; flex-wrap: wrap; gap: 25px; margin-bottom: 80px;} .sub0201_wrap .img_wrap .img {} .sub0201_wrap .img_wrap .img img {border-radius: 0 30px 0 30px;} .sub0201_wrap .tbl_wrap {} .sub0201_wrap .tbl_wrap table.tbl0201 {border-top: 2px solid #222; width: 100%;} .sub0201_wrap .tbl_wrap table.tbl0201 tr th {padding: 25px 40px; font-size: 18px; color: #222; font-weight: 700; border-bottom: 1px solid #ddd; text-align: left;} .sub0201_wrap .tbl_wrap table.tbl0201 tr td {padding: 25px 40px; font-size: 16px; color: #222; border-bottom: 1px solid #ddd;} /* sub0202 */ .sub0202_wrap {} .sub0202_wrap p,strong {word-break: keep-all;} .sub0202_wrap .con1 {display: flex; flex-wrap: wrap; gap: 50px; align-items: center;} .sub0202_wrap .con1 .img_wrap {width: 40%;} .sub0202_wrap .con1 .img_wrap img {} .sub0202_wrap .con1 .txt_wrap {width: 55%;} .sub0202_wrap .con1 .txt_wrap strong.hi {display: block; font-size: 50px; color: #222; margin-bottom: 40px;} .sub0202_wrap .con1 .txt_wrap p.p_con {font-size: 16px; color: #222; margin-bottom: 20px;} .sub0202_wrap .con1 .txt_wrap p.p_con:last-child {margin-bottom: 0;} .sub0202_wrap .con1 .txt_wrap .name {margin-top: 40px; text-align: right;} .sub0202_wrap .con1 .txt_wrap .name p.ceo {font-size: 18px; color: #222; display: inline-block;} .sub0202_wrap .con1 .txt_wrap .name p.ceo02 {font-size: 26px; color: #222; font-weight: 700; display: inline-block; margin-left: 20px;} /* sub0203 */ .sub0203_wrap {} .sub0203_wrap p,span,strong {word-break: keep-all;} .sub0203_wrap strong.tit {font-size: 50px; color: #222; display: block; text-align: center; margin-bottom: 60px;} .sub0203_wrap strong.tit span.color {color: #2b6dcd;} .sub0203_wrap .txt_box {border-radius: 10px; background: #f7f7f7; padding: 30px; text-align: center; margin-bottom: 80px;} .sub0203_wrap .txt_box span.tit {font-size: 30px; color: #2b6dcd; font-weight: 700;} .sub0203_wrap .txt_box p.p_con {font-size: 18px; color: #222; margin-top: 10px;} .sub0203_wrap .con1 {} .sub0203_wrap .con1 .bd_con {display: flex; flex-wrap: wrap; align-items:center; gap: 3%; margin-bottom: 60px;} .sub0203_wrap .con1 .bd_con:last-child {margin-bottom: 0;} .sub0203_wrap .con1 .bd_con .circle {width: 260px; height: 260px; background: rgba(148, 193, 31, 0.4); border-radius: 50%; position: relative; z-index: -1;} .sub0203_wrap .con1 .bd_con .circle:after {width: 10px; height: 10px; border-radius: 50%; background: #2b6dcd; position: absolute; content: ''; top: 50%; left: 92%; transform: translate(-50%,-50%);} .sub0203_wrap .con1 .bd_con .circle .icon {padding: 80px;} .sub0203_wrap .con1 .bd_con .circle .icon:after {width: 220px; height: 220px; border-radius: 50%; background: #fff; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); position: absolute; content:''; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0;} .sub0203_wrap .con1 .bd_con .circle .icon img {z-index: 1; position: relative;} .sub0203_wrap .con1 .bd_con .bd_box {background: #fff; border-radius: 10px; border: 1px dashed #ddd; padding: 30px 40px; position: relative; width: 78%; min-height: 135px;} .sub0203_wrap .con1 .bd_con:last-child .bd_box {min-height: 165px;} .sub0203_wrap .con1 .bd_con .bd_box:before {width: 54px; height: 1px; border: 1px dashed #ddd; position: absolute; content: ''; top: 50%; left: -2.8%; transform: translate(-50%, -50%);} .sub0203_wrap .con1 .bd_con .bd_box span.bd_tit {font-size: 26px; color: #2b6dcd; font-weight: 700;} .sub0203_wrap .con1 .bd_con .bd_box p.bd_con01 {font-size: 16px; color: #222; font-weight: 500; margin-top: 5px;} .sub0203_wrap .con1 .bd_con .bd_box p.bd_point {font-size: 16px; color: #2b6dcd; font-weight: 700; margin-top: 5px;} /* sub0203_2 */ .sub0203_2_wrap .txt_wrap {display: none;} /* sub0203_3 */ .sub0203_3_wrap .con1 {margin-bottom: 80px;} .sub0203_3_wrap .con1:last-child {margin-bottom: 0;} .sub0203_3_wrap .con1 p.p_con {font-size: 16px; color: #555; } .sub0203_3_wrap .con1 strong.point {display: block; text-align: center; font-size: 40px; color: #2b6dcd;} .sub0203_3_wrap .con1 .img_wrap {margin-top: 60px;} .sub0203_3_wrap .con1:first-child .img_wrap img {margin: 0 auto; width: 50%;} .sub0203_3_wrap .con1 .img_wrap img {margin: 0 auto; width: 80%;} .sub0203_3_wrap .con1 .txt_wrap {display: none;} /* sub0203_4 */ .sub0203_4_wrap p, li, span, td {word-break: keep-all;} .sub0203_4_wrap i {display: block;} .sub0203_4_wrap .con1 {margin-bottom: 80px;} .sub0203_4_wrap .con1 .txt_box {padding: 40px; background: rgba(43, 109, 205, 0.05); border-radius: 10px;} .sub0203_4_wrap .con1 .txt_box p.p_box {font-size: 16px; color: #222; font-weight: 500;} .sub0203_4_wrap .con1 .arrow {margin: 30px auto; text-align:center;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl {width: 100%; border-top: 1px solid #2b6dcd;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th {padding: 30px; border-bottom: 1px dashed #ddd;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon {display: flex; flex-wrap: wrap; gap: 10px;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li {width: 16%; display: flex; flex-direction: column; align-items: center;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li .icon_img {width: 180px; height: 180px; border-radius: 50%; background: #fff; border: 10px solid rgba(148, 193, 31, 0.3); display: flex; justify-content: center; align-items: center;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li:nth-child(odd) .icon_img {border: 10px solid rgba(148, 193, 31, 0.3);} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li:nth-child(even) .icon_img {border: 10px solid rgba(43, 109, 205, 0.3);} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li .icon_txt {margin-top: 20px;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th.icon_list ul.icon li .icon_txt > p {font-size: 16px; color: #222; font-weight: 500;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th span.num {display: block; font-size: 28px; color: #2b6dcd; font-weight: 700; position: relative; padding-right: 6px;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr th span.num:after {position: absolute; content: ''; width: 4px; height: 4px; background: #94c11f; top: 29px; right: 0; border-radius: 50%;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr td {padding: 30px; border-bottom: 1px dashed #ddd; font-size: 18px; color: #222; font-weight: 500;} .sub0203_4_wrap .con1 .list_wrap table.list_tbl tr:nth-child(5) td {border-top: 1px dashed #ddd;} .sub0203_4_wrap .con2 .target_wrap ul.target_li {display: flex; flex-wrap: wrap; gap:2%;} .sub0203_4_wrap .con2 .target_wrap ul.target_li li {padding: 30px 40px; background: #f7f7f7 url(/images/sub/sub0203_4_back_icon01.png); background-repeat: no-repeat; background-position: 90%; border-radius: 10px; width: 32%; } .sub0203_4_wrap .con2 .target_wrap ul.target_li li:nth-child(2) {background: #f7f7f7 url(/images/sub/sub0203_4_back_icon02.png); background-repeat: no-repeat; background-position: 90%; } .sub0203_4_wrap .con2 .target_wrap ul.target_li li:nth-child(3) {background: #f7f7f7 url(/images/sub/sub0203_4_back_icon03.png); background-repeat: no-repeat; background-position: 90%; } .sub0203_4_wrap .con2 .target_wrap ul.target_li li p.p_t{font-size: 20px; color: #222; font-weight: 600;} .sub0203_4_wrap .con2 .target_wrap ul.target_li li span.s_t{font-size: 60px; font-weight: 700; color: #2b6dcd; display: block;} .sub0203_4_wrap .con2 .target_wrap ul.target_li li .i_t {margin-top: 10px; margin-left: 160px;} /* sub0203_5 */ .sub0203_5_wrap {} .sub0203_5_wrap i {display: block;} .sub0203_5_wrap .con1 h4.h4_tit01:after {width: 86%;} .sub0203_5_wrap .con2 h4.h4_tit01:after {width: 65%;} .sub0203_5_wrap .con1 {margin-bottom: 80px;} .sub0203_5_wrap .con1:last-child {margin-bottom: 0;} .sub0203_5_wrap .con1 .txt_wrap {padding: 40px; background: rgba(43,109,205,0.05); border-radius: 10px;} .sub0203_5_wrap .con1 .txt_wrap p.p_con {font-size: 16px; color: #222; font-weight: 500; margin-bottom: 10px;} .sub0203_5_wrap .con1 .txt_wrap p.p_con:last-child {margin-bottom: 0;} .sub0203_5_wrap .con1 .txt_wrap p.p_con span.color {color: #2b6dcd; font-weight: 700;} .sub0203_5_wrap .con1 .txt_wrap p.p_con span.color02 {color: #f08013; font-weight: 700;} .sub0203_5_wrap .con2 .txt_wrap {padding: 40px; border: 1px solid #ddd; background: #fafafa; border-radius: 0;} .sub0203_5_wrap .con2 .txt_wrap p.p_con {font-size: 16px; color: #222; font-weight: 500; margin-bottom: 20px;} .sub0203_5_wrap .con2 .txt_wrap p.p_color {font-size: 16px; color: #2b6dcd; font-weight: 500;} .sub0203_5_wrap .con2 .txt_wrap ul.list01 {margin-bottom: 20px;} .sub0203_5_wrap .con2 .txt_wrap ul.list01 > li {font-size: 16px; color: #222; font-weight: 500; position: relative; padding-left: 15px; margin-bottom: 10px;} .sub0203_5_wrap .con2 .txt_wrap ul.list01 > li:before {position: absolute; content:''; width: 5px; height: 5px; background: #2b6dcd; top: 9px; left: 0;} .sub0203_5_wrap .con2 .txt_wrap ul.list01 li ul.list01_2 {} .sub0203_5_wrap .con2 .txt_wrap ul.list01 li ul.list01_2 li {font-size: 16px; color: #222; font-weight: 500;} .sub0203_5_wrap .con2 .btn_wrap {margin-top: 40px;} .sub0203_5_wrap .con2 .btn_wrap a.btn {display: block; margin: 0 auto; background: #2b6dcd; border-radius: 10px; color: #fff; font-size: 20px; font-weight: 600; width: 250px; height: 60px; line-height: 60px; text-align: center;} /* sub0204 */ .tab_btn {margin:0 auto; display: flex; justify-content:center; margin-bottom:80px;} .tab_btn a {width: 250px; height: 60px; font-size: 18px; font-weight: 500; color: #777; border: 1px solid #ddd; display: flex; align-items: center; justify-content:center;} .tab_btn a:hover {color: #fff; background: #94c11f; border: 1px solid #94c11f;} .tab_btn a.on {color: #fff; background: #94c11f; border: 1px solid #94c11f;} .sub0204_wrap {position:relative; word-break:keep-all;} .sub0204_wrap:before {position:absolute; content:"";left:50%; transform:translateX(-50%); z-index:-1; width:1px; height:100%; background: #ddd;} .sub0204_wrap .tit {font-size: 28px; font-weight: 500; color: #fff; text-align: center; width:180px; height:180px; background: linear-gradient(to top, #373ca0, #448bcd); border-radius:50%; margin: 0 auto; display: flex;align-items: center; justify-content:center; flex-direction:column; line-height: 1.5;} .sub0204_wrap .tit span {display:block; font-size: 24px;} .sub0204_wrap .history_con ul li.right {margin: 40px 0 0 auto; padding-left: 85px; position: relative; width:50%;} .sub0204_wrap .history_con ul li.right:before {position:absolute; content:"";width:20px; height:20px; background: url(/images/sub/sub0204_tit.png)no-repeat; left:-10px; top:52px;} .sub0204_wrap .history_con ul li.right strong {font-size: 30px; font-weight: 600; color: #94c11f;} .sub0204_wrap .history_con ul li.right ul.list01 {} .sub0204_wrap .history_con ul li.right ul.list01 li {position:relative; padding-left:15px; color: #222; font-size: 18px;} .sub0204_wrap .history_con ul li.right ul.list01 li.month {position:relative; padding-left:58px; color: #222; font-size: 18px;} .sub0204_wrap .history_con ul li.right ul.list01 li.month span {font-weight: 600; margin-right:20px; position:absolute; left:15px;} .sub0204_wrap .history_con ul li.right ul.list01 li:before {position:absolute; content:""; width:5px; height:5px; border-radius:50%; background: #94c11f; left:0; top:11px;} .sub0204_wrap .history_con ul li.right ul.list01 li:first-child:after {position:absolute; content:""; width:75px; height:1px; background: #ddd; left:-75px; top:13px;} .sub0204_wrap .history_con ul li.left {margin: 40px 0 0 auto; padding-right: 85px; position: relative; margin-right:50%; text-align:right;} .sub0204_wrap .history_con ul li.left:after {position:absolute; content:"";width:20px; height:20px; background: url(/images/sub/sub0204_tit.png)no-repeat; right:-10px; top:52px;} .sub0204_wrap .history_con ul li.left strong {font-size: 30px; font-weight: 600; color: #94c11f;} .sub0204_wrap .history_con ul li.left ul.list01 {} .sub0204_wrap .history_con ul li.left ul.list01 li {position:relative; padding-right:15px; color: #222; font-size: 18px;} .sub0204_wrap .history_con ul li.left ul.list01 li.month {position:relative; padding-right:58px; color: #222; font-size: 18px;} .sub0204_wrap .history_con ul li.left ul.list01 li.month span {font-weight: 600; margin-left:20px; position:absolute; right:15px;} .sub0204_wrap .history_con ul li.left ul.list01 li:before {position:absolute; content:""; width:5px; height:5px; border-radius:50%; background: #94c11f; right:0; top:11px;} .sub0204_wrap .history_con ul li.left ul.list01 li:first-child:after {position:absolute; content:""; width:75px; height:1px; background: #ddd; right:-75px; top:13px;} .sub0204_wrap .tit02 {margin: 100px auto 0 auto;} /* sub0206 */ .sub0206_wrap {word-break:keep-all;} .sub0206_wrap span.c_blue {color: #2b6dcd; font-weight: 600;} .sub0206_wrap span.c_green {color:#94c11f; font-weight:600;} .sub0206_wrap strong.tit {font-size:40px; text-align:center; color: #222;display: block; margin-bottom:80px;} .sub0206_wrap .con {margin-top: 60px; display: flex; justify-content: space-between;} .sub0206_wrap .con:first-child {margin-top:0;} .sub0206_wrap .con .left {width: 63%;} .sub0206_wrap .con .left span.span_top {color: #999; font-size: 15px;} .sub0206_wrap .con .left strong {font-size: 30px; color:#222;display: block;} .sub0206_wrap .con .right p {margin-top: 15px; color: #666; font-size: 16px;} .sub0206_wrap .con .right p b {color: #222;} /* sub0207 */ .sub0207_wrap {} .sub0207_wrap p.p_pg_top {font-size:40px; font-weight:700; color: #222; text-align:center;margin-bottom:60px;} .sub0207_wrap span.color_g {color: #94c11f;} .sub0207_wrap span.color_b {color: #2b6dcd;} .sub0207_wrap .con01 {margin-bottom:60px;} .sub0207_wrap .con01:last-child {margin-bottom:0;} .sub0207_wrap .con01 .con_all{} .sub0207_wrap .con01 .con_all .con_ea{margin-bottom:50px; display:flex; align-items: center; background:#f8f8f8; border-radius: 30px;} .sub0207_wrap .con01 .con_all .con_ea:last-child{margin-bottom:0;} .sub0207_wrap .con01 .con_all .con_ea .txt_wrap{padding:30px;} .sub0207_wrap .con01 .con_all .con_ea .img_wrap img {border-radius: 30px 30px;} div.pg_go_btn_wrap{margin-bottom:30px; display:flex; align-items: center; justify-content: space-between;} div.pg_go_btn_wrap .home_pg_go a{display:inline-block; width:180px; height:50px; background:rgba(148,193,31,0.1); border:1px solid #94c11f; font-size:18px; color:#94c11f; text-align:center; line-height:50px; font-weight:600; border-radius: 30px;} .sub0207_wrap .con01 .con_all .con_ea .txt_wrap p{margin-bottom:25px; font-size:18px; color:#222; word-break:keep-all;} .sub0207_wrap .con01 .con_all .con_ea .txt_wrap p:last-child{margin-bottom:0;} /* sub0208 */ .sub0208_wrap .con {margin-top:100px;} .sub0208_wrap .con:first-child {margin-top:0;} .sub0208_wrap .con .txt_wrap {text-align:center;} .sub0208_wrap .con .txt_wrap > p {font-size:18px;color:#222;font-weight:500;margin-top:10px;} .sub0208_wrap .con .txt_wrap .p02 {font-size:40px;font-weight:700;} .sub0208_wrap .con .txt_wrap > p .color_g {color:#94c11f;} .sub0208_wrap .con .txt_wrap > p .color_b {color:#2b6dcd;} .sub0208_wrap .con .bg_box {position:relative;width:100%;height:130px;background:#fafafa;border-radius:60px;display:flex;justify-content:center;align-items:center;} .sub0208_wrap .con .bg_box:before {position:absolute;left:5px;top:5px;content:'';width:calc(100% - 10px);height:120px;border-radius:55px;border:1px solid #94c11f;} .sub0208_wrap .con .logo_wrap {display:flex;gap:13px;margin-top:60px;} .sub0208_wrap .con .logo_wrap .logo_box {position:relative;width:100%;border:1px solid #c1c1c1;padding:10px;} .sub0208_wrap .con .logo_wrap .logo_box .logo_tit {position:absolute;left:-1px;top:-10px;width:300px;background:#2b6dcd;height:70px;border-radius:0 0 30px 0;display:flex;justify-content:center;align-items:center;} .sub0208_wrap .con .logo_wrap .logo_box:nth-child(even) .logo_tit {background:#94c11f;} .sub0208_wrap .con .logo_wrap .logo_box .logo_tit > p {font-size:18px;color:#fff;} .sub0208_wrap .con .logo_wrap .logo_box .logo_tit:before {position:absolute;left:5px;top:5px;content:'';width:calc(100% - 10px);height:60px;border:1px solid rgba(255,255,255,0.5);border-radius:0 0 30px 0;} .sub0208_wrap .con .logo_wrap .logo_box .ul_box {display:flex;flex-wrap:wrap;gap:10px;margin-top:70px;} .sub0208_wrap .con .logo_wrap .logo_box .ul_box > li {width:100%;} .sub0208_wrap .con .logo_wrap .logo_box .ul_box > li > img {border:1px solid #eee; width:100%; padding:25px; } /* sub0209 */ .sub0209_wrap {} .sub0209_wrap .con01 img {border: 1px solid #ddd;} .sub0209_wrap .con02 {margin-top:60px;} .sub0209_wrap .con02 ul {display: flex; gap:30px;} .sub0209_wrap .con02 ul li {width: 33.333%;} .sub0209_wrap .con02 ul li strong {font-size:20px; font-weight: 600; color: #fff; background: #2b6dcd; height:50px; line-height:50px; text-align:center; width:100%; display: block; border-radius: 20px 0 20px 0; margin-bottom:15px;} .sub0209_wrap .con02 ul li .con {display: flex; gap:20px;} .sub0209_wrap .con02 ul li .con img {border: 1px solid #ddd;} .sub0209_wrap .con02 ul li .con table {width:100%;} .sub0209_wrap .con02 ul li .con table tr th {font-size:17px; color: #222; padding: 15px 0; border-bottom: 1px dashed #ddd; padding-left: 10px;} .sub0209_wrap .con02 ul li .con table tr:last-child th {border-bottom: 0;} .sub0209_wrap .con02 ul li .con table tr td {font-size:16px; color: #222; border-bottom: 1px dashed #ddd; padding-left: 10px;} .sub0209_wrap .con02 ul li .con table tr:last-child td {border-bottom: 0;} /* sub0301 */ .sub0301_wrap {} .sub0301_wrap h4.h4_tit {font-size:28px; color: #222; font-weight:700; position:relative; margin-bottom:30px;} .sub0301_wrap h4.h4_tit:after {position:absolute; content:""; height:2px; width:930px; background: #ddd; top:50%; transform:translateY(-50%); right:0;} .sub0301_wrap .con01 {display: flex; gap:30px;} .sub0301_wrap .con01 .txt_wrap {display: none;} .sub0301_wrap .con01 .right {width:37.85%;} .sub0301_wrap .con01 .right .con {border: 1px solid #ddd; margin-bottom:30px;} .sub0301_wrap .con01 .right .con:last-child {margin-bottom:0;} .sub0301_wrap .con01 .right .con .tit_wrap {display: flex; width:100%;} .sub0301_wrap .con01 .right .con .tit_wrap b {font-size: 20px; font-weight:600; color: #fff; background: #fd8204; height:40px; line-height:40px; padding: 0 20px; display: block; width:67px;} .sub0301_wrap .con01 .right .con .tit_wrap p {font-size: 20px; font-weight:600; color: #222; background: rgba(253,130,4,0.1);; height:40px; line-height:40px; padding: 0 20px; display: block; width:calc(100% - 67px);} .sub0301_wrap .con01 .right .con:nth-child(2) .tit_wrap b {background: #2b6dcd;} .sub0301_wrap .con01 .right .con:nth-child(2) .tit_wrap p {background: rgba(43,109,205,0.1);} .sub0301_wrap .con01 .right .con:nth-child(3) .tit_wrap b {background: #94c11f;} .sub0301_wrap .con01 .right .con:nth-child(3) .tit_wrap p {background: rgba(148,193,31,0.1);} .sub0301_wrap .con01 .right .con .img_wrap {display: flex; padding: 20px; gap:10px;} .sub0301_wrap .con01 .right .con .img_wrap .box img {border: 1px solid #ddd;} .sub0301_wrap .con01 .right .con .img_wrap .box p {font-size:16px; color: #222; text-align:center; margin-top:5px; margin-bottom:-10px;} /* sub0302 */ .sub0302_wrap {} .sub0302_wrap table.tbl01 {width:100%; border-top: 2px solid #2b6dcd;} .sub0302_wrap table.tbl01 tr th {padding: 15px 0 ; font-size: 17px; color: #222; background: #e9f0fa; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;} .sub0302_wrap table.tbl01 tr th:last-child {border-right:0;} .sub0302_wrap table.tbl01 tr td {text-align:center; font-size: 16px; color: #666; padding: 10px; border-right: 1px solid #ddd;border-bottom: 1px solid #ddd;} .sub0302_wrap table.tbl01 tr td:last-child {border-right: 0;} .sub0302_wrap table.tbl01 tr td.border {border-right: 1px solid #ddd;} .sub0302_wrap table.tbl01 ul.list01 li {text-align:left; position:relative; padding-left: 14px;} .sub0302_wrap table.tbl01 ul.list01 li:before {position:absolute; content:""; width:4px; height:4px; border-radius:50% ;background: #94c11f;top:50%; transform: translateY(-50%); left:0;} .sub0302_wrap table.tbl01 tr .td01 {font-weight:600; background: #f4f9e8; color: #222;} .sub0302_wrap table.tbl01 .img_wrap {display:flex; justify-content:center;} .sub0302_wrap table.tbl01 .img_wrap01 {display: flex; gap: 20px; justify-content:center;} .sub0302_wrap table.tbl01 .con {margin-bottom:10px;} .sub0302_wrap table.tbl01 .con:last-child {margin-bottom:0;} .sub0302_wrap table.tbl01 .txt_wrap {display: flex; gap: 20px; justify-content:center; margin-top:10px;} .sub0302_wrap table.tbl01 .txt_wrap p {font-size: 15px; position:relative; padding-left: 14px;} .sub0302_wrap table.tbl01 .txt_wrap p:before {position:absolute; content:""; width:4px; height:4px; border-radius:50% ;background: #94c11f;top:50%; transform: translateY(-50%); left:0;} .sub0302_wrap table.tbl01 .con_wrap {display: flex; justify-content:center; gap:20px;} /* sub0303 */ .sub0303_wrap {word-break: keep-all;} .sub0303_wrap {display: flex; gap: 20px;} .sub0303_wrap .left {width:690px;} .sub0303_wrap .left .con01 {border: 1px solid #ddd; border-radius: 10px; padding:20px; margin-bottom:40px;} .sub0303_wrap .left .con02 {display: flex; gap: 48px; justify-content: center; margin-bottom:60px;} .sub0303_wrap .left .con02 li {display: flex; flex-direction:column; align-items:center;} .sub0303_wrap .left .con02 li strong {font-size: 20px; color: #222; line-height: 1.3;} .sub0303_wrap .left .con03 {background:rgba(43,109,205,0.05); padding: 20px; border-radius:10px; position:relative;} .sub0303_wrap .left .con03:after {position:absolute; content:""; background: url(/images/sub/sub0303_bg01.png)no-repeat; bottom:10px; right:10px; width:60px; height:66px;} .sub0303_wrap .left .con03 p {font-size: 16px; font-weight:600; color:#222;} .sub0303_wrap .right .con04 {display: flex; gap:20px; margin-bottom:30px;} .sub0303_wrap .right .con04 > div {background: rgba(43,109,205,0.05); padding: 20px; border-radius:10px;} .sub0303_wrap .right .con04 > div strong {font-size: 16px; color: #222; font-weight:600;} .sub0303_wrap .right .con04 > div p {font-size: 16px; color: #222; position:relative; padding-left:14px;} .sub0303_wrap .right .con04 > div p:before {position:absolute; width:4px; height:1px; content:""; background: #222; top:11px; left:0;} .sub0303_wrap .right .con04 > div .img_wrap {margin-top:20px; display: flex; gap:10px;} .sub0303_wrap .right .img_wrap02 {display: flex; justify-content: center; margin-bottom: 30px;} .sub0303_wrap .right .tit_wrap {padding: 20px 0; box-shadow: 0px 0px 20px rgba(0,0,0,0.1); border-radius: 10px; text-align:center; margin-bottom:30px;} .sub0303_wrap .right .tit_wrap strong {font-size:20px; color: #222; font-weight:600;} .sub0303_wrap .right .img_wrap03 {display:flex; background: #f8f8f8;padding: 20px; border-radius:10px; gap:20px; justify-content: center;} /* sub0304 */ .sub0304_wrap .mob_tbl {display: none;} .sub0304_wrap table.tbl01 {width: 100%;} .sub0304_wrap table.tbl01 tr th {border-top: 2px solid #94c11f; border-left: 1px solid #ddd; padding: 15px; font-size: 18px; color: #222; font-weight: 700; background: rgba(148,193,31,0.1); } .sub0304_wrap table.tbl01 tr th:first-child {border-left: 0;} .sub0304_wrap table.tbl01 tr td {text-align: center; padding: 15px; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; font-size: 16px; color: #555; font-weight: 500;} .sub0304_wrap table.tbl01 tr td:first-child {border-left: 0;} .sub0304_wrap table.tbl01 img {border:1px solid #ddd;} /* sub0401 */ .sub0401_wrap .con01 .img_wrap {display: flex; align-items:center; justify-content:center; margin-bottom:50px;} .sub0401_wrap .con01 .img_wrap img {border: 1px solid #ddd;} .sub0401_wrap .patent_p02{text-align:right; font-size:15px; margin-bottom:10px;} .sub0401_wrap .tbl01 .p_color01 td{color:#fff; background:#b4cfa8;} .sub0401_wrap .tbl01 .p_color02 td{color:#fff; background:#70ad47;} .sub0401_wrap .tbl01 .p_color03 td{color:#fff; background:#5b8e39;} .sub0401_wrap .tbl01 .p_color04 td{color:#222; background:#f7f7f7;} .sub0401_wrap .con02 {margin-top:80px;} /* sub0401_2 */ .sub0401_2_wrap .page_wrap{text-align:center; box-sizing:border-box; margin-top: 60px;} .sub0401_2_wrap ul.page{display: flex; justify-content: center; font-size:0; } .sub0401_2_wrap ul.page li{display:block; margin:0 2px; width:40px; height:40px; border:1px solid #ddd; vertical-align:middle; } .sub0401_2_wrap ul.page li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size:14px; color:#555555; line-height:38px; font-weight: 700;} .sub0401_2_wrap ul.page li a img{display: block; } .sub0401_2_wrap ul.page li.on{background:#94c11f; border:1px solid #94c11f; } .sub0401_2_wrap ul.page li.on a{color:#fff; font-weight: 700;} /* sub0401_3 */ .sub0401_3_wrap table.tbl01 th {border-right: 1px solid #ddd;} .sub0401_3_wrap table.tbl01 td {border-right: 1px solid #ddd;} .sub0401_3_wrap table.tbl01 td:last-child {border-right: 0;} /* sub0404 */ .sub0404_wrap table {width: 100%;} .sub0404_wrap table.tbl_02 tr th {border-top: 2px solid #94c11f; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd;padding: 15px; font-size: 18px; color: #222; font-weight: 700; background: rgba(148,193,31,0.1);} .sub0404_wrap table.tbl_02 tr th:first-child {border-left: 0;} .sub0404_wrap table.tbl_02 tr th.th02 {border-top: 1px solid #ddd;} .sub0404_wrap table.tbl_02 tr td {text-align: center; padding: 15px; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; font-size: 16px; color: #555; font-weight: 500;} .sub0404_wrap table.tbl_02 tr:first-child td:first-child {border-left: 0;} /* sub0502 */ .sub0502_wrap { word-break: keep-all;} .sub0502_wrap strong.tit {font-size:28px; font-weight:600; color: #222; margin-bottom:30px; padding-bottom:20px;text-align:center; display: block; position:relative;} .sub0502_wrap strong.tit:after {position:absolute; content:"";width: 40px; height:2px; background: #94c11f; bottom:0; left:50%; transform:translateX(-50%);} .sub0502_wrap .tab_top {display: flex; justify-content:center;margin-bottom: 50px;} .sub0502_wrap .tab_top li {width: 14.28%; display:flex; flex-direction: column; align-items:center; cursor:pointer;} .sub0502_wrap .tab_top li .img_wrap img.off {display:block;} .sub0502_wrap .tab_top li .img_wrap img.on {display:none;} .sub0502_wrap .tab_top li:hover .img_wrap img.off {display:none;} .sub0502_wrap .tab_top li:hover .img_wrap img.on {display:block;} .sub0502_wrap .tab_top li.on .img_wrap img.on {display:block;} .sub0502_wrap .tab_top li.on .img_wrap img.off {display:none;} .sub0502_wrap .tab_top li strong {font-size:20px; color: #222; margin-top:30px;} .sub0502_wrap .con01 h4.h4_tit01:after {width: 93%;} .sub0502_wrap .con01 .txt_wrap {padding:30px; background: #fafafa;} .sub0502_wrap .con01 .txt_wrap .box {margin-bottom: 30px;} .sub0502_wrap .con01 .txt_wrap .box:last-child {margin-bottom: 0;} .sub0502_wrap .con01 .txt_wrap strong {font-size:20px; color: #222; margin-bottom:10px;display: block;} .sub0502_wrap .con01 .txt_wrap p {font-size: 16px; color: #666; margin-left:16px; position:relative; padding-left: 10px; line-height:2.0;} .sub0502_wrap .con01 .txt_wrap p:before {position:absolute; content:"";width:4px; height:1px; background: #666; left:0; top: 14px;} .sub0502_wrap .con01 .txt_wrap b {font-size: 16px; color: #222; line-height:2.0;} .sub0502_wrap .con02 h4.h4_tit01:after {width: 88%;} .sub0502_wrap .con02 h5.tit01 {margin-top:50px;} .sub0502_wrap .con03 h4.h4_tit01:after {width: 90%;} .sub0502_wrap .con03 .txt_wrap b {margin-bottom:30px; display:block;} .sub0502_wrap .con04 h4.h4_tit01:after {width: 92%;} .sub0502_wrap .con06 h4.h4_tit01:after {width: 88%;} /* sub0503 */ .sub0503_wrap {word-break:keep-all;} .sub0503_wrap span.color_b {color:#2b6dcd;} .sub0503_wrap span.color_g {color:#94c11f;} .sub0503_wrap .tit_wrap {text-align:center;} .sub0503_wrap .tit_wrap span.tit {font-size:28px; font-weight:600; color:#222;} .sub0503_wrap .tit_wrap strong {font-size:50px; font-weight:600; display: block; color:#222;} .sub0503_wrap .con01 {margin-top:60px; display: flex;justify-content: center;} .sub0503_wrap .con01 .txt_wrap {display: none;} /* sub0504 */ .sub0504_wrap {} .sub0504_wrap span.color_b {color:#2b6dcd;} .sub0504_wrap span.color_g {color:#94c11f;} .sub0504_wrap > strong {font-size: 50px; color: #222; text-align:center; margin-bottom:60px; display:block;} .sub0504_wrap .con01 {margin-bottom:100px;} .sub0504_wrap .con01 .top_box {display: flex; align-items:center;} .sub0504_wrap .con01 .box {display: flex; flex-direction:column; width:20%; align-items:center;} .sub0504_wrap .con01 .box img {box-shadow:4px 4px 7px rgba(0,0,0,.1); border-radius:50%;} .sub0504_wrap .con01 .box strong {margin-top:30px; font-size: 18px; color: #222;} .sub0504_wrap .con02 .bot_box {display:flex; gap:40px; margin-bottom:30px;} .sub0504_wrap .con02 .bot_box:last-chdil {margin-bottom:0;} .sub0504_wrap .con02 .bot_box .box01 {padding:10px; background: #f8f8f8; border-radius: 80px; display: flex; align-items: center; width:680px;} .sub0504_wrap .con02 .bot_box .box01 img {border: 1px solid #ddd; border-radius:50%;} .sub0504_wrap .con02 .bot_box .box01 .txt_wrap {margin-left:30px;} .sub0504_wrap .con02 .bot_box .box01 .txt_wrap strong {font-size:20px; color: #222; margin-bottom:10px; display: block;} .sub0504_wrap .con02 .bot_box .box01 .txt_wrap p {font-size:16px; color: #666;}