/* 서브 공통 */

html, body{ overflow-x: hidden; }


sup{ vertical-align: super; font-size: 0.6em; }


#sub .sub_visual{ height: 700px; width: 100%; overflow: hidden; position: relative; }
#sub .sub_visual .v_img{ width: 100%; height: 100%; position: relative; }
#sub .sub_visual .v_img img{ position: absolute; left: 50%; top: 50%; display: block; min-height: 100%; min-width: 100vw; object-fit: fill; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }
#sub .sub_visual .v_tit{ position: absolute; left: 0; bottom: 80px; width: 100%; }
#sub .sub_visual .v_tit strong{ font-size: 80px; font-weight: 800; color: #fff; }

#sub .sub_tab{ height: 80px; width: 100%; border-bottom: 1px solid #DBE0E9; position: relative; z-index: 1; }
#sub .sub_tab .inner{ display:flex; height: 100%; }
#sub .sub_tab .home{ width: 80px; background-color: #2C7DDF; transition: background .3s; height: 100%; }
#sub .sub_tab .home a{ display: flex; align-items: center; justify-content: center;  width: 100%; height: 100%; }
#sub .sub_tab .home:hover{ background-color: #172F5F; }
#sub .sub_tab .loc{ width:300px; height: 100%; position: relative; border-right: 1px solid #dbe0e9; }
#sub .sub_tab .loc button{ width: 100%; height: 100%; display:flex; align-items: center; justify-content: space-between; padding: 0 30px; font-size: 19px; font-weight: 500; color:#222222; text-align: left; }
#sub .sub_tab .loc .loc_ul{ position: absolute; width: calc(100% + 1px); border: 1px solid #dbe0e0; background-color: #fff; left: 0; top: 100%; padding: 30px; display: none; }
#sub .sub_tab .loc .loc_ul li{ margin-bottom: 20px; }
#sub .sub_tab .loc .loc_ul li a{ transition: color .3s; }
#sub .sub_tab .loc .loc_ul li a:hover{ color: #2A71C8; }
#sub .sub_tab .loc .loc_ul li:last-child{ margin-bottom: 0; }

#sub .con_w{ display:flex; gap: 140px; flex-flow: column; padding-top: 140px; padding-bottom: 200px; }
#sub .st01{ font-size: 70px; font-weight: 700; color:#222222; }
#sub .p01{ font-size: 20px; line-height: 1.5em; color:#222222; }
#sub .p02{ font-size: 22px; line-height: 1.5em; color:#222222; word-break: keep-all; }

#sub .s_tit { margin-bottom: 60px; }
#sub .s_tit strong{ font-size: 42px; font-weight: 700; color:#222222;  }

#sub .s_tit2{ display:flex; flex-flow: column; gap: 20px; }
#sub .s_tit2 em{ font-size: 26px; color:#2A71C8; font-weight: 600; }
#sub .s_tit2 ul{ display:flex; flex-flow: column; gap: 12px; padding-left: 15px; }
#sub .s_tit2 ul li{ position: relative; padding-left: 15px; font-size: 20px; line-height: 1.5em; color: #222; }
#sub .s_tit2 ul li:after{ content:""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #C2CADC; position: absolute; left: 0; top: 12px; }

#sub .s_tit2 ul li span{ margin-top: 10px; display: block; position: relative; padding-left: 15px; }
#sub .s_tit2 ul li span i{ display: block; position: absolute; left: 0; top: 0; }



#sub .s_tit3{ display:flex; flex-flow: column; gap: 10px; }
#sub .s_tit3 em{ font-size: 26px; font-weight: 600; color: #2A71C8;display: block; margin-bottom: 8px; }
#sub .s_tit3 p{ line-height: 1.6em; }

/* 나노코어 */
#sub.nanocore .con01 .inner{ display:flex; flex-flow: column; gap: 30px; }  
#sub.nanocore .con01 em{ font-size: 26px; font-weight: 600; color: #222; }
#sub.nanocore .con01 em b{ color:#2A71C8; font-weight: inherit; }
#sub.nanocore .con01 strong{ display: block; padding-bottom: 30px; border-bottom: 1px solid #E4E6E9;  }
#sub.nanocore .con02 .video{ width: 100%; aspect-ratio: 16 / 9; position: relative; }
#sub.nanocore .con02 .video video{ display: block; min-height: auto; min-width: 100vw; width: 100%; object-fit: fill; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); }

#sub.nanocore .con03 .list{ display:flex; gap: 20px; }
#sub.nanocore .con03 .list > div{ width: 33.333333333%; display:flex; gap: 20px; flex-flow: column; }
#sub.nanocore .con03 .list .img img{ display: block;width: 100%; border-radius: 12px;  }
#sub.nanocore .con03 .list .txt{ flex-flow: column; display: flex; gap: 10px; }
#sub.nanocore .con03 .list .txt .name{ padding: 14px 0; text-align: center; border-radius: 8px; background-color: #002553; }
#sub.nanocore .con03 .list .txt .name strong{ font-size: 22px; font-weight: 600; color:#FFFFFF; }
#sub.nanocore .con03 .list .txt > ul{ display:flex; flex-flow: wrap; padding: 30px 40px; gap: 20px 10px; border-radius: 8px; }
#sub.nanocore .con03 .list .txt > ul > li{ padding-left: 12px; position: relative; width: calc(50% - 5px); line-height: 1.5em; font-size: 16px; color:#222222 }
#sub.nanocore .con03 .list .txt > ul > li:after{ content:""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #C2CADC; position: absolute; left: 0; top: 9px; }

#sub.nanocore .con03 .list .txt .t_ul01{ background-color: #F5F8FB;  }
#sub.nanocore .con03 .list .txt .t_ul02{ border: 1px solid #E4E6E9; }

#sub.nanocore .con03 .list .txt .t_ul01 > li{ font-size: 18px; color: #002553; font-weight: 600; line-height: 24px; }

#sub.nanocore .con04{ background-color: #F5F8FB; padding: 80px 0; }
#sub.nanocore .con04 .inner{ display:flex; flex-flow: column; gap: 30px; }
#sub.nanocore .con04 .p_logo{ display:flex; gap: 10px; }
#sub.nanocore .con04 .p_logo ul{ display:flex; gap: 10px; transform: translateX(-50%); animation: logo 50s linear infinite; }
#sub.nanocore .con04 .p_logo ul li img{ display: block; border-radius: 8px; }
#sub.nanocore .con04 .p_logo2 ul{ transform: translateX(-150%); animation: logo2 50s linear infinite; }


/* 비즈니스 공통 */
#sub.business .b_tit{ display:flex; flex-flow: column; gap: 30px; padding-bottom: 80px; border-bottom: 1px solid #DCE2EB; }
#sub.business .b_tit strong{ font-size: 50px; font-weight: 700; }
#sub.business .b_tit em{ font-size: 22px; line-height: 1.5em; word-break: keep-all; color:#222222; }
#sub.business .b_tit ul{ display: flex; flex-flow: column; gap: 12px; padding-left: 15px; margin-top: -12px; }
#sub.business .b_tit ul li{ padding-left: 12px; position: relative; font-size: 20px; line-height: 1.5em; color: #5D6578; }
#sub.business .b_tit ul li:after{ content:""; display: block; width: 4px; height: 4px; background-color: #5D6578; position: absolute; left: 0; top: 13px; border-radius: 50%; }

#sub.business .con03 .s_tit{  margin-bottom: 40px; }

