@charset "UTF-8";
/* 서브페이지 기본틀 */

.header.scrolled .gnb_header {position: fixed; top: 0; z-index: 1; width: 100%; background-color: #fff; box-shadow: 0 2px 5px rgb(211 211 211 / 50%);}
.header.scrolled .gnb_header .head_box .logo a {background-image: url("/kor/images/common/logo.png");}
.header.scrolled .gnb_header .head_box .gnb > li > a > .text {color: #222;}
.header.scrolled .util_menu .language_box .language_btn .text {color: #222;}
.header.scrolled .util_menu .language_box .language_btn .text:before {background-image: url("/kor/images/common/language_arrow.png");}
.header.scrolled .util_menu .sitemap_btn {background-image: url("/kor/images/common/sitemap_btn_on.png");}
.header.scrolled .util_menu .m_box .m_gnb_btn {background-image: url("/kor/images/common/sitemap_btn_on.png");}

.sub_top_area {position: relative; height: 540px; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.sub_top_area.bg01 {background-image: url("/kor/images/sub/sub_bg01.jpg");}
.sub_top_area.bg02 {background-image: url("/kor/images/sub/sub_bg02.jpg");}
.sub_top_area.bg03 {background-image: url("/kor/images/sub/sub_bg03.jpg");}
.sub_top_area.bg04 {background-image: url("/kor/images/sub/sub_bg04.jpg");}
.sub_top_area.bg05 {background-image: url("/kor/images/sub/sub_bg05.jpg");}
.sub_top_area.bg06 {background-image: url("/kor/images/sub/sub_bg06.jpg");}
.sub_top_area.bg07 {background-image: url("/kor/images/sub/sub_bg07.jpg");}
.sub_top_area .sub_top_box {position: relative; height: 100%;}
.sub_top_area .sub_top_box .sub_text_box {position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); width: 100%;}
.sub_top_area .sub_top_box .sub_text_box .sub_top_tit {position: relative; font-weight: 700; font-size: 60px; line-height: 60px; color: #ffffff; text-align: center; text-transform: uppercase;}
.sub_top_area .sub_top_box .sub_text_box .sub_top_txt {margin: 30px 0 0; font-weight: 400; font-size: 20px; line-height: 30px; color: #ffffff; text-align: center;}
.sub_top_area .sub_top_box .bread_list_area {position: absolute; left: auto; bottom: 0; width: 100%; }
.sub_top_area .sub_top_box .bread_list_area .breadcrumb {display: flex; font-size: 0;  width: 100%; max-width: 1760px; margin: 0 0 0 auto; background-color: rgba(0, 0, 0, 0.4);}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .box {display: inline-block; position: relative;}
/* .sub_top_area .sub_top_box .bread_list_area .breadcrumb .box:before {display: block; content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 30px; background-color: #d71921;} */
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .box:first-child:before {display: none;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .box:last-child:before {display: none;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home {flex-shrink: 0; width: 80px; text-align: center; background-color: #000000;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home .btn {display: flex; text-align: center; width: 100%; height: 100%; align-items: center;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home .btn img {margin: 0 auto;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth {position: relative; width: 100%; max-width: 320px;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text {display: block; position: relative; width: 100%; padding: 0 0 0 20px; font-weight: 400; font-size: 18px; line-height: 80px; color: #ffffff; letter-spacing: -0.04em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text:after {content:''; display: inline-block; position: absolute; top: 50%; right: 30px; width: 10px; height: 7px; background-image:url('/kor/images/sub/breadcrumb_arrow.png'); background-position: center center; background-repeat: no-repeat; transform: translateY(-50%); transition: all 0.23s ease-out;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth.on > .text:after {transform: translateY(-50%) rotate(180deg);}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list {display: none; width: 100%; position: absolute; top: 100%; z-index: 2; background-color: #fff; box-shadow: 0px 1px 10px 2px rgba(0, 0, 0, 0.07)}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li {border-bottom: 1px solid #e7e7e7;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li:last-child {border-bottom: none;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a {padding: 0 20px; font-weight: 500; font-size: 18px; line-height: 70px; color: #777777; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all;}
.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a:hover, .sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a:focus {background-color: #daecfc;}

.sub_cont {margin: 90px 0 0; padding: 0 0 120px}

.com_title_area {margin: 0 0 60px; text-align: center;}
.com_title_area .sub_title {margin: 0 0 15px; font-weight: 400; font-size: 24px; line-height: 30px; color: #074f98;}
.com_title_area .title {font-weight: 700; font-size: 60px; line-height: 60px; color: #222222;}
.com_title_area .text {margin: 20px 0 0; font-weight: 400; font-size: 24px; line-height: 32px; color: #222222; letter-spacing: -0.03em;}
.com_title_area .text .ft_c {color: #074f98;}
/* 서브페이지 기본틀 */

.mt110 {margin-top: 110px !important;}
.mt80 {margin-top: 80px !important;}

.line_com_title {margin: 0 0 20px;}
.line_com_title .title {position: relative; font-weight: 700; font-size: 34px; line-height: 35px; color: #222222;}
/* .line_com_title .title:before {display: block; content: ""; position: absolute; left: 0; top: 0; width: 4px; height: 35px; background-color: #074f98;} */
.line_com_title .text {margin: 10px 0 0; font-weight: 400; font-size: 20px; line-height: 32px; color: #888888; letter-spacing: -0.035em;}

.product_img_area {}
.product_img_area .product_big_area {}
.product_img_area .product_big_area .product_big_slide {overflow: hidden;}
.product_img_area .product_big_area .product_big_slide .list {}
.product_img_area .product_big_area .product_big_slide .list li {}
.product_img_area .product_big_area .product_big_slide .list li .img_box {position: relative; padding-bottom: 58.905%; cursor: pointer;}
.product_img_area .product_big_area .product_big_slide .list li .img_box .img_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.product_img_area .product_big_area .product_big_slide .list li .img_box .img_inner img {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: contain;}
.product_img_area .product_small_area {margin: 20px 0 0; }
.product_img_area .product_small_area .product_small_slide {overflow: hidden;}
.product_img_area .product_small_area .product_small_slide .list {}
.product_img_area .product_small_area .product_small_slide .list li {}
.product_img_area .product_small_area .product_small_slide .list li .img_box {position: relative; padding-bottom: 60.657%; cursor: pointer;}
.product_img_area .product_small_area .product_small_slide .list li .img_box .img_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.product_img_area .product_small_area .product_small_slide .list li .img_box .img_inner img {display: inline-block; vertical-align: middle; width: 100%; height: 100%; object-fit: contain;}

.function_area {background-color: #f7f7f7; padding: 50px 45px;}
.function_area .list {display: flex; flex-wrap: wrap; gap: 10px 5px;}
.function_area .list li {width: calc(33.3333% - 3.3333px); position: relative; padding: 0 0 0 34px; font-weight: 400; font-size: 20px; line-height: 24px; color: #222222;}
.function_area .list li .etc {position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 50%; background-color: #074f98; line-height: 22px; color: #ffffff; text-align: center;}
.function_area.sty2 .list li:last-child {width: auto;}

.row_table_area {}
.row_table_area .table_inner {}
.row_table_area .table_inner table {width: 100%; border-top: 2px solid #074f98;}
.row_table_area .table_inner table .table_width1 {width: 18.4%;}
.row_table_area .table_inner table .table_width2 {width: 81.6%;}
.row_table_area .table_inner table .table_width3 {width: 23.9%;}
.row_table_area .table_inner table .table_width4 {width: 76.1%;}
.row_table_area .table_inner table tbody {}
.row_table_area .table_inner table tbody tr {border-bottom: 1px solid #d3dae8;}
.row_table_area .table_inner table tbody tr th {padding: 18px 0 18px 40px; background-color: #074f98; font-weight: 700; font-size: 20px; line-height: 30px; color: #ffffff; text-align: left;}
.row_table_area .table_inner table tbody tr td {padding: 0 0 0 40px; font-weight: 400; font-size: 20px; line-height: 30px; color: #888888;}
.row_table_area .key_area {display: flex; justify-content: space-between; column-gap: 10px; margin: 20px 0 0;}
.row_table_area .key_area .key_text {}
.row_table_area .key_area .key_text .text {display: inline-block; padding: 0 0 0 33px; background: url("/kor/images/sub/key_icon.png") no-repeat left top; font-weight: 400; font-size: 17px; line-height: 24px; color: #777777;}
.row_table_area .key_area .key_icon {flex-shrink: 0; text-align: right;}
.row_table_area .key_area .key_icon img {}
.row_table_area .key_area .key_icon .comp_text {margin: 10px 0 0; font-weight: 400; font-size: 17px; line-height: 24px; color: #777777;}
.row_table_area.gray .table_inner table tbody tr th {background-color: #f7f7f7; color: #222222;}

.icon_area {}
.icon_area .list {}
.icon_area .list li {margin: 15px 0 0;}
.icon_area .list li:first-child {margin: 0;}
.icon_area .list li .box {display:flex; border-radius: 40px; border: 3px solid #f7f7f7; overflow: hidden;}
.icon_area .list li .box .title_box {display: flex; align-items: center; width: 284px; padding: 21px 0 21px 50px; border-radius: 40px; background-color: #f7f7f7;}
.icon_area .list li .box .title_box .title {padding: 0 0 0 50px; background-repeat: no-repeat; background-position: left center; font-weight: 700; font-size: 22px; line-height: 32px; color: #222222;}
.icon_area .list li.icon01 .box .title_box .title {background-image: url("/kor/images/sub/prd_icon01.png");}
.icon_area .list li.icon02 .box .title_box .title {background-image: url("/kor/images/sub/prd_icon02.png");}
.icon_area .list li .box .text_box {width: calc(100% - 284px); padding: 21px 25px;}
.icon_area .list li .box .text_box .text {font-weight: 400; font-size: 20px; line-height: 32px; color: #888888;}
.icon_area.sky .list li .box {border-color: #074f98}
.icon_area.sky .list li .box .title_box {justify-content: center; width: 260px; padding-left: 10px; padding-right: 10px; background-color: #074f98; text-align: center}
.icon_area.sky .list li .box .title_box .title {padding: 0; color: #fff;}
.icon_area.sky .list li .box .text_box {width: calc(100% - 260px);}

.color_list {}
.color_list .list {display: flex; justify-content: space-between;}
.color_list .list li {}
.color_list .list li .box {display: flex; align-items: center; justify-content: center; width: 220px; height: 220px; border-radius: 50%; text-align: center;}
.color_list .list li:nth-child(odd) .box {background-color: #45a1ee;}
.color_list .list li:nth-child(even) .box {background-color: #074f98;}
.color_list .list li .box .text {font-weight: 500; font-size: 30px; line-height: 36px; color: #ffffff; text-align: center;}

.sch_area {width: 100%; max-width: 400px; margin: 0 auto;}
.sch_area .sch_inner {display: flex; width: 100%; border-bottom: 3px solid #222222;}
.sch_area .sch_inner .select_box {width: 90px;}
.sch_area .sch_inner .select_box select {width: 100%; border: none; background-color: #fff; background-image: url("/kor/images/sub/slt_arr_icon.png"); background-position: right center; background-size: 10px 5px; background-repeat: no-repeat; font-weight: 400; font-size: 16px; line-height: 50px; color: #777777;}
.sch_area .sch_inner .select_box select option {}
.sch_area .sch_inner .input_box {width: calc(100% - 110px);}
.sch_area .sch_inner .input_box input {width: 100%; padding: 0 30px; border: none; font-weight: 400; font-size: 16px; line-height: 50px; color: #777777;}
.sch_area .sch_inner .sch_btn {display: block; width: 20px;}
.sch_area .sch_inner .sch_btn img {}

.notice_area {margin: 60px 0 0;}
.notice_area .list {}
.notice_area .list li {margin: 20px 0 0;}
.notice_area .list li:first-child {margin: 0;}
.notice_area .list li .box {display: block; padding: 35px 50px; border-radius: 10px; background-color: #f6f6f6; box-shadow: 0px 0px 10px rgb(0 0 0 / 20%)}
.notice_area .list li .box .menu {font-weight: 400; font-size: 16px; line-height: 20px; color: #074f98; letter-spacing: -0.035em;}
.notice_area .list li .box .title {margin: 5px 0 0; font-weight: 500; font-size: 22px; line-height: 33px; color: #222222; letter-spacing: -0.035em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word;}
.notice_area .list li .box .text {margin: 15px 0 0; font-weight: 300; font-size: 16px; line-height: 24px; color: #777777; letter-spacing: -0.035em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word;}
.notice_area .list li .box .date {margin: 15px 0 0; font-weight: 300; font-size: 16px; line-height: 24px; color: #777777; letter-spacing: -0.035em;}
.notice_area .list li .box:hover, .notice_area .list li .box:focus {background-color: #074f98;}
.notice_area .list li .box:hover .menu, .notice_area .list li .box:focus .menu {color: #fff;}
.notice_area .list li .box:hover .title, .notice_area .list li .box:focus .title {color: #fff;}
.notice_area .list li .box:hover .text, .notice_area .list li .box:focus .text {color: #d6ecff;}
.notice_area .list li .box:hover .date, .notice_area .list li .box:focus .date {color: #fff;}

.board_view {border-top: 2px solid #074f98;}
.board_view .board_top {padding: 15px;}
.board_view .board_top > .title {font-weight: 500; font-size: 30px; line-height: 40px; color: #222222;}
.board_view .board_top .info_list {margin: 20px 0 0;}
.board_view .board_top .info_list .list {display: flex; column-gap: 25px; row-gap: 5px; flex-wrap: wrap;}
.board_view .board_top .info_list .list li {}
.board_view .board_top .info_list .list li .box {display: flex; column-gap: 5px;}
.board_view .board_top .info_list .list li .box .title {font-weight: 300; font-size: 14px; line-height: 21px; color: #222222;}
.board_view .board_top .info_list .list li .box .text {font-weight: 300; font-size: 14px; line-height: 21px; color: #777777;}
.board_view .board_cont {padding: 50px 80px; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee;}
.board_view .board_cont .text {font-size: 16px; line-height: 1.5; word-break:unset;}
.board_view .post_nav {margin: 45px 0 0; border-top: 1px solid #eeeeee;}
.board_view .post_nav .list {}
.board_view .post_nav .list li {padding: 16px 0; border-bottom: 1px solid #eeeeee;}
.board_view .post_nav .list li .item_wrapper {display: table; table-layout: fixed; width: 100%; position: relative;}
.board_view .post_nav .list li .item_wrapper .tit {display: table-cell; position: relative; width: 145px; padding: 0 20px 0 30px; vertical-align: middle;}
.board_view .post_nav .list li .item_wrapper .tit .icon {position: relative; background-repeat: no-repeat; background-position: right center; font-weight: 400; font-size: 16px; line-height: 27px; color: #222222;}
.board_view .post_nav .list li.prev .item_wrapper .tit .icon {background-image: url("/kor/images/sub/prev_icon.png");}
.board_view .post_nav .list li.next .item_wrapper .tit .icon {background-image: url("/kor/images/sub/next_icon.png");}
.board_view .post_nav .list li .item_wrapper .tit:before {display: block;content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 20px; background-color: #dddddd;}
.board_view .post_nav .list li .item_wrapper .post {display: table-cell; width: 100%; padding: 0 20px; vertical-align: middle; font-weight: 400; font-size: 16px; line-height: 27px; color: #777777;}
.board_view .post_nav .list li .item_wrapper .post a {height: 27px; display: block; text-align: left; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-wrap: break-word; color: #888;}

.news_area {margin: 60px 0 0;}
.news_area .list {display: flex; flex-wrap: wrap; gap: 50px 26px;}
.news_area .list li {width: calc(25% - 19.5px);}
.news_area .list li .box {display: block; height: 100%; background-color: #f6f6f6; border-radius: 10px; overflow: hidden; transition: all 0.5s;}
.news_area .list li .box .img_box {position: relative; padding-bottom: 75.42%; cursor: pointer; overflow: hidden;}
.news_area .list li .box .img_box .img_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.news_area .list li .box .img_box .img_inner img {display: inline-block; vertical-align: middle; width: 100%; height: 100%; object-fit: cover; transition: all 0.5s;}
.news_area .list li .box .text_box {padding: 20px 40px 30px; transition: all 0.5s;}
.news_area .list li.only_text .box .text_box {display: flex; flex-direction: column; justify-content: space-between; height: 100%; padding: 30px 40px;}
.news_area .list li.only_text .box .text_box .date {margin: 0;}
.news_area .list li .box .text_box .menu {font-weight: 400; font-size: 16px; line-height: 24px; color: #074f98; transition: all 0.5s;}
.news_area .list li .box .text_box .title {margin: 10px 0 0; font-weight: 500; font-size: 22px; line-height: 33px; color: #222222; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-wrap: break-word; transition: all 0.5s;}
.news_area .list li .box .text_box .text {margin: 15px 0 0; font-weight: 300; font-size: 16px; line-height: 24px; color: #777777; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; word-wrap: break-word; transition: all 0.5s;}
.news_area .list li .box .text_box .date {margin: 25px 0 0; font-weight: 300; font-size: 14px; line-height: 20px; color: #777777; transition: all 0.5s;}
.news_area .list li .box:hover, .news_area .list li .box:focus {background-color: #074f98;}
.news_area .list li .box:hover .text_box .menu, .news_area .list li .box:focus .text_box .menu {color: #ffffff;}
.news_area .list li .box:hover .text_box .title, .news_area .list li .box:focus .text_box .title {color: #ffffff;}
.news_area .list li .box:hover .text_box .text, .news_area .list li .box:focus .text_box .text {color: #ababd3;}
.news_area .list li .box:hover .text_box .date, .news_area .list li .box:focus .text_box .date {color: #ababd3;}
.news_area .list li .box:hover .img_box .img_inner img, .news_area .list li .box:focus .img_box .img_inner img {transform: scale(1.2)}

.inq_area {border-top: 2px solid #dfdfdf; padding: 30px 30px 0;}
.inq_area .info_list {}
.inq_area .info_list .list {display: flex; column-gap: 50px;}
.inq_area .info_list .list li {}
.inq_area .info_list .list li .text {display: inline-block; position: relative; padding: 0 0 0 30px; background-repeat: no-repeat; background-position: left center; font-weight: 400; font-size: 20px; line-height: 30px; color: #222222;}
.inq_area .info_list .list li.icon01 .text {background-image: url("/kor/images/sub/inq_icon01.png");}
.inq_area .info_list .list li.icon02 .text {background-image: url("/kor/images/sub/inq_icon02.png");}
.inq_area .inq_list {margin: 20px 0 0;}
.inq_area .inq_list .list {display: flex; flex-wrap: wrap; gap: 10px;}
.inq_area .inq_list .list li {width: calc(50% - 5px);}
.inq_area .inq_list .list li.w100 {width: 100%;}
.inq_area .inq_list .list li .box {}
.inq_area .inq_list .list li .box input {width: 100%; border: 1px solid #ebebeb; padding: 0 20px; background-color: #fbfbfb; font-weight: 400; font-size: 17px; line-height: 58px; color: #222222;}
.inq_area .inq_list .list li .box textarea {height: 290px; padding: 20px; border: 1px solid #ebebeb; background-color: #fbfbfb; resize: none; font-family: "NotoSans"; font-weight: 400; font-size: 17px; line-height: 24px; color: #222222;}
.inq_area .check_area {display: flex; align-items: center; justify-content: end; column-gap: 10px; margin: 15px 0 0;}
.inq_area .check_area .chk_inner {}
.inq_area .check_area .chk_inner input {}
.inq_area .check_area .chk_inner label {font-weight: 400; font-size: 18px; line-height: 20px; color: #222222;}
.inq_area .check_area .policy_btn {display: block; width: 90px; background: #074f98; font-weight: 400; font-size: 14px; line-height: 35px; color: #fff; text-align: center;}
.inq_area .inq_button {display: block; width: 240px; margin: 80px auto 0; border: 2px solid #074f98; border-radius: 30px;}
.inq_area .inq_button .text {display: inline-block; padding: 0 35px 0 0; background: url("/kor/images/sub/inq_btn_icon.png") no-repeat right center; font-weight: 700; font-size: 20px; line-height: 56px; color: #074f98;}
.inq_area .inq_button:hover, .inq_area .inq_button:focus {background-color: #074f98;}
.inq_area .inq_button:hover .text, .inq_area .inq_button:focus .text {color: #fff; background-image: url("/kor/images/sub/inq_btn_icon_on.png");}

.tech_area {}
.tech_area .list {display: flex; column-gap: 55px; text-align: center;}
.tech_area .list li {width: calc(33.3333% - 36.6666px);}
.tech_area .list li .box {height: 100%; padding: 60px 10px 65px; border-radius: 20px; border: 3px solid #074f98;}
.tech_area .list li .box .img_box {}
.tech_area .list li .box .img_box img {transition: all 0.5s;}
.tech_area .list li .box .text_box {margin: 40px 0 0;}
.tech_area .list li .box .text_box .title {font-weight: 700; font-size: 36px; line-height: 40px; color: #222222;}
.tech_area .list li .box .text_box .text {margin: 25px 0 0; font-weight: 400; font-size: 18px; line-height: 28px; color: #777777; letter-spacing: -0.03em;}
.tech_area .list li .box:hover, .tech_area .list li .box:focus {background-color: #074f98;}
.tech_area .list li .box:hover .text_box .title, .tech_area .list li .box:focus .text_box .title {color: #fff;}
.tech_area .list li .box:hover .text_box .text, .tech_area .list li .box:focus .text_box .text {color: #eaeaff;}
.tech_area .list li .box:hover .img_box img, .tech_area .list li .box:focus .img_box img {animation: scrollani 300ms 0ms 2 ;}

.intro_area {}
.intro_area .intro_top {height: 540px; border-radius: 40px; background: url("/kor/images/sub/intro_bg_pc.png") no-repeat bottom center; background-attachment: fixed;}
.intro_area .intro_top .inner {display: flex; justify-content: center; align-items: center; height: 100%;}
.intro_area .intro_top .inner .text_box {font-family: "Montserrat"; font-weight: 400; font-size: 64px; line-height: 80px; color: #ffffff; text-align: center;}
.intro_area .intro_top .inner .text_box .ft_w {font-weight: 700;}
.intro_area .intro_btm {display: flex; align-items: end; column-gap: 80px; margin: -200px 0 0;}
.intro_area .intro_btm .intro_left {}
.intro_area .intro_btm .intro_left .since_box {width: 400px; height: 540px; padding: 55px 50px; border-radius: 22px; background: #074f98 url("/kor/images/sub/since_bg.png") no-repeat right bottom;}
.intro_area .intro_btm .intro_left .since_box .text {position: relative; padding: 0 0 25px; font-family: "Montserrat"; font-weight: 500; font-size: 40px; line-height: 50px; color: #ffffff;}
.intro_area .intro_btm .intro_left .since_box .text:before {display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 50px; height: 2px; background-color: #fff;}
.intro_area .intro_btm .intro_left .since_box .year {margin: 40px 0 0; font-family: "Montserrat"; font-weight: 700; font-size: 110px; line-height: 1; color: #ffffff;}
.intro_area .intro_btm .intro_right {}
.intro_area .intro_btm .intro_right .row_table_area {}

.map_area {padding: 20px 0 0; border-top: 2px solid #dfdfdf;}
.map_area .map_box {position: relative; padding-bottom: 47.261%; cursor: pointer;}
.map_area .map_box .map_inner {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%;}
.map_area .map_box .map_inner #map1 {display: inline-block; vertical-align: middle; width: 100%; height: 100%; object-fit: cover;}
.map_area .map_box .map_inner #map1 .name {padding: 10px 40px; background-color: #074f98; font-weight: 700; font-size: 16px; color: #fff;}
.map_area .map_box .map_inner #map1 .gm-style .gm-style-iw-d {overflow: inherit !important; background-color: #074f98;}
.map_area .map_box .map_inner #map1 .gm-style .gm-style-iw-c {padding: 0 !important; background-color: #074f98;}
.map_area .map_box .map_inner #map1 .gm-style .gm-style-iw-tc {display: none;}
.map_area .map_box .map_inner #map1 .gm-style-iw-ch {padding: 0 !important;}
.map_area .map_box .map_inner #map1 .gm-style-iw-chr {display: none !important}
.map_area .map_box .map_inner #map1 .gm-svpc {display: none !important}
.map_area .map_box .map_inner #map1 .gm-ui-hover-effect>span {background-color: #074f98;}
.map_area .map_info {padding: 50px; border: 1px solid #dcdcdc;}
.map_area .map_info .inner {position: relative; display: flex; align-items: center; column-gap: 50px; }
.map_area .map_info .inner .logo {}
.map_area .map_info .inner .logo img {}
.map_area .map_info .inner .info_list {}
.map_area .map_info .inner .info_list .list {display: flex; column-gap: 30px;}
.map_area .map_info .inner .info_list .list + .list {margin: 10px 0 0;}
.map_area .map_info .inner .info_list .list li {}
.map_area .map_info .inner .info_list .list li .box {display: flex; column-gap: 30px;}
.map_area .map_info .inner .info_list .list li .box .title {position: relative; background-position: left center; background-repeat: no-repeat; padding: 0 0 0 35px; font-weight: 400; font-size: 20px; line-height: 30px; color: #222222;}
.map_area .map_info .inner .info_list .list li.icon01 .box .title {background-image: url("/kor/images/sub/map_icon01.png");}
.map_area .map_info .inner .info_list .list li.icon02 .box .title {background-image: url("/kor/images/sub/map_icon02.png");}
.map_area .map_info .inner .info_list .list li.icon03 .box .title {background-image: url("/kor/images/sub/map_icon03.png");}
.map_area .map_info .inner .info_list .list li .box .text {font-weight: 400; font-size: 20px; line-height: 30px; color: #777777;}
.map_area .map_info .inner .btn {display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 220px; border-radius: 30px; border: 2px solid #074f98; background-color: #074f98; font-weight: 700; font-size: 18px; line-height: 56px; color: #ffffff; text-align: center;}
.map_area .map_info .inner .btn:hover, .map_area .map_info .inner .btn:focus {background-color: #fff; color: #074f98;}

.skill_area {}
.skill_area .skill_top {padding: 95px 0 120px; background: url("/kor/images/sub/skill_bg.png") no-repeat center / cover; background-attachment: fixed;}
.skill_area .skill_top .title_box {}
.skill_area .skill_top .title_box .title {font-weight: 700; font-size: 42px; line-height: 50px; color: #ffffff; text-align: center;}
.skill_area .skill_top .system_list {margin: 190px 0 0;}
.skill_area .skill_top .system_list .list {display: flex; jusitfy-content: sapce-between;}
.skill_area .skill_top .system_list .list li {width: 100%; padding: 0 40px; border-right: 1px solid #9ca2b7;}
.skill_area .skill_top .system_list .list li:last-child {border: none;}
.skill_area .skill_top .system_list .list li .box {}
.skill_area .skill_top .system_list .list li .box .title_area {display: flex; justify-content: space-between;}
.skill_area .skill_top .system_list .list li .box .title_area .title {font-weight: 700; font-size: 25px; line-height: 30px; color: #75c0ff;}
.skill_area .skill_top .system_list .list li .box .title_area .img {}
.skill_area .skill_top .system_list .list li .box .title_area .img img {transition: all 0.5s;}
.skill_area .skill_top .system_list .list li .box:hover .title_area .img img, .skill_area .skill_top .system_list .list li .box:focus .title_area .img img {animation: scrollani 300ms 0ms 2 ease;}
.skill_area .skill_top .system_list .list li .box .text_box {margin: 10px 0 0;}
.skill_area .skill_top .system_list .list li .box .text_box .text {font-weight: 400; font-size: 16px; line-height: 24px; color: #ffffff; letter-spacing: -0.035em;}
.skill_area .skill_btm {margin: 115px 0 0;}
.skill_area .skill_btm .skill_list {}
.skill_area .skill_btm .skill_list .list {display: flex; column-gap: 33px;}
.skill_area .skill_btm .skill_list .list li {width: 100%;}
.skill_area .skill_btm .skill_list .list li .box {text-align: center;}
.skill_area .skill_btm .skill_list .list li .box .num_box {position: relative; padding: 0 0 15px;}
.skill_area .skill_btm .skill_list .list li .box .num_box:before {display: block; content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 4px; background-color: #074f98;}
.skill_area .skill_btm .skill_list .list li .box .num_box .num {font-style: italic; font-weight: 700; font-size: 26px; line-height: 30px; color: #074f98; text-align: center;}
.skill_area .skill_btm .skill_list .list li .box .text_box {margin: 35px 0 0;}
.skill_area .skill_btm .skill_list .list li .box .text_box .title {font-weight: 700; font-size: 25px; line-height: 30px; color: #222222;}
.skill_area .skill_btm .skill_list .list li .box .text_box .text {margin: 15px 0 0; font-weight: 400; font-size: 15px; line-height: 22px; color: #777777; letter-spacing: -0.035em;}


.history_area {}
.history_area .history-top-wrap {height: 500px; margin: 0 0 110px; background: url("/kor/images/sub/history_bg_pc.png") no-repeat center / cover; background-attachment: fixed;}
.history_area .history-top-wrap .history-top-con {display: flex; height: 100%; justify-content: center; align-items: center;}
.history_area .history-top-wrap .history-top-con .text_box {font-weight: 400; font-size: 40px; line-height: 55px; color: #ffffff; text-align: center;}
.history_area .history-top-wrap .history-top-con .text_box .ft_w {font-weight: 700;}
.history-con-wrap {position: relative;}
.history-percent-bar {position: absolute;top: 0; left: 50%;  width:0.5rem;height: calc(100% - 5.2rem);background-color: #eeeeee;}
.history-percent-bar .percent-bar-child {position: absolute;content: ""; width: 100%;  height: 0;background-color: #074f98; z-index: 1;  /* transition: all 0.3s; */}
.percent-bar-child .point { display: block; -webkit-box-sizing: border-box;-moz-box-sizing: border-box; box-sizing: border-box;  position: absolute; bottom: -6.5rem; left: 50%; transform: translateX(-46%); content: ""; z-index: 5; width: 6.1rem; height: 6.7rem; background: url("/kor/images/sub/history_bar_point.png") no-repeat center; -webkit-background-size: 100%; background-size: 100%;}

.history-con .history-year-group-box {position: relative; display: flex; padding-bottom: 4rem;}
.history-con .history-year-group-box .history-year-group-tit-box {width: 50%; text-align: right;}
.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-tit {font-family: "Montserrat"; font-size: 6rem; font-weight: 700; letter-spacing: -0.050em; color: #000000; transition: all 0.3s;}
.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-txt {font-size: 2rem; font-weight: 700; letter-spacing: -0.050em; color: #000000; padding-top: 1rem; transition: all 0.3s;}
.history-con .history-year-list-box {width: 50%; padding-top: 2rem;} 
.history-con .history-year-list-box .history-year-item {position: relative; display: flex; margin-bottom: 5rem;}
.history-con .history-year-list-box .history-year-item:before {position: absolute; width: 0.5rem; height:  0.5rem; border-radius:  0.5rem; content: ''; top: 1rem; background: #cccccc;}
.history-con .history-year-list-box .history-year-item .history-year {width: 8.5rem; font-family: "Montserrat"; font-size: 2.6rem; font-weight: 700; letter-spacing: -0.050em; color: #000;}
.history-con .history-month-box {width: calc(100% - 8.5rem);}
.history-con .history-month-box .history-detail-txt {position: relative; padding: 0 0 0 3rem; font-size: 1.8rem; font-weight: 500; letter-spacing: -0.050em; color: #000; line-height: 1.33; margin-bottom: 1rem;}
.history-con .history-month-box .history-detail-txt .tit {display: inline-block; position: absolute; left: 0; top: 0; font-weight: 700;}
.history-con .history-year-group-box.active .history-year-group-tit, .history-con .history-year-group-box.active  .history-year-group-txt {color: #074f98; }
@media all and (min-width:1081px){
	.history-con .history-year-group-box:not(.reverse) .history-year-group-tit-box {padding-right: 5rem;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box {padding-left: 5.7rem;}
	.history-con .history-year-group-box:not(.reverse) .history-month-box .history-detail-txt:before {left: 0;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box .history-year-item:before {left: -5.7rem;}
	.history-con .history-year-group-box.reverse {flex-direction:row-reverse;}
	.history-con .history-year-group-box.reverse .history-year-list-box {padding-right: 5.7rem;}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item:before {right: -6.2rem;}
	.history-con .history-year-group-box.reverse .history-year-group-tit-box {padding-left: 5rem; text-align: left;}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item {flex-direction:row-reverse;}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item .history-year {text-align: right;}
	.history-con .history-year-group-box.reverse .history-month-box {text-align: right;}
	.history-con .history-year-group-box.reverse .history-month-box .history-detail-txt {display: inline-block;}
	.history-con .history-year-group-box.reverse .history-month-box .history-detail-txt:before {right: 0;}
}

@keyframes scrollani {
	0% {transform: translateY(0);}
	50% {transform: translateY(5px);}
	100% {transform: translateY(0);}
}

@media screen and (max-width: 1640px) {
	.intro_area .intro_top {height: 440px;}
	.intro_area .intro_btm {column-gap: 40px;}

}
@media screen and (max-width: 1400px) {
    .sub_top_area {height: 400px;}
	.sub_top_area .sub_top_box .sub_text_box .sub_top_tit {font-size: 45px; line-height: 45px;}
    .sub_top_area .sub_top_box .sub_text_box .sub_top_txt {margin: 20px 0 0; font-size: 18px; line-height: 26px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home {width: 60px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text {padding: 0 20px 0 10px; font-size: 16px; line-height: 60px;}
    .sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text:after {right: 10px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a {padding: 0 10px; font-size: 16px; line-height: 50px;}

	.sub_cont {margin: 60px 0 0; padding: 0 0 80px;}
	.com_title_area {margin: 0 0 50px;}
	.com_title_area .sub_title {margin: 0 0 10px; font-size: 20px; line-height: 30px;}
	.com_title_area .title {font-size: 40px; line-height: 40px;}
	.com_title_area .text {margin: 10px 0 0; font-size: 20px; line-height: 30px;}

	.line_com_title .title {font-size: 30px; line-height: 30px;}
	.line_com_title .title:before {height: 30px;}
	.line_com_title .text {font-size: 18px; line-height: 26px;}

	.product_img_area .product_small_area {margin: 10px 0 0;}

	.function_area {padding: 30px;}
	.function_area .list li {font-size: 18px; line-height: 24px;}

	.row_table_area .table_inner table tbody tr th {padding: 12px 0 12px 30px; font-size: 18px; line-height: 24px;}
	.row_table_area .table_inner table tbody tr td {padding: 5px 0 5px 30px; font-size: 18px; line-height: 24px;}
	.row_table_area .key_area {margin: 10px 0 0;}
	.row_table_area .key_area .key_text .text {padding: 0 0 0 26px; background-size: 20px 20px; font-size: 14px; line-height: 20px;}
	.row_table_area .key_area .key_icon img {width: 100px;}
	.row_table_area .key_area .key_icon .comp_text {margin: 5px 0 0; font-size: 14px; line-height: 20px;}

	.icon_area.sky .list li .box .title_box {width: 200px;}
	.icon_area.sky .list li .box .text_box {width: calc(100% - 200px);}


	.icon_area .list li .box .title_box {width: 210px; padding: 10px 30px;}
	.icon_area .list li .box .title_box .title {padding: 0 0 0 40px; background-size: 30px auto; font-size: 18px; line-height: 28px;}
	.icon_area .list li .box .text_box {width: calc(100% - 210px); padding: 10px;}
	.icon_area .list li .box .text_box .text {font-size: 16px; line-height: 26px;}

	.color_list .list {justify-content: center; column-gap: 20px;}
	.color_list .list li .box {width: 190px; height: 190px;}
	.color_list .list li .box .text {font-size: 24px; line-height: 30px;}

	.notice_area {margin: 40px 0 0;}
	.notice_area .list li .box {padding: 20px;}
	.notice_area .list li .box .menu {font-size: 14px; line-height: 18px;}
	.notice_area .list li .box .title {font-size: 18px; line-height: 26px;}
	.notice_area .list li .box .text {margin: 10px 0 0; font-size: 14px; line-height: 21px;}
	.notice_area .list li .box .date {margin: 10px 0 0; font-size: 14px; line-height: 21px;}

	.board_view .board_top > .title {font-size: 24px; line-height: 30px;}
	.board_view .board_top .info_list .list {column-gap: 15px;}
	.board_view .board_cont {padding: 40px;}
	.board_view .post_nav .list li {padding: 12px 0;}
	.board_view .post_nav .list li .item_wrapper .tit {width: 110px; padding: 0 10px;}
	.board_view .post_nav .list li .item_wrapper .tit .icon {font-size: 14px; line-height: 20px;}
	.board_view .post_nav .list li .item_wrapper .post {padding: 0 10px; font-size: 14px; line-height: 20px;}
	.board_view .post_nav .list li .item_wrapper .post a {height: 20px;}
	
	.news_area {margin: 40px 0 0;}
	.news_area .list {gap: 30px 15px;}
	.news_area .list li {width: calc(25% - 11.25px);}
	.news_area .list li .box .text_box {padding: 20px;}
	.news_area .list li.only_text .box .text_box {padding: 20px;}
	.news_area .list li .box .text_box .menu {font-size: 14px; line-height: 20px;}
	.news_area .list li .box .text_box .title {margin: 5px 0 0; font-size: 18px; line-height: 24px;}
	.news_area .list li .box .text_box .text {margin: 10px 0 0; font-size: 14px; line-height: 20px;}
	.news_area .list li .box .text_box .date {margin: 10px 0 0; font-size: 12px; line-height: 18px;}

	.inq_area {padding: 15px 15px 0;}
	.inq_area .info_list .list {column-gap: 25px;}
	.inq_area .info_list .list li .text {font-size: 18px; line-height: 24px;}
	.inq_area .inq_list .list li .box input {padding: 0 10px; font-size: 16px; line-height: 48px;}
	.inq_area .inq_list .list li .box textarea {height: 200px; padding:10px; font-size: 16px;}
	.inq_area .check_area {margin: 10px 0 0;}
	.inq_area .check_area .chk_inner label {font-size: 16px;}
	.inq_area .inq_button {width: 200px; margin: 50px auto 0;}
	.inq_area .inq_button .text {font-size: 18px; line-height: 46px;}

	.tech_area .list {column-gap: 30px;}
	.tech_area .list li {width: calc(33.3333% - 20px);}
	.tech_area .list li .box {padding: 40px 5px;}
	.tech_area .list li .box .img_box img {width: 120px;}
	.tech_area .list li .box .text_box {margin: 20px 0 0;}
	.tech_area .list li .box .text_box .title {font-size: 30px; line-height: 35px;}
	.tech_area .list li .box .text_box .text {margin: 15px 0 0; font-size: 16px; line-height: 24px;}

	.intro_area .intro_top {height: 380px;}
	.intro_area .intro_top .inner .text_box {font-size: 50px; line-height: 60px;}
	.intro_area .intro_btm {column-gap: 20px; margin: -100px 0 0;}
	.intro_area .intro_btm .intro_left .since_box {width: 350px; height: 400px; padding: 30px; background-size: 200px auto;}
	.intro_area .intro_btm .intro_left .since_box .text {padding: 0 0 15px; font-size: 30px; line-height: 40px;}
	.intro_area .intro_btm .intro_left .since_box .year {margin: 20px 0 0; font-size: 80px;}
	
	.map_area .map_info {padding: 30px;}
	.map_area .map_info .inner {column-gap: 20px;}
	.map_area .map_info .inner .logo img {width: 140px;}
	.map_area .map_info .inner .info_list .list li .box {column-gap: 15px;}
	.map_area .map_info .inner .info_list .list li .box .title {background-size: 20px auto; padding: 0 0 0 25px; font-size: 18px; line-height: 25px;}
	.map_area .map_info .inner .info_list .list li .box .text {font-size: 18px; line-height: 25px;}
	.map_area .map_info .inner .btn {width: 160px; font-size: 16px; line-height: 46px;}

	.skill_area .skill_top {padding: 60px 0 100px;}
	.skill_area .skill_top .title_box .title {font-size: 34px; line-height: 40px;}
	.skill_area .skill_top .system_list {margin: 110px 0 0;}
	.skill_area .skill_top .system_list .list li {padding: 0 20px;}
	.skill_area .skill_top .system_list .list li .box .title_area .title {font-size: 22px; line-height: 26px;}
	.skill_area .skill_top .system_list .list li .box .text_box .text {font-size: 14px; line-height: 21px;}
	.skill_area .skill_btm {margin: 70px 0 0;}
	.skill_area .skill_btm .skill_list .list {column-gap: 10px;}
	.skill_area .skill_btm .skill_list .list li .box .num_box .num {font-size: 20px; line-height: 24px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box {margin: 15px 0 0;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .title {font-size: 20px; line-height: 26px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .text {margin: 10px 0 0; font-size: 14px; line-height: 20px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .text br {display: none;}

	.history_area .history-top-wrap {height: 400px; margin: 0 0 80px;}
	.history_area .history-top-wrap .history-top-con .text_box {font-size: 34px; line-height: 40px;}
	.history-con .history-year-list-box .history-year-item {margin-bottom: 4rem;}
	.history-con .history-year-group-box {padding-bottom: 2rem;}
	.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-tit {font-size: 4rem;}
	.history-con .history-year-group-box.reverse .history-year-group-tit-box {padding-left: 6rem;}
	.history-con .history-year-group-box.reverse .history-year-list-box {padding-right: 6rem;	}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item:before {right: -6.5rem}
	.history-con .history-year-group-box:not(.reverse) .history-year-group-tit-box {padding-right: 6rem;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box {padding-left: 6rem;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box .history-year-item:before {left: -6rem;}



	.mt110 {margin-top: 90px !important;}
	.mt80 {margin-top: 60px !important;}
}
@media screen and (max-width: 1280px) {

	.color_list .list li .box {width: 160px; height: 160px;}
	.color_list .list li .box .text {font-size: 20px; line-height: 24px;}
}
@media screen and (max-width: 1080px) {
    .sub_top_area {height: 300px;}
	.sub_top_area .sub_top_box .sub_text_box .sub_top_tit {font-size: 30px; line-height: 45px;}
    .sub_top_area .sub_top_box .sub_text_box .sub_top_txt {margin: 10px 0 0; font-size: 16px; line-height: 24px;}
    .sub_top_area .sub_top_box .bread_list_area .breadcrumb .box:before {height: 20px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home {width: 50px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text {padding: 0 23px 0 10px; font-size: 14px; line-height: 50px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a {padding: 0 10px; font-size: 14px; line-height: 45px;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth.depth2 {max-width: 280px;}
	
	.sub_cont {margin: 40px 0 0; padding: 0 0 60px;}
	.com_title_area {margin: 0 0 30px;}
	.com_title_area .sub_title {margin: 0 0 5px; font-size: 18px; line-height: 26px;}
	.com_title_area .title {font-size: 30px; line-height: 30px;}
	.com_title_area .text {font-size: 18px; line-height: 26px;}

	.line_com_title {margin: 0 0 10px;}
	.line_com_title .title {font-size: 24px; line-height: 24px;}
	.line_com_title .title:before {height: 24px;}
	.line_com_title .text {font-size: 16px; line-height: 24px;}

	.function_area {padding: 20px;}
	.function_area .list li {width: calc(50% - 2.5px); padding: 0 0 0 25px; font-size: 16px; line-height: 20px;}
	.function_area .list li .etc {width: 20px; height: 20px; line-height: 19px;}
	
	
	.row_table_area .table_inner table tbody tr th {padding: 8px 0; font-size: 16px; line-height: 20px; text-align: center;}
	.row_table_area .table_inner table tbody tr td {padding: 8px 0 8px 10px; font-size: 16px; line-height: 20px;}
	.row_table_area .key_area {margin: 5px 0 0;}
	.row_table_area .key_area .key_text .text {padding: 0 0 0 22px; background-size: 20px 20px; font-size: 12px; }
	.row_table_area .key_area .key_icon img {width: 80px;}
	.row_table_area .key_area .key_icon .comp_text {margin: 5px 0 0; font-size: 12px; line-height: 18px;}

	.icon_area .list li {margin: 10px 0 0;}
	.icon_area .list li .box {border-width: 2px;}
	.icon_area .list li .box .title_box {width: 150px; padding: 5px;}
	.icon_area .list li .box .title_box .title {background-size: 26px auto; padding: 0 0 0 30px; font-size: 16px; line-height: 26px;}
	.icon_area .list li .box .text_box {width: calc(100% - 150px); padding: 5px;}
	.icon_area .list li .box .text_box .text {display: flex; height: 100%; align-items: center; font-size: 14px; line-height: 24px;}
	
	.icon_area.sky .list li .box .title_box {width: 160px;}
	.icon_area.sky .list li .box .text_box {width: calc(100% - 160px);}

	.color_list .list {flex-wrap: wrap; gap: 10px;}
	.color_list .list li {width: calc(33.3333% - 6.6666px);}
	.color_list .list li .box {width: 220px; height: 220px; margin: 0 auto;}

	.notice_area {margin: 20px 0 0;}
	.notice_area .list li {margin: 15px 0 0;}
	.notice_area .list li .box {padding: 10px;}
	.notice_area .list li .box .title {font-size: 16px; line-height: 24px;}
	.notice_area .list li .box .text {margin: 5px 0 0;}

	.sch_area {max-width: 350px;}
	.sch_area .sch_inner .select_box select {line-height: 40px;}
	.sch_area .sch_inner .input_box input {padding: 0 10px; line-height: 40px;}

	.board_view .board_top > .title {font-size: 20px; line-height: 24px;}
	.board_view .board_top .info_list {margin: 10px 0 0;}
	.board_view .board_cont {padding: 20px;}
	.board_view .post_nav {margin: 20px 0 0;}
	.board_view .post_nav .list li {padding: 8px 0;}
	.board_view .post_nav .list li .item_wrapper .tit {width: 90px;}

	
	.news_area {margin: 20px 0 0;}
	.news_area .list {gap: 20px 10px;}
	.news_area .list li {width: calc(33.3333% - 6.6666px);}
	.news_area .list li .box .text_box {padding: 10px;}
	.news_area .list li.only_text .box .text_box {padding: 15px;}
	.news_area .list li .box .text_box .menu {font-size: 12px; line-height: 18px;}
	.news_area .list li .box .text_box .title {font-size: 16px; line-height: 20px;}


	.inq_area {padding: 15px 10px 0;}
	.inq_area .info_list .list {column-gap: 10px;}
	.inq_area .info_list .list li .text {font-size: 16px;}
	.inq_area .inq_list {margin: 10px 0 0;}
	.inq_area .inq_list .list li .box input {font-size: 14px; line-height: 38px;}
	.inq_area .inq_list .list li .box textarea {height: 150px; font-size: 14px; line-height: 21px;}
	.inq_area .check_area {margin: 5px 0 0;}
	.inq_area .check_area .chk_inner label {font-size: 14px;}
	.inq_area .inq_button {width: 160px; margin: 30px auto 0;}
	.inq_area .inq_button .text {font-size: 16px; line-height: 38px;}

	.tech_area .list {column-gap: 10px;}
	.tech_area .list li {width: calc(33.3333% - 3.3333px);}
	.tech_area .list li .box {padding: 20px 5px;}
	.tech_area .list li .box .img_box img {width: 100px;}
	.tech_area .list li .box .text_box {margin: 10px 0 0;}
	.tech_area .list li .box .text_box .title {font-size: 24px; line-height: 30px;}
	.tech_area .list li .box .text_box .text {margin: 10px 0 0; font-size: 14px; line-height: 21px;}

	.intro_area .intro_top {height: 300px;}
	.intro_area .intro_top .inner .text_box {font-size: 36px; line-height: 45px;}
	.intro_area .intro_btm {column-gap: 20px; margin: -80px 0 0;}
	.intro_area .intro_btm .intro_left .since_box {width: 260px; height: 300px; padding: 20px; background-size: 140px auto;}
	.intro_area .intro_btm .intro_left .since_box .text {padding: 0 0 10px; font-size: 24px; line-height: 30px;}
	.intro_area .intro_btm .intro_left .since_box .text:before {width: 30px;}
	.intro_area .intro_btm .intro_left .since_box .year {margin: 10px 0 0; font-size: 60px;}


	.map_area .map_info {padding: 20px;}
	.map_area .map_info .inner .logo img {width: 100px;}
	.map_area .map_info .inner .info_list .list li .box {column-gap: 5px;}
	.map_area .map_info .inner .info_list .list li .box .title {background-size: auto 20px; font-size: 16px; line-height: 20px;}
	.map_area .map_info .inner .info_list .list li .box .text {font-size: 16px; line-height: 20px;}
	.map_area .map_info .inner .btn {width: 120px; font-size: 14px; line-height: 36px;}
	
	.skill_area .skill_top {padding: 50px 0 70px;}
	.skill_area .skill_top .title_box .title {font-size: 30px; line-height: 34px;}
	.skill_area .skill_top .system_list {margin: 60px 0 0;}
	.skill_area .skill_top .system_list .list li {padding: 0 10px;}
	.skill_area .skill_top .system_list .list li .box .title_area .title {font-size: 18px; line-height: 22px;}
	.skill_area .skill_top .system_list .list li .box .title_area .img img {width: 36px;}
	.skill_area .skill_top .system_list .list li .box .text_box .text {font-size: 12px; line-height: 18px;}
	.skill_area .skill_btm {margin: 50px 0 0;}
	.skill_area .skill_btm .skill_list .list li .box .num_box .num {font-size: 18px; line-height: 22px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box {margin: 10px 0 0;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .title {font-size: 18px; line-height: 22px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .text {margin: 6px 0 0; font-size: 12px; line-height: 18px;}

	.history_area .container2 {padding: 0 5vw;}
	.history-percent-bar {left: 0; height: calc(100% - 8.6rem);}
	.history_area .history-top-wrap {height: 300px;}
	.history_area .history-top-wrap .history-top-con .text_box {font-size: 28px; line-height: 36px;}
	.history-con .history-year-group-box {padding-left: 4rem; display: block;}
	.history-con .history-year-group-box .history-year-group-tit-box {text-align: left; width: 100%;/*  margin-bottom: 2rem; */}
	.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-tit {font-size: 3rem;}
	.history-con .history-year-group-box.reverse .history-year-group-tit-box {padding-left: 0;}
	.history-con .history-year-list-box {width: 100%;}
	.history-con .history-month-box .history-detail-txt:before {left: 0;}
	.history-con .history-year-group-box.reverse .history-year-list-box {padding-top: 0;}
	.history-con .history-year-list-box .history-year-item {margin-bottom: 3rem; display: block;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box .history-year-item:before {left: -4rem;}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item:before {right: inherit; left: -4rem}
	.history-con .history-year-list-box .history-year-item .history-year {width: 100%; font-size: 2rem; margin-bottom: 1rem;}
	.history-con .history-month-box .history-detail-txt {font-size: 1.6rem; /* margin-bottom: 0.5rem; */}
	.history-con .history-month-box {width: 100%;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box {padding-left: 0;}
	.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-tit {color: #074f98;}
	.history-percent-bar .percent-bar-child {height: 100% !important;}


	.mt110 {margin-top: 60px !important;}
	.mt80 {margin-top: 40px !important;}
}
@media screen and (max-width: 767px) {
    .sub_top_area {height: 220px;}
	.sub_top_area .sub_top_box .sub_text_box .sub_top_txt {margin: 5px 0 0;}
	.sub_top_area .sub_top_box .bread_list_area .breadcrumb .home {width: 45px;} 
    .sub_top_area .sub_top_box .bread_list_area .breadcrumb .home .btn img {width: 14px;}
    .sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth > .text {line-height: 45px;}
    .sub_top_area .sub_top_box .bread_list_area .breadcrumb .com_depth .depth_list > li a {line-height: 40px;}

	.sub_cont {margin: 30px 0 0; padding: 0 0 40px;}
	.com_title_area .sub_title {font-size: 16px; line-height: 24px;}
	.com_title_area .title {font-size: 24px; line-height: 24px;}
	.com_title_area .text {font-size: 16px; line-height: 24px;}

	.line_com_title .title {font-size: 20px;}
	.line_com_title .text {margin: 6px 0 0; font-size: 14px; line-height: 20px;}
	
	.product_img_area .product_small_area {margin: 5px 0 0;}

	.function_area {padding: 10px;}
	.function_area .list {gap: 5px;}
	.function_area .list li {width: 100%; font-size: 14px;}

	.row_table_area .table_inner table .table_width1 {width: 140px;}
	.row_table_area .table_inner table .table_width2 {width: calc(100% - 140px);}
	.row_table_area .table_inner table .table_width3 {width: 180px;}
	.row_table_area .table_inner table .table_width4 {width: calc(100% - 180px);}
	.row_table_area .table_inner table tbody tr th {padding: 5px 2px; font-size: 14px;}
	.row_table_area .table_inner table tbody tr td {padding: 5px; font-size: 14px;}


	.color_list .list li .box {width: 150px; height: 150px;}
	.color_list .list li .box .text {font-size: 18px; line-height: 22px;}

	.board_view .board_top {padding: 10px;}
	.board_view .board_top > .title {font-size: 18px;}
	.board_view .board_top .info_list .list {column-gap: 10px;}
	.board_view .board_cont {padding: 10px;}

	
	.news_area .list {gap: 20px 10px;}
	.news_area .list li {width: calc(50% - 5px);}
	.news_area .list li .box .text_box .text {margin: 6px 0 0;}

	
	.inq_area {padding: 15px 0 0;}
	.inq_area .info_list .list {flex-wrap: wrap; gap: 5px 10px;}
	.inq_area .info_list .list li .text {padding: 0 0 0 22px; background-size: 18px 18px;}
	.inq_area .inq_list .list {gap: 5px;}
	.inq_area .inq_list .list li {width: calc(50% - 2.5px);}
	.inq_area .check_area {column-gap: 5px;}
	.inq_area .check_area .policy_btn {width: 70px; font-size: 12px; line-height: 30px;}
	.inq_area .inq_button {width: 140px; margin: 20px auto 0;}
	.inq_area .inq_button .text {padding: 0 24px 0 0;}

	.tech_area .list {flex-direction: column; gap: 10px;}
	.tech_area .list li {width: 100%;}
	.tech_area .list li .box {display: flex; justify-content: center; align-items: center; padding: 10px 5px;}
	.tech_area .list li .box .img_box img {width: 90px;}
	.tech_area .list li .box .text_box {width: 260px; margin: 0;}
	.tech_area .list li .box .text_box .title {font-size: 20px; line-height: 24px;}
	.tech_area .list li .box .text_box .text {margin: 5px 0 0; font-size: 12px; line-height: 18px;}

	.intro_area .intro_top {height: 250px; background-image: url("/kor/images/sub/intro_bg_mob.png"); background-position: right center; background-size: cover; background-attachment: inherit;}
	.intro_area .intro_top .inner .text_box {font-size: 28px; line-height: 36px;}
	.intro_area .intro_btm {flex-direction: column; margin: 15px 0 0; gap: 10px;}
	.intro_area .intro_btm .intro_left {width: 100%;}
	.intro_area .intro_btm .intro_left .since_box {width: 100%; height: 100%; padding: 15px;}
	.intro_area .intro_btm .intro_left .since_box .text {padding: 0 0 5px; font-size: 20px; line-height: 24px;}
	.intro_area .intro_btm .intro_left .since_box .year {font-size: 36px;}

	.map_area .map_info {padding: 15px;}
	.map_area .map_info .inner {flex-direction: column; align-items: inherit; gap: 15px;}
	.map_area .map_info .inner .info_list .list {flex-wrap: wrap; gap: 10px;}
	.map_area .map_info .inner .info_list .list + .list {margin: 5px 0 0;}
	.map_area .map_info .inner .btn {top: 0; transform: translateY(0);}

	
	.skill_area .skill_top {padding: 30px 0 50px;}
	.skill_area .skill_top .title_box .title {font-size: 24px; line-height: 30px;}
	.skill_area .skill_top .system_list {margin: 30px 0 0;}
	.skill_area .skill_top .system_list .list {flex-wrap: wrap; gap: 15px 0;}
	.skill_area .skill_top .system_list .list li {width: calc(50% - 5px);}
	.skill_area .skill_top .system_list .list li:nth-child(2n) {border-right: none;}
	.skill_area .skill_top .system_list .list li .box .title_area .title {font-size: 16px; line-height: 20px;}
	.skill_area .skill_top .system_list .list li .box .title_area .img img {width: 32px;}
	.skill_area .skill_top .system_list .list li .box .text_box {margin: 6px 0 0;}
	.skill_area .skill_btm {margin: 30px 0 0;}
	.skill_area .skill_btm .skill_list .list {flex-wrap: wrap; gap: 15px;}
	.skill_area .skill_btm .skill_list .list li {width: calc(50% - 7.5px);}
	.skill_area .skill_btm .skill_list .list li .box .num_box {padding: 0 0 10px;}
	.skill_area .skill_btm .skill_list .list li .box .num_box:before {height: 2px;}
	.skill_area .skill_btm .skill_list .list li .box .num_box .num {font-size: 16px; line-height: 20px;}
	.skill_area .skill_btm .skill_list .list li .box .text_box {margin: 6px 0 0;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .title {font-size: 16px; line-height: 20px;}

	.history_area .history-top-wrap {height: 240px; background-image: url("/kor/images/sub/history_bg_mob.png"); background-position: right -150px center; background-attachment: inherit;}
	.history_area .history-top-wrap .history-top-con .text_box {font-size: 24px; line-height: 30px;}


	.mt110 {margin-top: 40px !important;}
	.mt80 {margin-top: 20px !important;}

}
@media screen and (max-width: 480px) {

	.row_table_area .table_inner table .table_width3 {width: 140px;}
	.row_table_area .table_inner table .table_width4 {width: calc(100% - 140px);}

	.row_table_area .table_inner table .table_width1 {width: 115px;}
	.row_table_area .table_inner table .table_width2 {width: calc(100% - 115px);}
	.row_table_area .key_area {flex-direction: column; align-items: end; gap: 5px;}
	
	.mt80 {margin-top: 10px !important;}

	.icon_area .list li .box {flex-direction: column; border-radius: 20px;}
	.icon_area .list li .box .title_box {justify-content: center; width: 100%;  border-radius: 0;} 
	.icon_area .list li .box .text_box {width: 100%; padding: 5px 10px; text-align: center;} 
	.icon_area .list li .box .text_box .text {justify-content: center;}

	.icon_area.sky .list li .box .title_box {width: 100%;}
	.icon_area.sky .list li .box .text_box {width: 100%;}

	.color_list .list {gap: 5px;}
	.color_list .list li {width: calc(50% - 2.5px);}
	.color_list .list li .box {width: 100%; height: 80px; border-radius: 0;}
	.color_list .list li .box .text {font-size: 16px; line-height: 20px;}

	.sch_area {max-width: 100%;}
	.news_area .list {gap: 10px;}
	.news_area .list li .box .text_box .text {-webkit-line-clamp: 4;}

	.tech_area .list li .box {display: block;}
	.tech_area .list li .box .img_box img {width: 80px;}
	.tech_area .list li .box .text_box {width: 100%; margin: 10px 0 0;}

	.intro_area .intro_top {height: 200px;}

	.map_area .map_box {padding: 0;}
	.map_area .map_box .map_inner {position: inherit; left: inherit; top: inherit; transform: translate(0, 0)}
	.map_area .map_box .map_inner #map1 {height: 250px;}
	.map_area .map_box .map_inner #map1 .name {padding: 10px 20px; font-size: 14px;}
	.map_area .map_info {padding: 10px;}
	.map_area .map_info .inner .info_list .list li {width: 100%;}
	.map_area .map_info .inner .info_list .list li .box {flex-direction: column; gap: 5px;}
	.map_area .map_info .inner .btn {width: 100px; line-height: 30px;}

	.skill_area .skill_top .system_list {margin: 20px 0 0;}
	.skill_area .skill_top .system_list .list {gap: 0;}	
	.skill_area .skill_top .system_list .list li {width: 100%; padding: 15px 0; border-right: none; border-bottom: 1px solid #9ca2b7;}
	.skill_area .skill_btm .skill_list .list {gap: 20px;}
	.skill_area .skill_btm .skill_list .list li {width: 100%}
	.skill_area .skill_btm .skill_list .list li .box .num_box .num {line-height: 1;}
	.skill_area .skill_btm .skill_list .list li .box .text_box .title br {display: none;}

	.history_area .container2 {padding: 0 10px;}
	.history-percent-bar {display: none;}
	.history_area .history-top-wrap {margin: 0 0 40px;}
	.history-con .history-year-group-box {padding-left: 0; padding-bottom: 0;}
	.history-con .history-year-group-box:not(.reverse) .history-year-group-tit-box {padding-right: 0;}
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box {padding-left: 10px;}
	.history-con .history-year-group-box.reverse .history-year-list-box {margin: 10px 0 0; padding-right: 0; padding-left: 10px;}
	.history-con .history-year-group-box.reverse .history-year-list-box .history-year-item:before {top: 7px; left: -10px;width: 4px; height: 4px; }
	.history-con .history-year-group-box:not(.reverse) .history-year-list-box .history-year-item:before {width: 4px; height: 4px; top: 7px; left: -10px;}
	.history-con .history-year-group-box .history-year-group-tit-box .history-year-group-tit {font-size: 24px;}
	.history-con .history-year-list-box {padding-top: 0 !important; margin: 10px 0 0 !important;}
	.history-con .history-year-list-box .history-year-item {margin-bottom: 15px;}
	.history-con .history-year-list-box .history-year-item .history-year {margin-bottom: 5px; font-size: 18px; line-height: 20px;}
	.history-con .history-month-box .history-detail-txt {padding: 0 0 0 24px; font-size: 14px;}
}