.color{color: #18a2e2 !important;}
.center {text-align:center;}
.inner_sub{max-width: 1280px; margin: 0 auto; width: 100%;}

.line_p{color: #18a2e2; position: relative; z-index: 1; font-weight: 800}
.line_p::before{content: ''; width: 100%; height: 15px; background: #efefef; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%); z-index: -1;}

.page_locat{width: 100%; transform: translateY(-40px);}
.page_locat ul{display: flex; justify-content: flex-end; align-items: center;}
.page_locat ul li{font-size: 16px; font-weight: 400; color: #4f4f4f; position: relative;  font-family: 'Pretendard Variable';}
.page_locat ul li a{font-size: 16px; font-weight: 400; color: #4f4f4f;  font-family: 'Pretendard Variable';}
.page_locat ul li:last-child{font-weight: 700;}
.page_locat ul li:not(:last-child){margin-right: 15px; padding-right: 15px;}
.page_locat ul li:not(:last-child)::after{content: '▶'; color: #969696; font-size: 13px; position: absolute; right: -6px; top: 50%; transform: translateY(-50%);}


.sub_page{margin: 0px 0 160px;}

.sub_tit_top{margin: 0 auto 50px !important; text-align: center; width: 100%;}
.sub_title {font-size:30px; line-height:40px; font-weight:800; display:inline-block; font-family: 'Pretendard Variable';}
.sub_title_eng{color: #363636; font-size: 17px; font-weight: 300; padding-bottom: 5px;  font-family: 'Pretendard Variable';}
.sub_tit_top > p{padding-top: 20px; color: #303030;}

.sub_page .dot{width: 12px !important; height: 12px !important; border-radius: 100%; background: #2b4e97; display: inline-block;}

@media screen and (max-width : 1800px) {
   .sub_page{margin: 0px 0 80px;}
}
@media screen and (max-width : 1300px) {
   .inner_sub{padding: 0 20px;}
}
@media screen and (max-width : 1200px) {
	.page_locat{width: 100%; transform: translateY(0px);}
	.page_locat ul{justify-content: flex-end;}
	.sub_page:last-child{margin: 80px 0 80px;}

	.sub_title {font-size:22px; line-height:35px;}
	.sub_title_eng{font-size:15px;}
	.sub_tit_top{margin: 0 auto 30px !important;}
	.page_locat ul li,
	.page_locat ul li a{font-size: 14px;}
	.page_locat ul li:not(:last-child)::after{font-size: 11px;}
}
@media screen and (max-width : 768px) {
	.page_locat ul li,
	.page_locat ul li a{font-size: 12px;}
	.page_locat ul li:not(:last-child)::after{font-size: 9px;}
	.page_locat ul{display: flex;  justify-content: center;}
}

.sub_page .intro_banner{height: 300px; border-radius: 0; display: flex; align-items: center; justify-content: center; padding: 30px; margin-bottom: 30px 140px 30px 30px; text-align: center;}
.sub_page .intro_banner p{color: #fff;}
  
.sub_page .intro_banner.about{background: url(../img/company/about_bg_img.png) no-repeat; background-size: cover; background-position: center; height: 200px;}
.sub_page .intro_banner.greet{background: url(../img/company/greet_bg_img.png) no-repeat; background-size: cover; background-position: center;}
.sub_page .intro_banner.history{background: url(../img/company/history_bg_img.png) no-repeat; background-size: cover; background-position: center;}
.sub_page .intro_banner.way{background: url(../img/company/way_bg_img.png) no-repeat; background-size: cover; background-position: center;}

.sub_page .intro_banner.product01{background: url(../img/company/product_bg_img01.png) no-repeat; background-size: cover; background-position: center;}

@media screen and (max-width : 1000px) {
    .sub_page .intro_banner{height: 250px; padding: 20px;}
}
@media screen and (max-width : 768px) {
    .sub_page .intro_banner{height: 180px;}
    .sub_page .intro_banner{border-radius: 0;}
}

/* 회사개요 */
.sub_page.about{width : 100%; background: url(../img/company/about_intro_bg.png) no-repeat; background-size: cover; background-position: center; margin-top: -80px; /* transform: translateY(-80px);*/ position: relative; z-index: -1; padding: 160px 0 150px;}
.about_txt{text-align: center;}
.about_txt h2{padding-bottom: 10px;}
.about_txt p{padding-top: 70px;}

.box_three_flex{margin-top: 70px;}
.box_three_flex ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.box_three_flex ul li{width: 30%; text-align: center;}
.box_three_flex ul li img{display: inline-block; margin-bottom: 30px; max-width: 80%; height: 65px;}
.box_three_flex ul li p{border-top: 1px solid #c8c8c8; padding: 30px 0 15px;}
.box_three_flex ul li span{color: #8a8a8a; display: blocl;}



.flex_bsn{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding-top:100px}
.flex_bsn li{width: calc(50% - 20px);}
.flex_bsn li.txt{padding: 0 8%;}
.flex_bsn li.txt p{padding: 30px 0 40px;}
.flex_bsn li.txt span{display: block;}
.flex_bsn li.txt span a{display: inline-block; border: 1px solid #18a2e2; box-sizing: border-box; transition: .25s; padding: 3px 12px; margin-left: 10px;}
.flex_bsn li.txt span a:hover{background: #18a2e2; color: #fff !important;}

.swiper_business{position: relative;}
.swiper_business .swiper-slide img{width: 100%;}
.swiper_business .swiper-button-next,
.swiper_business .swiper-button-prev{background: #fff; width: 40px; height: 40px; border-radius: 100%; position: absolute; top: 50%; transform: translateY(-50%); z-index: 99; color: #000; text-align: center; line-height: 40px; font-size: 18px;box-shadow: 4px 5px 20px 0px #56565640;}
.swiper_business .swiper-button-next:hover,
.swiper_business .swiper-button-prev:hover{background: #18a2e2; color: #fff;}
.swiper_business .swiper-button-next{right: 10px;}
.swiper_business .swiper-button-prev{left: 10px;}


/* 회사연혁 */
.sub_page.history{width : 100%; background: url(../img/company/history_bg.png) no-repeat; background-size: cover; background-position: top center; padding: 100px 0 120px;}

.history_box{width: 100%; display: flex; flex-wrap: wrap;}
.history_box .tab_hist{width: 20%; font-family: 'Pretendard Variable'}
.history_box .show_hist{width: 80%;}

.history_box .tab_hist ul{display: flex; flex-direction: column; align-items: flex-start;}
.history_box .tab_hist ul li{font-size: 22px; font-weight: 800; color: #9b9b9b; cursor: pointer; display: inline-block; margin-bottom: 15px;}
.history_box .tab_hist ul li.on{color: #18a2e2; position: relative;}
.history_box .tab_hist ul li.on::before{content: ''; width: 100%; height: 15px; background: #efefef; position: absolute; bottom: -5px; left: 50%; transform: translateX(-50%); z-index: -1;}

.history_box .show_hist .hist_ctt{position: relative; display: none;}
.history_box .show_hist .hist_ctt.on{display: block;}
.history_box .show_hist .hist_ctt::after{content: ""; width: 1px; height: 100%; background-color: #cfcfcf; position: absolute; top: 50%; transform: translateY(-50%);  left: 30px; z-index: 1;}
.history_box .show_hist .hist_ctt li{position: relative; color: #303030;}
.history_box .show_hist .hist_ctt li span{width: 60px; height: 30px; line-height: 30px; text-align: center; font-size: 18px; background: #fff; font-family: 'Pretendard Variable'; font-weight: 600; border-radius: 5px; box-shadow: 4px 7px 12px 0px #5e5e5e30; position: absolute; left: 0; top: 0; z-index: 2}
.history_box .show_hist .hist_ctt li:not(:last-child){margin-bottom: 30px;}
.history_box .show_hist .hist_ctt li b{margin: 0 5px 0 20px; color: #18a2e2; padding-left: 80px;}
.history_box .show_hist .hist_ctt li b.b_n {margin: 0 5px 0 25px; }

/* 인사말 */
.sub_page.greet{padding-top: 100px;}
.intro_txt{display: flex; flex-wrap: wrap; margin: 30px auto 150px;}
.intro_txt > div:nth-child(1){width: 235px;}
.intro_txt > div:nth-child(2){width: calc(100% - 235px); padding-left: 80px;}

.intro_txt > div:nth-child(1) h2{display: inline-block; width: 235px; height: 235px; background: #18a2e2; color: #fff; text-align: center; line-height: 235px; transform: translateY(-80px);}
.intro_txt > div:nth-child(2) p{padding-top: 40px; line-height: 190% !important; color: #363636;}
.intro_txt > div:nth-child(2) p b{font-weight: 500;}
.intro_txt > div:nth-child(2) p b.line_p{font-weight: 800;}
.intro_txt > div:nth-child(2) span{display: block; color: #363636; padding-top: 35px;}



/* 찾아오시는 길 */
.intro_txt.way > div:nth-child(1){width: 40%;}
.intro_txt.way > div:nth-child(2){width: 60%; padding-left: 80px;}

.sub_page .map_wrap{width: 100%;}
.sub_page .map_wrap iframe{width: 100%;}

.way_list{transform: translateY(-80px); background: #18a2e2; width: 100%; min-height: 260px;display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-direction: column; padding: 0 40px; border-radius: 5px; box-shadow: 4px 5px 18px 2px #56565640}
.way_list li{color: #fff; display: flex; align-items: center; width: 100%; padding: 8px 0; align-items: flex-start;}
.way_list li span{display: inline-block; padding: 0 5px; }
.way_list img {display:inline}
.way_list li:last-child span {min-width:100px}

.intro_txt.way > div:nth-child(2) .flex{display: flex; align-items: center; margin-top: 30px;}
.intro_txt.way > div:nth-child(2) .flex h4{text-align: left; margin-right:50px; min-width:150px}
.intro_txt.way > div:nth-child(2) .flex ul li{padding: 5px 0; }

@media screen and (max-width : 1200px) {
    .intro_txt > div:nth-child(1){width: 180px;}
	.intro_txt > div:nth-child(2){width: calc(100% - 180px); padding-left: 50px;}
	.intro_txt > div:nth-child(1) h2{width: 180px; height: 180px; line-height: 180px;}

	.intro_txt.way > div:nth-child(1){width: 95%; margin: 0 auto;}
	.intro_txt.way > div:nth-child(2){width: 95%; margin:0 auto; padding-left:0px}
	.way_list{transform: translateY(-50px);}

	.flex_bsn li.txt{padding: 0 4%;}
	.flex_bsn li.txt p{padding: 12px 0 30px;}

	.history_box .tab_hist{width: 100%;}
	.history_box .show_hist{width: 100%; margin-top: 40px;}

	.history_box .tab_hist ul{display: flex; flex-direction: row; align-items: center; justify-content: center;}
	.history_box .show_hist .hist_ctt li span{width: 50px; font-size: 16px;}
	.history_box .show_hist .hist_ctt li b{padding-left: 45px;}
	.history_box .tab_hist ul li:not(:last-child){margin-right: 15px;}
	
}
@media screen and (max-width : 950px) {
    .intro_txt div:nth-child(1){width: 100%; margin-bottom: 0px;}
    .intro_txt div:nth-child(2){width: 100%; padding-left: 0px; transform: translateY(-20px); margin-top:60px  !important}
	.intro_txt > div:nth-child(1) h2{width: 150px; height: 150px; line-height: 150px; transform: translateY(-50px); font-size: 20px !important;}
	.intro_txt > div:nth-child(2) p{padding-top: 0;}

	.sub_page .map_wrap iframe{width: 100%; height: 250px;}
	.way_list{padding: 10px 20px; min-height: auto; }
	.intro_txt.way > div:nth-child(2) .flex h4{margin-right: 30px;}
	
	
	.intro_txt.way > div:nth-child(2) .flex h4{min-width:130px}

}
@media screen and (max-width : 768px) {
.way_list li:last-child span {min-width:80px}
    .box_three_flex ul li{width: 100%; margin-bottom: 20px; padding: 10px 20px;}
	.box_three_flex ul li img{margin-bottom: 15px;}
	.box_three_flex ul li p{padding: 15px 0 10px;}

	.intro_txt.way > div:nth-child(2){transform: translateY(-97px);}
	.intro_txt.way > div:nth-child(2) .flex{flex-direction: column; align-items: flex-start;}
	.intro_txt.way > div:nth-child(2) .flex h4{padding-bottom: 10px;}
	.intro_txt.way > div:nth-child(2) .flex h4 br{display: none;}

	.flex_bsn li{width: calc(100%);}
	.flex_bsn li.txt{padding: 0 20px; text-align: center; padding-bottom: 20px}
	.flex_bsn li.txt p{padding: 12px 0 20px;}
	.flex_bsn:nth-child(2) li:nth-child(1){order: 2}
	.flex_bsn:nth-child(2) li:nth-child(2){order: 1; margin-top: 60px;}

	.history_box .show_hist .hist_ctt::after{left: -5px;}
	.history_box .show_hist .hist_ctt li{padding-top: 40px;}
	.history_box .show_hist .hist_ctt li span{left: -10px;}
	.history_box .show_hist .hist_ctt li b{padding-left: 0; margin: 0 5px 0 0px;}
	
.history_box .show_hist .hist_ctt li b.b_n {display:none}	

.intro_txt {margin:30px auto 30px}
}


.swiper-button-next, .swiper-button-prev {
    svg{display:none}


/* 기술소개 *//* 사업영역 */
.tech_area{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.tech_area .tech_intro{width: 48%;}
.tech_area .tech_intro .img_wrap{width: 100%; padding: 80px 20px 20px 20px; overflow: hidden; margin-bottom: 30px;}
.tech_area .tech_intro .img_wrap span{color: #fff;}
.tech_area .tech_intro:nth-child(1) .img_wrap{background: url(../img/company/tech_img01.png) no-repeat; background-size: cover; background-position: center;}
.tech_area .tech_intro:nth-child(2) .img_wrap{background: url(../img/company/tech_img02.png) no-repeat; background-size: cover; background-position: center; border-radius: 0 85px 85px 0;}


.tech_area .tech_list ul{display: flex; flex-wrap: wrap; justify-content: space-between;}
.tech_area .tech_list ul li{width: 31%; margin-bottom: 60px;}
.tech_area .tech_list ul li img{width: 100%; overflow: hidden; border-left: 4px solid #2b4e97; box-sizing: border-box;}
.tech_area .tech_list ul li h4{padding: 20px 20px 10px;}
.tech_area .tech_list ul li h4 b{color: #3c60c9;}
.tech_area .tech_list ul li p{color: #303030; padding: 0 20px;}
.tech_area .tech_list ul li:nth-child(3n) img{border-radius: 0 160px 160px 0;}

.tech_area .tech_table{width: 100%;}
.tech_area .tech_table table{width: 100%; text-align: center; border-collapse : collapse; border-spacing : 0}
.tech_area .tech_table table tr th:last-child{border-radius: 0 30px 30px 0;}
.tech_area .tech_table table caption{display: none;}
.tech_area .tech_table table tr th,
.tech_area .tech_table table tr td{padding: 20px 10px;}
.tech_area .tech_table table tr th{font-size: 20px; font-weight: bold; background: #f7f8f8; color: #3c60c9; border-right: 1px solid #fff; box-sizing: border-box;}
.tech_area .tech_table table tr td{font-size: 18px; border-right: 1px solid #f7f8f8; box-sizing: border-box; border-bottom: 1px solid #f7f8f8;}
.tech_area .tech_table table tr:last-child td{border-bottom: 2px solid #3c60c9; }

.tech_area .tech_table table tr th:last-child,
.tech_area .tech_table table tr td:last-child{border-right: 0;}

.tech_area .sub_tit_top .sub_tit.line{position: relative;}
.tech_area .sub_tit_top .sub_tit.line::after{content: ""; position: absolute; }


/* 사업영역 */
.tech_area.business .tech_intro{width: 46%;}
.tech_area.business .tech_intro:nth-child(1n + 3){margin-top: 100px;}
.tech_area.business .tech_intro:nth-child(1) .img_wrap{background: url(../img/company/business_img01.png) no-repeat; background-size: cover; background-position: center;}
.tech_area.business .tech_intro:nth-child(2) .img_wrap{background: url(../img/company/business_img02.png) no-repeat; background-size: cover; background-position: center; border-radius: 0 85px 85px 0;}
.tech_area.business .tech_intro:nth-child(3) .img_wrap{background: url(../img/company/business_img03.png) no-repeat; background-size: cover; background-position: center;}
.tech_area.business .tech_intro:nth-child(4) .img_wrap{background: url(../img/company/business_img04.png) no-repeat; background-size: cover; background-position: center; border-radius: 0 85px 85px 0;}

@media screen and (max-width:1020px){
    .tech_area .tech_intro{width: 100%;}
    .tech_area .tech_intro:nth-child(1){margin-bottom: 60px;}
    .tech_area .tech_intro:nth-child(2) .img_wrap{border-radius: 0;}
    
    .tech_area .tech_list ul li{width: 48%;}
    .tech_area .tech_list ul li:nth-child(3n) img{border-radius: 0 0px 0px 0;}
    .tech_area .tech_list ul li:nth-child(2n) img{border-radius: 0 160px 160px 0;}

    .tech_area.business .tech_intro{width: 100%;}
    .tech_area.business .tech_intro:nth-child(1n + 2){margin-top: 50px;}
    .tech_area.business .tech_intro:nth-child(2) .img_wrap,
    .tech_area.business .tech_intro:nth-child(4) .img_wrap{border-radius: 0;}
}
@media screen and (max-width:1000px){
    .tech_area .tech_table table tr th{font-size: 17px;}
    .tech_area .tech_table table tr:nth-child(even) td{font-size: 16px;}
    .tech_area .tech_table table tr:nth-child(odd) td{font-size: 16px;}
}
@media screen and (max-width:650px){
    .tech_area .tech_list ul li{width: 100%;}
    .tech_area .tech_list ul li:nth-child(2n) img{border-radius: 0 0px 0px 0;}
}







/* product css */
.sub_page.product .product_txt > p{padding: 30px 0 0;}


.sub_page.product .tech_table{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 50px;}
.sub_page.product .tech_table table{width: 49%; text-align: center; border-collapse : collapse; border-spacing : 0}
.sub_page.product .tech_table table:nth-child(2) tr th:last-child{border-radius: 0 30px 30px 0;}
.sub_page.product .tech_table table caption{display: none;}
.sub_page.product .tech_table table tr th,
.sub_page.product .tech_table table tr td{padding: 20px 10px;}
.sub_page.product .tech_table table tr th{font-size: 20px; font-weight: bold; background: #f7f8f8; color: #3c60c9; border-right: 1px solid #fff; box-sizing: border-box;}
.sub_page.product .tech_table table tr td{font-size: 17px; border-right: 1px solid #f7f8f8; box-sizing: border-box; border-bottom: 1px solid #f7f8f8; line-height: 160%;}
/* .sub_page.product .tech_table table tr:last-child td{border-bottom: 2px solid #3c60c9; } */

.sub_page.product .tech_table table tr th:last-child,
.sub_page.product .tech_table table tr td:last-child{border-right: 0;}

.sub_page.product .tech_table table tr td:first-child{font-weight: bold;}

.sub_page.product .tech_table span.notice{width: 100%; display: block; text-align: right; color: #8a8a8a; padding: 15px 0;}


@media screen and (max-width : 1200px) {
    .sub_page.product .tech_table table{width: 100%;}
    .sub_page.product .tech_table table:not(:first-child){margin-top: 40px;}

    .sub_page.product .tech_table table tr th{font-size: 18px;}
    .sub_page.product .tech_table table tr td{font-size: 15px;}
}
@media screen and (max-width : 768px) {
    .sub_page.product .tech_table table tr th{font-size: 17px;}
    .sub_page.product .tech_table table tr td{font-size: 14px;}
}



/* product_설명 flex */
.sub_page.product .product_flex{margin-bottom: 100px;}
.sub_page.product .product_flex ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sub_page.product .product_flex ul > li:first-child{width: 40%;}
.sub_page.product .product_flex ul > li:last-child{width: 53%;}
.sub_page.product .product_flex ul li img{max-width: 100%; }

.sub_page.product .product_flex ul > li > p{padding-top: 20px;}
.sub_page.product .product_flex ul li h3{padding-top: 28px; position: relative;}
.sub_page.product .product_flex ul li h3.circular::before{content: ""; width: 50px; height: 50px; border-radius: 100%; border: 2px solid #1d2c68; position: absolute; top: 0; left: -15px;}
.sub_page.product .product_flex ul li h3.square::before{content: ""; width: 50px; height: 50px; border: 2px solid #1d2c68; position: absolute; top: 0; left: -15px;}
.sub_page.product .product_flex ul li h3.angle::before{content: ""; width: 50px; height: 50px; border: 2px solid #1d2c68; position: absolute; top: 0; left: -15px; border-right: 0; border-bottom: 0;}
.sub_page.product .product_flex ul li h3.duct::before{content: ""; width: 50px; height: 50px; border: 2px solid #1d2c68; position: absolute; top: 0; left: -15px; border-radius: 30px 0 0 0;}

.sub_page.product .product_flex ul > li:last-child .flex_adv{margin-top: 50px;}
.sub_page.product .product_flex ul > li:last-child .flex_adv li{width: 23%; text-align: center; background: #fff; border-radius: 30px; box-shadow: 0px 4px 6px #0000001c; height: 200px; display: flex; flex-direction: column; justify-content: center; position: relative; padding: 0 12px;}
.sub_page.product .product_flex ul > li:last-child .flex_adv li p{color: #1d2c68;}
.sub_page.product .product_flex ul > li:last-child .flex_adv li span{width: 30px; height: 30px; display: inline-block; text-align: center; line-height: 30px; background: #1d2c68; color: #fff; border-radius: 100%; position: absolute; bottom: -15px; left: 50%; transform: translateX(-50%);}


/* two */
.sub_page.product .product_flex ul.two{align-items: flex-start;}
.sub_page.product .product_flex ul.two li{margin-bottom: 60px; width: 48%;}
.sub_page.product .product_flex ul.two li:nth-child(2n) img{border-radius: 0 150px 150px 0; overflow: hidden;}
.sub_page.product .product_flex ul.two li img{height: 240px; max-width: 100%; object-fit: cover;}
.sub_page.product .product_flex ul.two li img{margin-bottom: 30px;}

.sub_page.product .product_flex > span{text-align: right; display: block; width: 100%; color: #8a8a8a;}

@media screen and (max-width : 1400px) {
    .sub_page.product .product_flex ul li:nth-child(2) > p br.none{display: none;}
    .sub_page.product .product_flex ul > li:last-child .flex_adv{margin-top: 20px;}
}
@media screen and (max-width : 1200px) {
    .sub_page.product .product_flex ul > li:first-child{width: 100%; margin-bottom: 30px;}
    .sub_page.product .product_flex ul > li:last-child{width: 100%;}

	.sub_page.product .product_flex ul.two li{width: 100%;}
}
@media screen and (max-width : 650px) {
    .sub_page.product .product_flex ul > li:last-child .flex_adv li{width: 48%;}
}

.sub_page.product .box_flex{display: flex; flex-wrap: wrap;}
.sub_page.product .box_flex.between{justify-content: space-between;}
.sub_page.product .box_flex h4{padding-bottom: 20px;}


/* product_box */
.sub_page.product .product_box{margin-top: 100px;}
.sub_page.product .product_box ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sub_page.product .product_box ul li{width: 32%; height: 600px; color: #fff; padding: 30px 20px; display: flex; flex-direction: column; justify-content: flex-end;}
.sub_page.product .product_box ul li p{padding-bottom: 10px;}
.sub_page.product .product_box ul li:nth-child(1){background: url(../img/product/product01_img01.png) no-repeat; background-size: cover; background-position: center;}
.sub_page.product .product_box ul li:nth-child(2){background: url(../img/product/product01_img02.png) no-repeat; background-size: cover; background-position: center;}
.sub_page.product .product_box ul li:nth-child(3){background: url(../img/product/product01_img03.png) no-repeat; background-size: cover; background-position: center;}

@media screen and (max-width : 1200px){
    .sub_page.product .product_box ul li{height: 400px;}
}
@media screen and (max-width : 1000px){
    .sub_page.product .product_box ul li{width: 100%; height: auto; padding: 60px 20px 20px 20px;}
    .sub_page.product .product_box ul li:not(:last-child){margin-bottom: 20px;}
}


.sub_page.product .product_list{margin-top: 100px;}
.sub_page.product .product_list ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sub_page.product .product_list ul li{width: 19%; text-align: center; border-bottom: 1px solid #1d2c68; box-sizing: border-box; margin-bottom: 20px;}
.sub_page.product .product_list ul li h5{background: #1d2c68; color: #fff; padding: 40px 10px; position: relative;}
.sub_page.product .product_list ul li h5::after{content: ""; width: 20px; height: 20px; border-radius: 100%; background: #1d2c68; position: absolute; bottom: -8px; left: 50%; transform: translateX(-50%);}
.sub_page.product .product_list ul li p{padding: 40px 20px 30px;}

@media screen and (max-width : 1200px){
    .sub_page.product .product_list ul li{width: 32%;}
}
@media screen and (max-width : 768px){
    .sub_page.product .product_list ul li{width: 49%;}
}
@media screen and (max-width : 500px){
    .sub_page.product .product_list ul li{width: 100%;}
}

.sub_page.business .tech_tab{width: 100%; display: flex; flex-wrap: wrap;}
.sub_page.business .tech_tab .tech_list{width: calc(42% - 20px); height: 600px; margin-right: 20px; display: flex; flex-wrap: wrap; flex-direction: column; justify-content: space-between;}
.sub_page.business .tech_tab .tech_show{width: 58%; height: 600px;}

.sub_page.business .tech_tab .tech_list li{width: 100%; height: 10%; background: #f6f6f6; padding: 0 40px; position: relative; display: flex; align-items: center; cursor: pointer;}
.sub_page.business .tech_tab .tech_list li b{color: #3c60c9; padding-right: 5px; font-weight: bold;}
.sub_page.business .tech_tab .tech_list li span{position: absolute; right: 40px; top: 50%; transform: translateY(-50%) rotate(90deg); color: #1d2c68; transition: .25s;}
.sub_page.business .tech_tab .tech_list li.on{background: #1d2c68; color: #fff;}
.sub_page.business .tech_tab .tech_list li.on b{color: #fff;}
.sub_page.business .tech_tab .tech_list li.on span{color: #fff; transform: rotate(0) translateY(-50%);}

.sub_page.business .tech_tab .tech_show li{width: 100%; height: 100%; position: relative; display: none; transition: .25s;}
.sub_page.business .tech_tab .tech_show li img{position: absolute; width: 100%; height: 100%; object-fit: cover; left: 0; top: 0;}
.sub_page.business .tech_tab .tech_show li p{background: #ffffff7e; padding: 20px 10px; text-align: center; position: absolute; bottom: 0; left: 0; width: 100%;}
.sub_page.business .tech_tab .tech_show li.on{display: block;}

@media screen and (max-width : 1200px){
    .sub_page.business .tech_tab .tech_list{width: calc(42% - 20px); height: 500px;}
    .sub_page.business .tech_tab .tech_show{width: 58%; height: 500px;}
    
    .sub_page.business .tech_tab .tech_list li{padding: 0 20px; font-size: 18px;} 
    .sub_page.business .tech_tab .tech_list li span{right: 20px;}
    
    .sub_page.business .tech_tab .tech_show li p{font-size: 18px;}
}
@media screen and (max-width : 768px){
    .sub_page.business .tech_tab .tech_list{width: 100%; margin-right: 0; height: auto; flex-direction: row;} 
    .sub_page.business .tech_tab .tech_list li{padding: 10px 20px; width: 50%; height: auto; font-size: 16px; border: 1px solid #fff; box-sizing: border-box;}
    .sub_page.business .tech_tab .tech_show{width: 100%; height: 400px; margin-top: 20px;}
    .sub_page.business .tech_tab .tech_list li span{display: none;}
    
    .sub_page.business .tech_tab .tech_show li p{font-size: 17px;}
}
@media screen and (max-width : 500px){
    .sub_page.business .tech_tab .tech_list li{width: 100%; padding: 5px 20px;}
}