#sub.bs01 .con02{ background-color: #F5F8FB; padding: 140px 0; }
#sub.bs01 .con02 .p_info{ display:flex; flex-flow: column; gap: 140px; margin-top: 140px;  }
#sub.bs01 .con02 .p_info > div{ padding-bottom: 140px; border-bottom: 1px solid #DCE2EB; display:flex; gap: 80px;}
#sub.bs01 .con02 .p_info > div:last-child{ padding-bottom: 0; border-bottom: none; }
#sub.bs01 .con02 .p_info > div .p_con{ width: calc(100% - 420px); }
#sub.bs01 .con02 .p_info > div .p_tit{ width: 340px; }
#sub.bs01 .con02 .p_info > div .p_tit strong{ font-size: 32px; font-weight: 600; color:#222222; line-height: 1.3em; }
#sub.bs01 .con02 .p_info > div .p_tit strong b{ font-size: 0.8em; line-height: 1em; font-weight: 600; }
#sub.bs01 .con02 .p_info .p_con .txt{ display:flex; flex-flow: column; gap: 20px; margin-bottom: 40px; }
#sub.bs01 .con02 .p_info .p_con .txt > dl{ display:flex; gap: 80px; }
#sub.bs01 .con02 .p_info .p_con .txt > dl > dt{ font-size: 24px; font-weight: 600; color:#222222; }
#sub.bs01 .con02 .p_info .p_con .txt > dl > dd { display: flex; align-items: center; gap: 8px; }
#sub.bs01 .con02 .p_info .p_con .txt > dl > dd > span{ display: flex; align-items: center; height: 34px; padding: 0 20px; border-radius: 60px; border: 1px solid #BCC8D4; font-size: 16px; font-weight: 500; color:#676B74; }
#sub.bs01 .con02 .p_info .p_con .txt > dl > dd > span.on{ color: #fff; background-color: #172F5F; border-color:#172F5F; }

#sub.bs01 .con02 .p_info .p_con .img img{ display: block ;width: 100%; }
#sub.bs01 .con02 .p_info .p_con .img .border{ border-radius: 8px; border: 1px solid #DBE3EB; }

#sub.bs01 .con03 .cont{ display:flex; gap: 40px; }
#sub.bs01 .con03 .cont .right img{ display: block; }

#sub.bs02 .con02 .p_info{ margin-top: 0 !important; }
#sub.bs02 .con_w{ padding-bottom: 0; }
#sub.bs02 .con02{ padding-bottom: 200px; }


#sub.bs03 .s_tit2{ padding-bottom: 80px; margin-bottom: 80px; border-bottom: 1px solid #E4E6E9; }
#sub.bs03 .s_tit{ display:flex; flex-flow: column; gap: 20px; margin-bottom: 40px; }
#sub.bs03 .img_b ul{ display:flex; gap: 40px; }
#sub.bs03 .img_b ul li{ width: calc(50% - 20px); }
#sub.bs03 .img_b ul li img{ display: block; width: 100%; }
#sub.bs03 .img_b ul li strong{ display: block; text-align: center; margin-top: 20px; font-size: 20px; font-weight: 600; color:#222222; line-height: 1.5em; }
#sub.bs03 .info_t{ display:flex; flex-flow: column; gap: 30px; margin-bottom: 60px; }
#sub.bs03 .info_t > dl{ display:flex; flex-flow: column; gap: 12px; padding-left: 15px; }
#sub.bs03 .info_t > dl > dt{ font-size: 20px; font-weight: 600; color:#002553; padding-left: 12px; position: relative; }
#sub.bs03 .info_t > dl > dt:after{ content:""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #C2CADC; position: absolute; left: 0; top: 9px; }
#sub.bs03 .info_t > dl > dd > ul { display:flex; flex-flow: column; gap: 4px; padding-left: 15px; }
#sub.bs03 .info_t > dl > dd > ul > li{ font-size: 18px;line-height: 1.5em; color:#5D6578; }

#sub.bs04 .con01 .list{ margin-top: 40px; }
#sub.bs04 .con01 .list ul{ display:flex; gap: 40px; }
#sub.bs04 .con01 .list ul li{ width: 33.3333333%; display:flex; flex-flow: column; gap: 30px; }
#sub.bs04 .con01 .list ul li .img img{ display: block; width: 100%; border-radius: 8px; }
#sub.bs04 .con01 .list ul li .txt{ display:flex; flex-flow: column; gap: 10px; }
#sub.bs04 .con01 .list ul li .txt strong{ font-size: 24px; font-weight: 600; color:#222222; }
#sub.bs04 .con01 .list ul li .txt p{ font-size: 20px; line-height: 1.5em; color:#222222; }

#sub .b_table table{ width: 100%; border-top: 2px solid #222; }
#sub .b_table table th{ height: 60px; text-align: center; vertical-align: middle; border-bottom: 1px solid #DCE2E8; font-size: 17px; font-weight: 600; }
#sub .b_table table th:nth-child(1){ width: 170px; }
#sub .b_table table td{ font-size: 17px; font-weight: 400; color:#222222; height: 60px; vertical-align: middle; text-align: center; border-bottom: 1px solid #dce2e8; }
#sub .b_table table td:nth-child(1){ font-weight: 600; }

#sub .b_table table .aver{ background-color: #F7F8F9; }
#sub .b_table table .aver td{ color: #2A71C8; font-weight: 600; }
#sub .b_table table .imgs td{ height: auto; padding: 10px 0; }
#sub .b_table table .imgs td img{ display: block; width: 100%; }


#sub.solution .so_tit{ margin-bottom: 40px; display:flex; flex-flow: column; gap: 30px; }
#sub.solution .so_tit > .tit{padding-bottom: 20px; border-bottom: 1px solid #DCE2EB; display:flex; align-items: center; gap: 20px; }
#sub.solution .so_tit > .tit > strong{ font-size: 42px; font-weight: 600; color: #222222; }
#sub.solution .so_tit > .tit > i{ width: 42px; height :42px; border-radius: 8px; display: flex; align-items: center; justify-content: center; background-color: #2C7DDF; font-size: 22px; font-weight: 600; color:#FFFFFF; }

#sub.solution .so_tit .box{ display:flex; flex-flow: column; gap: 30px; margin-top: 20px; }
#sub.solution .so_tit .box > strong{ font-size: 24px; font-weight: 700; color:#222222 }
#sub.solution .so_tit .box > ul{ display:flex; flex-flow: column; gap: 12px; padding-left: 15px; margin-top: -12px; }
#sub.solution .so_tit .box > ul > li{ padding-left: 15px; position: relative; line-height: 1.5em; font-size: 20px; color:#5D6578 }
#sub.solution .so_tit .box > ul > li:after{ content:""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #5D6578; position: absolute; left: 0; top: 14px; }

#sub.solution .con04{ background-color: #F5F8FB; padding: 140px 0; }
#sub.solution .con04 .list{ display:flex; gap: 40px; }

#sub.solution .img{ display:flex; flex-flow: column; gap: 20px; }
#sub.solution .img img{ display: block; width: 100%; border-radius: 8px; }
#sub.solution .img2 img{ border: 1px solid #DBE3EB; }


