.inner {max-width: 1600px; margin: 0 auto;}
.s_wrap {display: flex;}

/*서브타이틀*/
.title {padding: 75px 0 0;}
.tit_h2 {font-size: 44px; line-height: 140%; font-weight: 700; color: #222; word-break: keep-all;}
.title .tit_ul {display: flex; flex-wrap: wrap; margin-top: 30px;}
.title .tit_ul li {display: flex; padding-right: 30px;}
.title .tit_ul li a {font-size: 22px; font-weight: 500; color: #0669bf;position: relative;}
.title .tit_ul li a:after {content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background-color:#0669bf;transition:all .2s ease;}
.title .tit_ul li:hover a:after{width:100%;}

.sub-bg {width: 100%; overflow: hidden; height: 60vh; margin-top: 30px;position: relative;}
.sub-bg .subbg-img {width: 100%; height: 100%; display: inline-block;}
#subbg1 .subbg-img {background: url(subbg01.png)no-repeat top center/cover;}
#subbg2 .subbg-img {background: url(subbg02.png)no-repeat top center/cover;}
#subbg3 .subbg-img {background: url(subbg03.png)no-repeat top center/cover;}
.sub-bg .subbg-img {transition: all 0.4s ease-in-out;}
.sub-bg.scroll .subbg-img {height: 70vh;}
.sub-bg > .inner{position:absolute;width:100%;height:100%;top: 0; left: 50%;transform: translateX(-50%);padding: 0 20px;max-width:1600px;}
.sub-visual-scroll{color:#fff;font-size:16px;font-family:'Proxima' , sans-serif;font-weight:500px;width:40px;text-align:center;position:absolute;bottom:60px;}
.sub-visual-scroll .arrow{display:inline-block;transform: translateY(0);animation: bounce 1600ms infinite cubic-bezier(0.445, 0.05, 0.55, 0.95);-webkit-animation: bounce 1600ms infinite cubic-bezier(0.445, 0.05, 0.55, 0.95);-moz-animation: bounce 1600ms infinite cubic-bezier(0.445, 0.05, 0.55, 0.95);opacity:1;}
.sub-visual-scroll .arrow:after{content:"";display:inline-block;width:8px;height:8px;border-right:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(45deg);}

@keyframes bounce {
    20% {transform: translateY(12px);opacity:0.6;}
    40% {transform: translateY(6px);opacity:0.8;}
    60% {transform: translateY(12px);opacity:0.6;}
    100% {transform: translateY(0px);opacity:1;}
}

@-webkit-keyframes bounce {
    20% {transform: translateY(12px);opacity:0.6;}
    40% {transform: translateY(6px);opacity:0.8;}
    60% {transform: translateY(12px);opacity:0.6;}
    100% {transform: translateY(0px);opacity:1;}
}

.sub_box.sub-cont {padding: 0;}

/*서브페이지 서브왼쪽메뉴*/
.left {position: relative;}
.left-menu-wrap {position: sticky; width: 100%; top: 15%;}
.left-menu li {display: block; text-align: left; line-height: 50px; transition: padding 0.3s ease-in-out;}
.l-menu .left-menu li:hover {padding-left: 6px;}
.left-menu-item {display: block; color: #a8a8a8;}
.left-menu-item:hover, .isactive {color: #0669bf; font-weight: 500;}

/*서브페이지 서브내용-큰레이아웃*/
.right {}
.sub_boxwrap {}
.sub_boxwrap section {margin-bottom: 100px;}
.sub01_box, .sub03_box {margin-bottom: 70px; display: flex; flex-wrap: wrap;}
/*서브페이지 서브내용-이미지*/
.sub01_map {width: 100%; margin-bottom: 30px;}
.sub02_img {margin-bottom: 30px; width: 100%; display: flex; justify-content: center; align-items: center;}
.sub01_img, .sub03_img {width: 100%; height: 400px; margin-bottom: 30px;}
#section-1 .sub01_img {background: url(../img/sub01_img01.png)no-repeat top center/cover;}
#section-2 .sub01_img {background: url(../img/sub01_img02.png)no-repeat top center/cover;}
#section-3 .sub01_img {background: url(../img/sub01_img03.png)no-repeat top center/cover; height: 500px;}
#section-1 .sub03_img {background: url(../img/sub03_img01.png)no-repeat top center/cover;}
#section-2 .sub03_img {background: url(../img/sub03_img02.png)no-repeat top center/cover;}
#section-3 .sub03_img {background: url(../img/sub03_img03.png)no-repeat top center/contain; height: 500px;}
#section-5 .sub03_img {background: url(../img/sub03_img05.png)no-repeat top center/cover;}
.sub02_img img {max-width: 100%;}
/*서브페이지 서브내용-폰트*/
.tit_h3 {font-size: 32px; font-weight: 600; color: #0669bf; margin-bottom: 50px;}
.tit_h4 {font-size: 36px; color: #333; font-weight: 700; word-break: keep-all; line-height: 140%;}
.tit_h5 {font-size: 28px; color: #0669bf; font-weight: 600; word-break: keep-all; line-height: 140%;}
.tit_h6 {font-size: 23px; color: #444; font-weight: 600; word-break: keep-all; line-height: 140%; margin-bottom: 40px;}
.sub_b {color: #0669bf; font-weight: 700;}
.sub_p {font-size: 18px; color: #555; font-weight: 400; word-break: keep-all; line-height: 160%; margin-top: 25px;}
.sub_p1 {font-size: 18px; color: #222; font-weight: 500; word-break: keep-all; line-height: 160%; margin-top: 25px;}
.sub_p2 {font-size: 15px; color: #666; font-weight: 300; word-break: keep-all; line-height: 160%; margin-top: 10px;}
.sub01_box span {display: inline-block; padding-right: 50px; font-size: 20px; color: #444; line-height: 36px; font-weight: 600;}
.sub01_box span:nth-child(1) {color: #0669bf; font-weight: 700; font-size: 24px;}
/*서브페이지 서브내용-세부레이아웃*/
.sub01_text {padding: 0;}
.sub01_text1 {padding: 0 60px 0 0;}
.sub01_text2 {padding: 0 30px 0 0;}
.sub01_text3 {padding: 0 0 0 30px;}
.sub01_box li {width: 20%;}
.sub01_icon img {border-radius: 100%; box-shadow: 2px 2px 4px rgba(0,0,0,0.2);}
/*서브페이지 서브내용-table*/
.sub01_table {padding: 0;}
.sub01_table table {width: 100%;}
.sub01_table table tr:first-child {border-top: 2px solid #0669bf;}
.sub01_table table tr {border-bottom: 1px solid #dbdbdb;}
.sub01_table table tr th {font-size: 17px; font-weight: 500; color: #0669bf; padding: 15px; background: #f7f7f7; text-align: center; width: 20%;}
.sub01_table table tr td {font-size: 17px; font-weight: 400; color: #444; padding: 15px; text-align: center; word-break: keep-all;}

/*서브페이지 고객지원 왼쪽회사정보*/
.left_wrap {}
.left_wrap .left_h2 {font-size: 42px; color: #222; font-weight: 700;}
.left_wrap .left_text {margin-top: 65px;}
.left_text .left_textwrap {margin-bottom: 35px;}
.left_textwrap .left_h3 {font-size: 20px; font-weight: 700; color: #333; margin-bottom: 10px;}
.left_textwrap .left_p {font-size: 16px; color: #666; font-weight: 400;}

/*서브페이지 고객지원 오른쪽폼메일*/
.formmail_txt {font-size:16px;font-family:'Noto Sans KR';color:#333333}
.formmail_border {font-size:16px; background-color: transparent; border: none;}
.formmail_title_bgcolor {}
.formmail > tbody > tr {border-bottom: 1px solid #ddd;}
.formmail_cell_bgcolor {font-size:16px;padding: 5px;}
.table_02 {width:100%;}
.table_02 tbody {display: flex; flex-wrap: wrap; justify-content: space-between;}
.table_02 tr {border: 1px solid #d7e3ec; background-color: #f0f6fa; width: 48%; display: flex; flex-wrap: wrap; padding: 30px 0; border-radius: 10px; margin-bottom: 30px;}
.table_02 tr:nth-child(4) {width: 100%; height: 220px;}
.table_02 tr:nth-child(5) {display: none;}
.table_02 tr:nth-child(6) {display: none;}
.table_02 td {padding: 0 5px; height: 100%; display: flex; align-items: center;}
.table_02 td:nth-child(1) {padding-left: 25px; width: 30%;}
.table_02 td:nth-child(2) {width: 70%;}
.table_02 td font {font-size: 16px; color: #666; position: relative;}
.table_02 td font::after {position: absolute; content: "*"; color: #0669bf; top: 0; right: -10px; display: inline-block;}



/*서브_회사소개*/
.cont-g {padding: 40px 0;}
#sec-company .cont-g h3{
    color: #222;
    font-size: 1.8rem;
    text-align: center;
    font-weight: 700;
    margin-bottom: 40px;
    line-height: 1.5;
}
#sec-company .cont-g .imgbox {text-align: center;}
#sec-company .cont-g .imgbox img{box-shadow: 10px 12px 5px rgb(0 0 0 / 30%);}
#sec-company .cont-g h3 span{color: #eb2a2e;}

.cont-g ul li {margin-bottom: 20px;}
.cont-g ul li {margin-bottom: 20px;}
.cont-g ul li:first-child p{color: #6b1c24;}
.cont-g li p {color: #222; word-break: keep-all;}

#sec-company .cont-g > .row > div {margin-bottom: 50px;}


/*서브_제품소개*/
.imgwrap {border: 1px solid #ddd; padding: 30px; text-align: center;}
.product_intro {
  background: url(../img/bgimg.jpg) no-repeat center center;
  background-size: cover;
  padding: 50px 60px;
  color: #222;
}
.product_intro h3 {font-size: 28px; font-weight: 700; line-height: 1.5; margin-bottom: 20px;}
.product_intro > p {    
  font-size: 22px;
  word-break: keep-all;
  font-weight: 500;
  margin-bottom: 20px;
}
.redtit {
  background: #eb2a2e;
  padding: 5px 15px;
  display: inline-block;
  color: #fff!important;
  font-size: 16px;
  font-weight: 300; 
  border-radius: 8px;
  margin-bottom: 15px;
}
.introlist ul li {padding-left: 15px; margin-bottom: 10px;}
.introlist ul li p {position: relative;}
.introlist ul li p::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background: #333;
  border-radius: 3px;
  left: -12px;
  top: 10px;
}

.prod_data ul {margin-bottom: 30px;}
.prod_data ul li {padding-left: 10px; margin-bottom: 10px;}
.prod_data ul li p {color: #222!important; position: relative; line-height: 1.5;}
.prod_data ul li p::before {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background: #eb2a2e;
  border-radius: 3px;
  left: -12px;
  top: 10px;
}
.prod_data table {margin-bottom: 20px; width: 100%; text-align: center; border-top: 2px solid #222; border-bottom: 2px solid #222;}
.prod_data table tr {border-bottom: 1px solid #ddd;}
.prod_data table th, .prod_data table td {padding: 15px 0; font-size: 16px; word-break: keep-all;}
.prod_data table th {
  background: #eee;
  font-weight: 500;
  color: #222;
  letter-spacing: 5px;
}
.prod_data > p {color: #333;}
.prod_data > p.ptit {font-size: 18px; font-weight: 600; margin-bottom: 20px;}
.prod_data > p span{color: #eb2a2e; margin-right: 5px;}
.prod_data h4 {color: #333; font-size: 20px; font-weight: 600; margin: 15px 0;}

@media screen and (max-width: 1600px){
  .title {padding: 75px 20px 0;}
  .tit_h2 {font-size: 38px;}
  .tit_h3 {font-size: 28px;}
  .title .tit_ul li a {font-size: 20px;}
  
  .sub01_box span {padding-right: 10px;}
  
  .left_wrap .left_h2 {font-size: 36px;}
  .left_wrap .left_text {margin-top: 45px;}
  .table_02 tr {width: 100%;}
}

@media screen and (max-width: 1024px){
  .s_wrap {flex-wrap: wrap;}
  .title {padding: 55px 15px 0;}
  .tit_h2 {font-size: 34px;}
  .tit_h3 {margin-bottom: 20px;}
  .tit_h4 {font-size: 30px;}
  .tit_h5 {font-size: 24px;}
  .tit_h6 {font-size: 21px;}
  .title .tit_ul {margin-top: 15px;}
  
  .sub-bg {margin-top: 10px; height: 50vh;}
  .sub01_img, .sub03_img {height: 300px;}
  #section-3 .sub01_img {height: 400px;}
  
  .sub_boxwrap {margin-top: 40px;}
  .sub_boxwrap section {margin-bottom: 70px;}
  .sub01_box, .sub03_box {margin-bottom: 0;}
  .sub01_box li {width: 33.33%; padding-right: 10px; margin-bottom: 20px;}
  .sub01_text1 {padding: 0;}
  .sub01_text2 {padding: 0;}
  .sub01_text3 {padding: 0;}
  
  .left_wrap .left_text {margin: 30px 0 45px;}
  .left_text .left_textwrap {margin-bottom: 20px;}
}

@media screen and (max-width: 992px){
  .left-menu li {display: inline-block; padding-right: 50px;}
  .left-menu-item:hover, .isactive {padding: 0 40px; background: #0669bf; border-radius: 50px; color: #fff;}
}

@media screen and (max-width: 768px){
  .tit_h2 {font-size: 30px;}
  .tit_h3 {font-size: 24px;}
  .tit_h4 {font-size: 26px;}
  .tit_h5 {font-size: 20px;}
  .tit_h6 {font-size: 19px;}
  .sub_p {margin-top: 15px; font-size: 17px;}
  .title .tit_ul li {line-height: 40px;}
  .title .tit_ul li a {font-size: 18px;}
  
  .sub-bg {height: 40vh;}
  .sub01_img, .sub03_img {height: 250px;}
  #section-3 .sub01_img {height: 300px;}
  
  .sub_boxwrap section {margin-bottom: 50px;}
  .sub01_text {margin-bottom: 30px;}
  .sub01_text1 {margin-bottom: 30px;} 
  .sub01_box span {padding-right: 30px; font-size: 18px; line-height: 30px;}
  .sub01_box span:nth-child(1) {font-size: 21px;}
  .sub01_box li {width: 50%; padding-right: 0; margin-bottom: 0}

  .prod_data {margin-top: 30px;}

  
}

@media screen and (max-width: 575px){
  .sub01_box li {width: 100%; text-align: center;}
  .sub01_box span {padding-right: 0;}
  .sub01_table table tr th {width: 30%;}
  .sub01_img, .sub03_img {height: 170px;}
  #section-2 .sub01_img {background: url(../img/sub01_img02.png)no-repeat top center/contain;}
  #section-3 .sub01_img {height: 200px;}
}





/*메인-포트폴리오 모달창*/
.main_modal {background: rgba(0,0,0,0.4); position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 9999999; display: none;}
.main_modal.show {display: block;}
.main_modal .modal_wrap {max-width: 1024px; margin: 0 auto; vertical-align: middle;}
.main_modal .modal_wrap .modal_bg {background: #fff; padding: 60px; position: relative;}
.modal_bg .bi {font-size: 20px; color: #333; position: absolute; top: 0px; right: 0;}
.modal_bg .modal_text {}
.modal_bg .modal_text p {font-size: 16px; font-weight: 500; color: #333;}
.modal_bg .modal_text h2 {font-size: 34px; font-weight: 600; color: #222; margin-bottom: 20px;}
.modal_bg .modal_img {margin-bottom: 30px; text-align: center;}
.modal_bg .modal_img img {max-width: 100%; height: 500px;}
.modal_bg .modal_key {display: flex; flex-wrap: wrap;}
.modal_bg .modal_key .modal_k {display: flex; width: 66.67%; flex-wrap: wrap;}
.modal_bg .modal_key .modal_k h3 {width: 100%; font-weight: 600; color: #222; font-size: 17px; margin-bottom: 5px;}
.modal_bg .modal_key .modal_k ul {display: flex;}
.modal_bg .modal_key .modal_k ul li {padding-right: 10px;}
.modal_bg .modal_key .modal_k ul li span {border: 1px solid #ddd; color: #666; font-size: 14px; font-weight: 400; padding: 5px 10px; border-radius: 6px;}
.modal_bg .modal_key .modal_link {display: flex; width: 33.33%; justify-content: flex-end;}
.modal_bg .modal_key .modal_link a {font-size: 16px; font-weight: 500; color: #0669bf; background: url(../img/portfolio_link.png)no-repeat 85% center; border: 1px solid #0669bf; line-height: 38px; border-radius: 40px; padding: 5px 70px 5px 30px;}
.modal_bg .modal_key .modal_link a:hover {background: #0669bf; color: #fff;}