#sub.so01 .con04 .list > div{ width: 33.33333333333%; display:flex; flex-flow: column; gap: 20px; }
#sub.so01 .con04 .list > div .img img{ display: block; width: 100%; border-radius: 8px; }
#sub.so01 .con04 .list > div .txt { display:flex; flex-flow: column; gap: 20px; }
#sub.so01 .con04 .list > div .txt strong{ font-size: 24px; color:#222222; font-weight: 600; }
#sub.so01 .con04 .list > div .txt ul{ display:flex; flex-flow: column; gap: 8px; }
#sub.so01 .con04 .list > div .txt ul > li{ padding-left: 12px; position: relative; line-height: 1.5em; font-size: 20px; color:#5D6578 }
#sub.so01 .con04 .list > div .txt ul > li:after{ content:""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #5D6578; position: absolute; left: 0; top: 14px; }

#sub.so01 .con04 .list > div .txt .ul02{ flex-flow: wrap; gap: 12px; }
#sub.so01 .con04 .list > div .txt .ul02 > li{ width: calc(50% - 6px); }

#sub.so01 .con06{ background-color: #f5f8fb; padding: 140px 0; }


#sub .ba{ display:flex; gap: 40px; }
#sub .ba > div{ width: 50%; display:flex; flex-flow: column; gap: 10px; }
#sub .ba > div .name{ border-radius: 8px; height: 54px; display:flex; text-align: center; align-items: center; justify-content: center;  }
#sub .ba > div .name strong{ font-size: 22px; font-weight: 600; color:#FFFFFF; }
#sub .ba > div:nth-child(1) .name{ background-color: #949CA7; }
#sub .ba > div:nth-child(2) .name{ background-color: #002553; }
#sub .ba > div .img img{ border: 1px solid #DBE3EB; border-radius: 8px; }
#sub .ba > div .txt{ margin-top: 10px; text-align: center;  }
#sub .ba > div .txt p{ font-size: 22px; font-weight: 600; color:#222222; }
#sub .ba > div .txt p b{ font-weight: inherit; color:#172F5F }


#sub.solution .img_box > img{ border-radius: 8px; width: 100%; }
#sub.solution .con01 .inner{ display: flex; flex-flow: column; gap: 50px; }

#sub.solution .con04 .list2 > div{ width: 50%; }

#sub.so01 .con02{ background-color: #fff; padding: 0; }
#sub.so01 .con03{ background-color: #f5f8fb; padding: 140px 0; padding-bottom: 200px; }
#sub.so01 .b_table table .aver{ background-color: #E5EEF7; }

#sub.so01 .con_w{ padding-bottom: 0; }
#sub.so02 .con_w{ padding-bottom: 200px; }
#sub.so03 .con_w{ padding-bottom: 200px; }
#sub.so04 .con_w{ padding-bottom: 200px; }
#sub.so05 .con_w{ padding-bottom: 200px; }

#sub.so03 .con09 .box{ display:flex; gap: 40px; justify-content: flex-start; }
#sub.so03 .con09 .box svg{ width:calc(100% - 390px); height: auto; display: block; }
#sub.so03 .con09 .box img{ width: 350px; display: block; border-radius: 8px; border: 1px solid #DCE2E8; }

#sub.so03 .con09 .so_tit{ gap: 10px; margin-bottom: 30px; }
#sub.so03 .con09 .so_tit > .tit{ padding-bottom: 0; border-bottom: none; }

#sub.so05 .con05 .box{ display:flex; gap: 40px; }


#sub.so05 .con05 .table > strong{ font-size: 24px; font-weight: 600; color: #222222; display: block; margin-bottom: 20px; }

#sub.so05 .con05 .e_list{ margin-top: 100px; display:flex; gap: 40px; }
#sub.so05 .con05 .e_list > dl{ width: 25%; display:flex; flex-flow: column; gap: 16px; border-right: 1px solid #E4E6E9; }
#sub.so05 .con05 .e_list > dl:last-child{ border-right: none; }
#sub.so05 .con05 .e_list > dl > dt{ font-size: 28px; font-weight: 700; color:#222222; }
#sub.so05 .con05 .e_list > dl > dd > ul{ display:flex; flex-flow: column; gap: 8px; }
#sub.so05 .con05 .e_list > dl > dd > ul > li{ font-size: 20px; line-height: 1.6em; color:#5D6578; position: relative; padding-left: 12px; }
#sub.so05 .con05 .e_list > dl > dd > ul > li:after{ content:""; display: block; width: 4px; height :4px; border-radius: 50%; background-color: #5D6578; position: absolute; left: 0; top: 14px; }


/* 게시판 */
#sub.board .n_list{ border-top: 2px solid #dce2e8; margin-top: 40px; padding-top: 10px; }
#sub.board .n_list ul{}
#sub.board .n_list ul li{border-bottom: 1px solid #E3E5E8;}
#sub.board .n_list ul li a{display: flex;;height: 100px;position: relative;align-items: center;padding-left: 40px;transition: 0.5s;}
#sub.board .n_list ul li:hover a{background-color: #002553;border-radius: 8px;}
#sub.board .n_list ul li a .date{position: absolute;right: 40px;}
#sub.board .n_list ul li a .date p{font-size: 18px;color: #BABEC2;transition: 0.5s;}
#sub.board .n_list ul li a:hover .date p{color: #708CAF;}
#sub.board .n_list ul li a .title{display: flex;align-items: center;gap: 20px}
#sub.board .n_list ul li a .title span{display: flex; width: 93px;height: 36px;background-color: #FFFFFF;;border-radius: 22px;align-items: center;justify-content: center;font-size: 16px;color: #002553;font-weight: 600;}
#sub.board .n_list ul li a .title strong{display: block;width: calc(100% - 113px);font-size: 22px;color: #2E2F30;white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;transition: 0.5s;}
#sub.board .n_list ul li:hover a .title strong{color: #fff;}

#sub.board .search{ display:flex; justify-content: flex-end; gap: 20px; height: 60px; position: relative; }
#sub.board .search select{ width: 160px; height: 100%; border: none; border-bottom: 1px solid #DDDDDD; padding: 0 20px; color: #222; font-weight: 400; font-size: 18px; background: url('/img/sub/arrow.png') right 20px center no-repeat;     -webkit-appearance: none;  /* 크롬 화살표 없애기 */
    -moz-appearance: none; /* 파이어폭스 화살표 없애기 */
    appearance: none;  /* 화살표 없애기 */ }
#sub.board .search input{ width: 400px; height: 100%; border: none; border-bottom: 1px solid #ddd; padding: 0 20px; color :#222; font-weight: 400; font-size: 18px; }

#sub.board .search button{ position: absolute; right: 0; top: 0; }

#sub.board .paging{ display:flex; justify-content: center; margin-top: 70px; }
#sub.board .paging ul{ display:flex; gap: 10px; }
#sub.board .paging ul li{ width: 40px; height: 40px; }
#sub.board .paging ul li a{ display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  }
#sub.board .paging ul li.num a{ font-size: 18px; font-weight: 600; color:#999999; }
#sub.board .paging ul li.num.on a{ background-color: #002553; border-radius: 4px; color: #fff; }

#sub.view .v_tt{ display:flex; flex-flow: column; gap: 8px; padding-bottom: 40px; border-bottom: 1px solid #DFE5DC; }
#sub.view .v_tt strong{ font-size: 36px; line-height: 1.5em; color:#2B2B2B; font-weight: 600; }
#sub.view .v_tt p{ font-size: 18px; color:#4E4E4E; }
#sub.view .v_con{ padding: 40px 0; min-height: 500px; border-bottom: 1px solid #DFE5DC; margin-bottom: 60px; }
#sub.view .v_con img{ max-width: 100%; }
#sub.view .file_w{margin-top: -61px;margin-bottom: 60px}
#sub.view .file_w a{display: flex;align-items: center;gap: 16px;font-size: 18px;color: #172F5F;padding: 34px 0;border-top: 1px solid #DFE5DC;border-bottom: 1px solid #DFE5DC}
#sub.view .file_w a i svg{display: block}

#sub .back_link{ display:flex; justify-content: flex-end; }
#sub .back_link a{display: flex;align-items: center;gap: 12px;color: #2A71C8;font-size: 20px;font-weight: 600;transition: 0.5s;}
#sub .back_link a svg{display: block;}

#sub .back_link a .icon{display: block;width: 42px;height: 42px;border-radius: 8px;background-color: #2C7DDF;overflow: hidden;;}
#sub .back_link a .icon > div{width: 200%;height: 100%;transition: 0.5s;display: flex;transform: translateX(0%);}
#sub .back_link a:hover .icon > div{transform: translateX(-50%);}
#sub .back_link a .icon > div i{display: flex;height: 100%;width: 50%;align-items: center;justify-content: center;transition: 0.5s;}
#sub .back_link a:hover .icon > div i{background-color: #002553;}
#sub .back_link a:hover {color: #002553;transition-delay: 0s;}

#sub.ncp .con_w{ padding-bottom: 0; }

#sub.ncp .con10{ background: url('/img/ko/ncp_bg01.jpg') center center no-repeat; background-size: cover; background-attachment: fixed; height: 580px; display:flex; align-items: center; justify-content: center; }
#sub.ncp .con10 .txt strong{ display: block; text-align: center; font-size: 32px; line-height: 1.5em; color:#FFFFFF; font-weight: 400; }
#sub.ncp .con10 .txt strong b{ font-weight: 600; }

#sub.ncp .con02 .list{ display:flex; flex-flow: wrap; gap: 80px 160px; }
#sub.ncp .con02 .list > dl{ width: calc(50% - 80px); display:flex; gap: 30px; }
#sub.ncp .con02 .list > dl > dt{ width: 140px; display:flex; align-items: center; height: 180px; border-radius: 20px; background-color: #2A71C8; justify-content: center; flex-flow: column;gap: 20px; }
#sub.ncp .con02 .list > dl > dt svg{ overflow: visible; }
#sub.ncp .con02 .list > dl > dt > strong{ font-size: 24px; font-weight: 700; color:#FFFFFF; text-align: center; }
#sub.ncp .con02 .list > dl > dt > strong .br{ display: block; }
#sub.ncp .con02 .list > dl > dd{ padding-top: 20px; display:flex; flex-flow: column; gap: 30px; width: calc(100% - 170px); }
#sub.ncp .con02 .list > dl > dd > div{ display:flex; flex-flow: column; gap: 11px; }
#sub.ncp .con02 .list > dl > dd > div > strong{ font-size: 20px; font-weight: 600; color:#222222; }
#sub.ncp .con02 .list > dl > dd > div > ul{ display:flex; flex-flow: column; gap: 10px;} 
#sub.ncp .con02 .list > dl > dd > div > ul > li{ padding-left: 12px; position: relative; font-size: 18px; line-height: 1.6em; color:#5D6578; }
#sub.ncp .con02 .list > dl > dd > div > ul > li:after{ content:""; display: block; width: 4px; height :4px; border-radius: 50%; background-color: #C2CADC; position: absolute; left: 0; top: 11px; }

#sub.ncp .con03{ background-color: #F5F8FB; padding: 140px 0; }
#sub.ncp .con03 .inner{ display:flex; flex-flow: column; gap: 140px; }
#sub.ncp .con03 .b_list > ul{ display:flex; flex-flow: column; gap: 10px; }
#sub.ncp .con03 .b_list > ul > li > a{ display:flex; align-items: center; padding: 0 40px; justify-content: space-between; height: 100px; background-color: #fff; transition: background .5s; border-radius: 8px; }
#sub.ncp .con03 .b_list > ul > li > a > strong{ font-size: 22px; font-weight: 600; color:#2E2F30; transition: color .5s; }

#sub.ncp .con03 .b_list > ul > li > a .icon{display: block;width: 42px;height: 42px;border-radius: 8px;background-color: #2C7DDF;overflow: hidden;;}
#sub.ncp .con03 .b_list > ul > li > a .icon > div{width: 200%;height: 100%;transition: 0.5s;display: flex;transform: translateX(-50%);}
#sub.ncp .con03 .b_list > ul > li > a:hover .icon > div{transform: translateX(0%);}
#sub.ncp .con03 .b_list > ul > li > a .icon > div i{display: flex;height: 100%;width: 50%;align-items: center;justify-content: center;transition: 0.5s;}
#sub.ncp .con03 .b_list > ul > li > a:hover{ background-color: #002553; }
#sub.ncp .con03 .b_list > ul > li > a:hover strong{ color: #fff; }

#sub.history .s_tit3{ padding-bottom: 20px; border-bottom: 1px solid #E4E6E9; position: relative; display: flex; align-items: center; justify-content: space-between; flex-flow: row; }
#sub.history .s_tit3 .control{ display:flex; gap: 8px; }
#sub.history .s_tit3 .control > div{ position: static !important; margin: 0 !important; width: 42px; height :42px; border-radius: 8px; transition: background .3s; }
#sub.history .s_tit3 .control > div:hover{ background-color: #2C7DDF; }
#sub.history .s_tit3 .control > div:hover svg path{ stroke: #fff; }
#sub.history .s_tit3 .control > div:after{ display: none; }




#sub.history .h_slide{ overflow: hidden; margin-top: 40px; }
#sub.history .h_slide .box > strong{ font-size: 40px; font-weight: 700; color:#222222; display: block; }
#sub.history .h_slide .box > em{ font-size: 26px; line-height: 1.3em; font-weight: 600; color:#2A71C8; }
#sub.history .h_slide .box  > ul{ display:flex; flex-flow: column; gap: 20px; }
#sub.history .h_slide .box  > ul > li{ position: relative; font-size: 20px; line-height: 1.5em; color:#5D6578; padding-left: 12px; }
#sub.history .h_slide .box  > ul > li:after{ content:""; display: block; width: 4px; height :4px; border-radius: 50%; background-color: #5D6578; position: absolute; left: 0; top: 12px; }
#sub.history .h_slide .box{ display:flex; flex-flow: column; gap: 25px; padding :35px; padding-right: 20px; position: relative; transition: background .4s; border-radius: 12px; }
#sub.history .h_slide .box:after{ content:""; display: block; width: 1px; height: calc(100% - 130px); position: absolute; right: 0; top: 50%; transform: translate(0,-50%); background-color: #E4E6E9; transition: opacity .4s; }

#sub.history .h_slide .box:hover{ background-color: #2A71C8; }
#sub.history .h_slide .box:hover:after{ opacity: 0; }

#sub.history .h_slide .box:hover > strong{ color: #fff; }
#sub.history .h_slide .box:hover > em{ color: #fff; }
#sub.history .h_slide .box:hover > ul > li{ color: #D5E1FE; }
#sub.history .h_slide .box:hover > ul > li:after{ background: #D5E1FE; }


#sub.contact .con01 .s_tit3{ padding-bottom: 30px; margin-bottom: 40px; border-bottom: 1px solid #E4E6E9; }
#sub.contact .con01 .box{ display:flex; gap: 30px; }
#sub.contact .con01 .box .tab{ width: 390px; }
#sub.contact .con01 .box .tab ul{ display:flex; flex-flow: column; gap: 8px; }
#sub.contact .con01 .box .tab ul li a{ height: 80px; display:flex; align-items: center; justify-content: space-between; border-radius: 8px; border: 1px solid #DFE1E6; padding: 0 30px; transition: border-color .3s; }
#sub.contact .con01 .box .tab ul li a:hover{ border-color: #2a71c8; }
#sub.contact .con01 .box .tab ul li a > strong{ font-size: 20px; font-weight: 600; color:#5D6578; }
#sub.contact .con01 .box .tab ul li a > strong b{font-weight: 600; }
#sub.contact .con01 .box .tab ul li a svg{ opacity: 0; }
#sub.contact .con01 .box .tab ul li.on a svg{ opacity: 1; }
#sub.contact .con01 .box .tab ul li.on a{ background-color: #2A71C8; border-color:#2A71C8; }

#sub.contact .con01 .box .tab ul li.on a > strong{ color: #fff; }
#sub.contact .con01 .right{ width: calc(100% - 420px); }
#sub.contact .con01 .right .map_boxs{ width: 100%; height: 540px; border-radius: 12px; overflow: hidden;}
#sub.contact .con01 .right .map_boxs .wrap_map{ height: 100%; width: 100%; }
#sub.contact .con01 .right .map_boxs .root_daum_roughmap{ height: 100%; width: 100%; }

#sub.contact .con01 .right .map_boxs .root_daum_roughmap .map_border{ display: none; }
#sub.contact .con01 .right .info{ display:flex; justify-content: space-between; margin-top: 30px; }
#sub.contact .con01 .right .info dl{ display:flex; flex-flow: column; gap: 12px; }
#sub.contact .con01 .right .info dl dt{ font-size: 18px; font-weight: 700; color:#2A71C8; }
#sub.contact .con01 .right .info dl dd{ font-size: 20px; font-weight: 400; color:#5D6578; line-height: 1.5em; }
#sub.contact .con01 .right .info .info_r{ display: flex; gap: 100px; }

#sub.brochure .s_tit2{ gap: 10px; margin-bottom: 60px; }
#sub.brochure .list{ display:flex; gap: 40px; }
#sub.brochure .list > div{ width: 50%; }
#sub.brochure .list > div .img img{ display: block; width: 100%; }
#sub.brochure .link_w{ display:flex; justify-content: center; padding-top: 25px; border-top: 1px solid #E6E6E6; }


#sub .link_w a{display: flex;align-items: center;gap: 12px;color: #2A71C8;font-size: 20px;font-weight: 600;margin-top: 40px;transition: 0.5s;}
#sub .link_w a .icon{display: block;width: 42px;height: 42px;border-radius: 8px;background-color: #2C7DDF;overflow: hidden;;}
#sub .link_w a .icon > div{width: 200%;height: 100%;transition: 0.5s;display: flex;transform: translateX(-50%);}
#sub .link_w a:hover .icon > div{transform: translateX(0%);}
#sub .link_w a .icon > div i{display: flex;height: 100%;width: 50%;align-items: center;justify-content: center;transition: 0.5s;}
#sub .link_w a:hover .icon > div i{background-color: #002553;}
#sub .link_w a:hover {color: #002553;transition-delay: 0s;}

#sub .link_w a .icon > div{width: 100%;height: 200%;flex-direction: column;transform: translateY(-50%);}
#sub .link_w a:hover .icon > div{transform: translateY(0);}
#sub .link_w a .icon > div > i{width: 100%;height: 100%;}









#sub .sub_visual .v_img img{ transform: translate(-50%, -50%) scale(1.15); transition: transform 3s; }
#sub .sub_visual.on .v_img img{ transform: translate(-50%, -50%) scale(1); }

#sub .sub_visual .v_tit strong{ display: block; transform: translateX(40px); opacity: 0; transition: transform 1.2s, opacity 1.2s; }
#sub .sub_visual.on .v_tit strong{ transform: translateX(0); opacity: 1;  }



#sub .con01{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con01.on{ transform: translateY(0); opacity: 1;  }

#sub .con02{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con02.on{ transform: translateY(0); opacity: 1;  }

#sub .con03{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con03.on{ transform: translateY(0); opacity: 1;  }

#sub .con04{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con04.on{ transform: translateY(0); opacity: 1;  }

#sub .con05{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con05.on{ transform: translateY(0); opacity: 1;  }

#sub .con06{ transform: translateY(40px); opacity: 0; transition: transform 1s, opacity 1s; }
#sub .con06.on{ transform: translateY(0); opacity: 1;  }


#sub.nanocore .con02{ transform: translate(0); opacity: 1; }

@keyframes logo{
	0%{
		transform: translateX(-50%)
	}
	100%{
		transform: translateX(-150%)
	}
}


@keyframes logo2{
	0%{
		transform: translateX(-150%)
	}
	100%{
		transform: translateX(-50%)
	}
}

.brs{ display: block; }


@media (max-width: 1620px) {
	#sub .sub_tab .inner{ padding: 0; }
	#sub.nanocore .con03 .list .txt .t_ul01{ height: 220px; flex-flow: column; }
	#sub.nanocore .con03 .list .txt .t_ul01 > li{ width: 100%; }
}



@media (max-width: 1420px) {
	#sub .sub_visual .v_tit strong{ font-size: 50px; }
	#sub .sub_visual{ height: 580px; }
	#sub .sub_visual .v_img img{ height: 100%; }
	#sub .st01{ font-size: 50px; }
	#sub.nanocore .con01 .inner{ gap: 20px; }
	#sub.nanocore .con01 em{ font-size: 22px; }
	#sub .p01{ font-size: 17px; }
	#sub .con_w{ gap: 100px; padding-top: 120px; padding-bottom: 140px; }
	#sub.ncp .con03{ padding: 100px 0; }
	#sub.ncp .con03 .inner{ gap: 100px; }
	#sub.bs01 .con02 .p_info{ gap: 100px; margin-top: 100px; }
	#sub .sub_tab{ height: 64px; }
	#sub .sub_tab .home{ width: 64px; }
	#sub .sub_tab .loc button{ padding: 0 20px; font-size: 16px; }
	#sub .sub_tab .loc button svg{ width:10px; height: auto; }
	#sub .sub_tab .loc .loc_ul{ padding: 20px; }
	#sub .sub_tab .loc .loc_ul li{ margin-bottom: 12px; }
	#sub .s_tit{ margin-bottom: 30px; }
	#sub .s_tit strong{ font-size: 30px; }
	#sub.nanocore .con03 .list .txt > ul{ padding: 25px; gap: 10px; }
	#sub.nanocore .con03 .list .txt .t_ul01 > li{ font-size: 16px; }
	#sub.nanocore .con03 .list .txt .name strong{ font-size: 18px; }
	
	#sub .s_tit3 em{ font-size: 22px; }
	#sub .p02{ font-size: 20px; }
	#sub .s_tit2 ul li{font-size: 17px; }
	#sub .s_tit2 ul li:after{ top: 10px; }
	#sub.business .b_tit strong{ font-size: 32px; }
	#sub.business .b_tit em{ font-size: 18px; }
	
	#sub.ncp .con10 .txt strong{ font-size: 26px; }
	#sub.ncp .con02 .list{ gap: 80px; }
	#sub.business .b_tit ul li{ font-size: 18px; }
	#sub.business .b_tit{ gap: 12px; padding-bottom: 50px; }
	#sub.ncp .con02 .list > dl{ width: calc(50% - 40px); }
	]#sub.business .b_tit ul{ gap: 8px; }
	#sub.ncp .con02 .list > dl > dd > div > ul > li br{ display: none; }
	
	*{
		word-break: keep-all;
	}
    
	#sub.contact .con01 .box{ gap: 20px; }
	#sub.contact .con01 .box .tab ul li a{ height: 60px; padding: 0 20px; }
	#sub.contact .con01 .box .tab ul li a > strong{ font-size: 17px; }
	#sub.contact .con01 .box .tab{ width: 290px; }
	#sub.contact .con01 .right{ width: calc(100% - 310px); }
	#sub.contact .con01 .right .map_boxs{ height: 400px; }
	#sub.contact .con01 .right .info dl{ gap: 6px; }
	
	#sub.bs01 .con02 .p_info > div .p_tit{ width: 250px; }
	#sub.bs01 .con02 .p_info > div .p_tit strong{ font-size: 25px; }
	#sub.bs01 .con02 .p_info > div{ gap :40px; }
	#sub.bs01 .con02 .p_info > div .p_con{ width: calc(100% - 290px); }
	#sub.bs01 .con02 .p_info .p_con .txt{ gap: 10px; margin-bottom: 20px; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl > dd > span{ height: 32px; padding: 0 12px; font-size: 14px; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl > dt{ font-size: 20px; line-height: 32px; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl{ gap: 30px; } 
	
	#sub.solution .con04{ padding: 100px 0; }
	#sub.so01 .con06{ padding: 100px 0; }
	#sub.so01 .con03{ padding: 100px 0; }
	
	#sub.so02 .con_w{ padding-bottom: 100px; }
	#sub.so03 .con_w{ padding-bottom: 100px; }
#sub.so04 .con_w{ padding-bottom: 100px; }
#sub.so05 .con_w{ padding-bottom: 100px; }
	
	#sub.so05 .con05 .table { width: 60%; }
	#sub.so05 .con05 .table svg{ width: 100%; height: auto; }
	#sub.so05 .con05 .img{ width: 40%; }
	
	#sub.nanocore .con03 .list .txt .t_ul01{ height: 180px; }
	
	#sub.contact .con01 .right .info .info_r{ flex-flow: column; gap: 20px; }
	#sub.contact .con01 .right .info{ flex-flow: column; gap: 20px; }

	#sub.business .b_tit ul{ margin-top: 0; }
	#sub.solution .so_tit .box > ul{ margin-top: 0; }
}


@media (max-width: 1080px) {
    #sub.view .file_w{margin-top: -41px}
	#sub.nanocore .con03 .list .txt > ul{ padding: 20px; flex-flow: column; }
	#sub.nanocore .con03 .list .txt > ul > li{ width: 100%; }
	#sub.nanocore .con04 .p_logo ul li img{ width:  160px; height: auto; }
	#sub.nanocore .con04 .inner{ gap: 10px; }
	#sub.contact .con01 .right .info dl dd{ font-size: 16px; }
	#sub.contact .con01 .right .info dl dt{ font-size: 16px; }
	#sub.contact .con01 .right .info .info_r{ gap: 40px; }
	#sub.bs01 .con03 .cont { gap: 20px; }
	#sub.bs01 .con03 .cont .right{ width: 200px; }
	#sub.bs01 .con03 .cont .right img{ width: 100%; }
	#sub.bs01 .con03 .cont .b_table{ width: calc(100% - 220px); }
	#sub .b_table table th{ height: 40px; font-size: 14px; }
	#sub .b_table table td{ font-size: 14px; height: 40px; }
	#sub.business .con03 .s_tit{ margin-bottom: 20px; }
	#sub.bs04 .con01 .list ul{ gap: 30px; }
	#sub.bs04 .con01 .list ul li{ gap: 20px; }
	#sub.bs04 .con01 .list ul li .txt strong{ font-size: 18px; }
	#sub.bs04 .con01 .list ul li .txt p{ font-size: 16px; }
	#sub.bs04 .con01 .list ul li .txt p br{ display: none; }
	#sub.solution .con04 .list{ gap: 20px; }
	#sub.so01 .con04 .list > div .txt{ gap: 8px; }
	#sub.so01 .con04 .list > div .txt strong{ font-size: 18px; }
	#sub.so01 .con04 .list > div .txt ul > li{ padding-left: 10px; font-size: 14px; }
	#sub.so01 .con04 .list > div .txt ul > li:after{ top: 8px; }
	#sub.so01 .con04 .list > div .txt ul{ gap: 5px; }
	#sub.so01 .con04 .list > div{ gap: 12px; }
	#sub.solution .so_tit > .tit{ gap: 8px; }
	#sub.solution .so_tit > .tit > strong{ font-size: 24px;  }
	#sub.solution .so_tit > .tit > i{ width: 30px; height: 30px; font-size: 14px; }
	#sub.solution .so_tit{ margin-bottom: 20px; gap: 12px; }
	#sub.so03 .con09 .box img{ width: 200px; }
	#sub.so03 .con09 .box{ gap: 20px; }
	#sub.so03 .con09 .box svg{ width: calc(100% - 220px);  }
	
	#sub.so05 .con05 .e_list > dl > dt{ font-size: 18px; }
	#sub.so05 .con05 .e_list > dl > dd > ul > li{ font-size: 16px; }
	#sub.so05 .con05 .e_list > dl > dd > ul > li:after{ top: 10px; }
	#sub.so05 .con05 .e_list{ gap: 40px 20px; flex-flow: wrap; }
	#sub.so05 .con05 .e_list > dl{ width: calc(50% - 10px); }
	#sub.so05 .con05 .e_list > dl:nth-child(2n+0){ border-right: none; }
	#sub.so05 .con05 .e_list{ margin-top: 50px; }
	#sub.board .search{ margin-top: 30px; height: 48px; gap: 10px;}
	#sub.board .search select{ width: 120px; font-size: 16px; padding: 0 15px; background-size: 10px auto;  background-position: right 15px center; }
	#sub.board .search input{ width: 280px; padding: 0 15px; font-size: 16px; }
	#sub.board .search button svg{ width: 48px; height: auto; }
	#sub.board .n_list ul li a{padding-left: 20px;}
    #sub.board .n_list ul li a .date{right: 20px;}
    #sub.board .n_list ul li a{height: 60px;}
    #sub.board .n_list ul li a .title strong{font-size: 15px;}
    #sub.board .n_list ul li a .title span{font-size: 14px;width: 63px;height: 26px;;}
    #sub.board .n_list ul li a .title{width: 100%;}
    #sub.board .n_list ul li a .date p{font-size: 13px;;}
    #sub.board .n_list ul{margin-top: 0;  }
	#sub.board .n_list{ padding-top: 0; }
	#sub.view .v_tt p{ font-size: 16px; }
	#sub.view .v_tt strong{ font-size: 24px; }
	#sub.view .v_con{ padding: 20px 0; margin-bottom: 40px; }
	#sub.view .v_tt{ padding-bottom: 20px; gap: 6px; }
	#sub .back_link a > i > svg{width: 32px;height: auto; }
    #sub .back_link a{font-size: 14px;gap: 7px;margin-top: 0;}
	#sub .back_link a .icon{ width: 32px; height: 32px; border-radius: 6px; }
	#sub .back_link a .icon svg{ width: 10px; height: auto; }
	
	#sub.ncp .con02 .list{ flex-flow: column; gap: 30px; }
	#sub.ncp .con02 .list > dl{ width: 100%; gap: 20px; }

	#sub.bs01 .con02 .p_info > div{ padding-bottom: 60px; flex-flow: column;  gap: 20px; }
	#sub.bs01 .con02 .p_info > div .p_tit{ width: 100%; }
	#sub.bs01 .con02 .p_info > div .p_con{ width: 100%; }
	#sub.contact .con01 .right .info dl dd br{ display: none; }
    #sub.view .file_w a{padding: 15px 0;font-size: 13px}
    #sub.view .file_w a svg{width: 20px;height: auto}
}

@media (max-width: 800px) {
	#sub .sub_visual .v_tit strong{ font-size: 32px; }
	#sub .sub_visual .v_tit{ bottom: 40px; }
	#sub .sub_tab .loc{ width: calc(50% - 25px); }
	#sub .sub_tab{ height: 50px; }
	#sub .sub_tab .home{ width: 50px; }
	#sub .sub_tab .home svg{ width: 14px; height: auto; }
	#sub .sub_tab .loc button{ font-size: 14px; }
	#sub .sub_tab .loc .loc_ul li a{ font-size: 14px; }
	#sub .con_w{ gap: 60px; padding-top: 70px; padding-bottom: 70px; }
	#sub .st01{ font-size: 26px; }
	#sub.nanocore .con01 strong{ padding-bottom: 12px; }
	#sub.nanocore .con01 em{ font-size: 18px; }
	#sub .p01{ font-size: 15px; }
	#sub.nanocore .con01 .inner{ gap: 12px; }
	#sub .s_tit strong{ font-size: 22px; }
	#sub .s_tit{ margin-bottom: 16px; }
	#sub.nanocore .con03 .list{ flex-flow: column; }
	#sub.nanocore .con03 .list > div{ width: 100%; }
	#sub.nanocore .con03 .list > div{ gap: 10px; }
	#sub.nanocore .con03 .list .txt > ul{ gap: 6px; }
	#sub.nanocore .con03 .list .txt > ul > li{ font-size: 14px; }
	#sub.nanocore .con03 .list .txt .t_ul01 > li{ font-size: 14px; line-height: 21px; }
	#sub.nanocore .con04{ padding: 60px 0; }
	#sub.nanocore .con04 .p_logo ul li img{ width: 100px; }
	#sub .sub_visual{ height:380px; }
	#sub .s_tit3 em{ font-size: 18px; margin-bottom: 0; }
	#sub .p02{ font-size: 15px; }
	#sub .s_tit2 ul li{ font-size: 15px; }
	#sub .s_tit2 ul li:after{top: 8px; }
	#sub.ncp .con10 .txt strong{ font-size: 20px; }
	#sub.ncp .con10 .txt strong br{ display: none; }
	#sub.ncp .con10{ height: 300px; }
	#sub.ncp .con02 .list > dl > dt{ width: 100px; height: 120px; gap: 8px; }
	#sub.ncp .con02 .list > dl > dt > strong{ font-size: 16px; }
	#sub.ncp .con02 .list > dl > dt svg{ width: 28px; height: auto; }
	#sub.ncp .con02 .list > dl > dd{ width: calc(100% - 120px); }
	#sub.ncp .con02 .list > dl > dd > div{ gap: 6px; }
	#sub.ncp .con02 .list > dl > dd{ gap: 12px; padding-top: 10px; }
	#sub.ncp .con02 .list > dl > dd > div > strong{ font-size: 16px; }
	#sub.ncp .con02 .list > dl > dd > div > ul > li{ font-size: 14px; padding-left: 10px; }
	#sub.ncp .con02 .list > dl > dd > div > ul > li:after{ top: 9px; }
	
		#sub.ncp .con03{ padding: 60px 0; }
	#sub.ncp .con03 .inner{ gap: 60px; }
	
	#sub.ncp .con03 .b_list > ul > li > a{padding: 0 20px;height: 60px; }
	#sub.ncp .con03 .b_list > ul > li > a > strong{ font-size: 16px; }
	
	#sub.ncp .con03 .b_list > ul > li > a .icon{ width: 32px; height: 32px; }
	#sub.ncp .con03 .b_list > ul > li > a .icon > div i svg{ width: 12px; height: auto; }
	
	#sub.history .h_slide .box > strong{ font-size: 20px; }
	#sub.history .h_slide .box > em{ font-size: 18px; }
	#sub.history .h_slide .box{ gap: 12px; padding: 22px; }
	#sub.history .h_slide .box > ul > li{ font-size: 14px; padding-left: 10px; }
	#sub.history .h_slide .box > ul > li:after{ top: 8px; }
	#sub.history .h_slide .box > ul{ gap: 8px; }
	#sub.history .h_slide{ margin-top: 20px; }
	#sub.history .s_tit3 .control > div{ width :32px; height: 32px; }
	#sub.contact .con01 .box{ flex-flow: column; }
	#sub.contact .con01 .box .tab{ width: 100%; }
	#sub.contact .con01 .right{ width: 100%; }
	#sub.contact .con01 .box .tab ul{ flex-flow: row; }
	#sub.contact .con01 .box .tab ul > li{ width: 50%; }
	#sub.contact .con01 .box .tab ul li a > strong{ font-size: 15px; }
	#sub.contact .con01 .box .tab ul li a svg{ display: none; }
	#sub.contact .con01 .right .map_boxs{ height: 280px; }
	#sub.contact .con01 .right .info{margin-top: 20px; flex-flow: column; gap: 20px; }
	#sub.contact .con01 .right .info dl dd{ font-size: 15px; }
	#sub.contact .con01 .right .info dl dt{ font-size: 15px; }
	#sub.contact .con01 .s_tit3{ padding-bottom: 20px; margin-bottom: 20px; }
	#sub.bs01 .con02 .p_info{ gap: 60px; margin-top: 60px; }
	#sub.bs01 .con02 .p_info > div{ padding-bottom: 60px; flex-flow: column;  gap: 20px; }
	#sub.bs01 .con02 .p_info > div .p_tit{ width: 100%; }
	#sub.bs01 .con02 .p_info > div .p_tit > strong > br{ display: none; }
	#sub.bs01 .con02{ padding: 60px 0; }
	#sub.business .b_tit strong{ font-size: 20px; }
	#sub.business .b_tit em{ font-size: 15px; }
	#sub.business .b_tit ul li{ font-size: 14px; padding-left: 9px; }
	#sub.business .b_tit ul li:after{ top: 9px; }
	#sub.business .b_tit ul{ gap: 6px; }
	#sub.business .b_tit{ padding-bottom: 40px; }
	#sub.bs01 .con02 .p_info{ margin-top: 40px; }
	#sub.bs01 .con02 .p_info > div{ gap: 8px; }
	#sub.bs01 .con02 .p_info > div .p_tit strong{ font-size: 20px; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl{ gap: 8px; flex-flow: column; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl > dd{ flex-flow: wrap; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl > dt{ font-size: 16px; line-height: 1em; }
	#sub.bs01 .con02 .p_info .p_con .txt > dl > dd > span{ height: 28px; font-size: 12px; }
	#sub.bs01 .con02 .p_info > div .p_tit strong br{ display: none; }
	#sub .ba{ gap: 12px; }
	#sub .ba > div .name{ height: 38px; }
	#sub .ba > div .name strong{ font-size: 16px; }
	#sub .ba > div .txt p{ font-size: 14px; }
	#sub.bs01 .con02 .p_info > div .p_tit strong b{ display: block; margin-top: 3px; }
	#sub .ba > div .txt{ margin-top: 0; margin-bottom: 0; }
	#sub.bs03 .img_b ul{ flex-flow: column; gap: 20px; }
	#sub.bs03 .img_b ul li{ width: 100%; }
	#sub.bs03 .s_tit2{ padding-bottom: 20px; margin-bottom: 30px; }
	#sub.bs03 .s_tit{ gap: 8px; margin-bottom: 20px; }
	#sub.bs03 .info_t > dl > dt{ font-size: 16px; }
	#sub.bs03 .info_t > dl > dd > ul > li{ font-size: 14px; }
	#sub.bs03 .info_t > dl{ gap: 10px; }
	#sub.bs03 .info_t{ gap: 20px; margin-bottom: 30px; }
	#sub.bs03 .img_b ul li strong{ font-size: 14px; margin-top: 10px;  }

	#sub.bs04 .con01 .list{ margin-top: 20px; }
	#sub.bs04 .con01 .list ul{ flex-flow: column; }
	#sub.bs04 .con01 .list ul li{ width: 100%; }
	
	#sub.bs04 .con01 .list ul li .txt strong{ font-size: 16px; }
	#sub.bs04 .con01 .list ul li .txt p{ font-size: 14px; }
	
	#sub.bs04 .con01 .list ul li .txt{ gap: 8px; }
	#sub.so01 .con06{ padding: 60px 0; }
	#sub.so01 .con02{ padding: 0; }
	#sub.solution .so_tit .box > ul > li{ font-size: 14px; padding-left: 15px; }
	#sub.solution .so_tit .box > ul > li:after{ top: 9px; }
	#sub.solution .so_tit .box > ul{ gap: 8px; }
	#sub.solution .so_tit .box{ gap: 12px; }
	#sub.so01 .con03{ padding: 60px 0; }
	
	#sub.solution .so_tit .box > strong{ font-size: 18px; }
	#sub .p02{ font-size: 14px; }
	#sub .s_tit2 ul li{ font-size: 14px; }
	#sub.solution .con04{ padding: 60px 0; }
	#sub.solution .con04 .list{ flex-flow: column; }
	#sub.solution .con04 .list > div{ width: 100%; }
	#sub.so01 .con04 .list > div .txt strong{ font-size: 16px; }
	#sub.solution .so_tit > .tit > strong{ font-size: 18px; }
	#sub .ba{ flex-flow: column; }
	#sub .ba > div{ width: 100%; }
	#sub .s_tit2 em{ font-size: 18px; }
	#sub .s_tit2 { gap: 8px; }
	#sub.so01 .con04 .list > div .txt .ul02{ gap: 4px; }
	#sub.so03 .con09 .box{ flex-flow: column; }
	#sub.so03 .con09 .box svg{ width: 100%; }
	#sub.so03 .con09 .box img{ width: 50%; margin: 0 auto; }
	#sub.so03 .con09 .so_tit{ gap: 4px; margin-bottom: 12px; }
	#sub.solution .con01 .inner{ gap: 20px; }
	
	#sub.so02 .con_w{ padding-bottom: 60px; }
		#sub.so03 .con_w{ padding-bottom: 60px; }
#sub.so04 .con_w{ padding-bottom: 60px; }
#sub.so05 .con_w{ padding-bottom: 60px; }
	
	#sub.so05 .con05 .box{ flex-flow: column; gap: 20px; }
	#sub.so05 .con05 .box .img{ width: 100%; }
	#sub.so05 .con05 .box .table{ width: 100%; }
	#sub.so05 .con05 .table > strong{ font-size: 18px; margin-bottom: 10px; }
	#sub.so05 .con05 .e_list > dl > dd > ul > li{ font-size: 14px; }
	#sub.so05 .con05 .e_list > dl > dd > ul{ gap: 5px; }
	#sub.so05 .con05 .e_list > dl{ gap: 8px; }
	
	#sub.nanocore .con03 .list .txt .t_ul01{ height: auto; }
	
	#sub .s_tit2 ul li span{ margin-top: 4px; }
	
	#sub.brochure .list{ gap: 20px; flex-flow: column; }
	#sub.brochure .list > div{ width: 100%; }
	#sub.brochure .link_w a{ margin-top: 0; }
	#sub .link_w a{ gap: 8px; font-size: 14px; }
	#sub .link_w a .icon{ width: 34px; height: 34px; border-radius: 5px; }
	#sub.brochure .link_w{padding-top: 16px; }
	#sub.brochure .s_tit2{ margin-bottom: 20px; }
}


@media (max-width: 640px) {
    #sub.view .file_w{margin-top: -21px}
	#sub .sub_visual .v_tit strong{ font-size: 32px; }
	#sub.ncp .con10 .txt strong{ font-size: 16px; }
	#sub.contact .con01 .box .tab ul li a{ height: 48px; padding: 0 15px; }
	#sub.contact .con01 .box .tab ul li a > strong{ font-size: 14px; }
	#sub .b_table table th{ font-size: 12px; }
	#sub .b_table table td{ font-size: 13px; }
	#sub.bs01 .con03 .cont{ flex-flow: column; }
	#sub.bs01 .con03 .cont .b_table{ width: 100%; }
	#sub.bs01 .con03 .cont .right{ width: 50%; margin: 0 auto; }
	#sub .s_tit strong{ font-size: 18px; }
	#sub .b_table table th:nth-child(1){ width: 80px; }
	#sub.bs01 .con02 .p_info{ gap: 40px; }
	#sub.bs01 .con02 .p_info > div{ padding-bottom: 40px; }
	#sub .con_w{ padding-top: 50px; }
	#sub.so05 .con05 .e_list{ flex-flow: column; gap: 20px; }
	#sub.so05 .con05 .e_list > dl{width: 100%; padding-bottom: 20px; border-right: none; border-bottom: 1px solid #ddd; }
	#sub.so05 .con05 .e_list > dl:last-child{ border-bottom: none; }
	
	#sub.board .n_list ul li a .title span{font-size: 12px;}
    #sub.board .n_list ul li a .title{gap: 7px}
    #sub.board .n_list ul li a .date p{font-size: 12px;}
    #sub.board .n_list ul li a{padding-right: 80px;height: 45px;;}
    #sub.board .n_list ul li a .title strong{font-size: 13px;width: calc(100% - 73px);}
    #sub.board .n_list ul li a{padding-left: 10px;}
    #sub.board .n_list ul li a .date{right: 10px;}
	#sub.board .search{ height: 40px; }
	#sub.board .search select{ font-size: 14px; width: 90px; padding: 0 12px; }
	#sub.board .search input{ width: calc(100% - 100px); font-size: 14px; padding: 0 12px; }
	#sub.board .search button svg{ width: 40px; }
	#sub.board .search{ margin-top: 20px; }
	#sub.board .n_list{ margin-top: 20px; }
	#sub.board .paging{ margin-top: 30px; }
	#sub.board .paging ul li.num a{ font-size: 13px; }
	#sub.board .paging ul li{ width: 30px; height: 30px; }
	#sub.board .paging ul li a svg{ width: 100%; height: auto; }
	#sub.board .paging ul{ gap: 5px; }
	#sub.view .v_con{ min-height: 300px; margin-bottom: 20px; }
	#sub.view .v_tt strong{ font-size: 18px; }
	#sub.view .v_con{ font-size: .8rem; }
	#sub.view .v_tt p{ font-size: 14px; }
	
	#sub.contact .con01 .right .info .info_r{ gap: 20px; }
	
}

