/* 로그인 페이지 */
#loginDiv{
  margin-top: 200px;
  width: 500px;
}
/* 로그인 페이지 */


/* 메인페이지 */
html,body,header, .carousel{
  height: 100%;
}

body{
  overflow: hidden;
  overflow-y: auto;
}

.carousel,.carousel .carousel-inner,.carousel .carousel-inner .active,.carousel .carousel-inner .carousel-item,.view,body,html{
  height:100%
}

.navbar{
  background-color:rgba(0,0,0,.2)
}

.page-footer,.top-nav-collapse{
  background-color:#1C2331
}

@media only screen and (max-width:768px){
  .navbar{
    background-color:#1C2331
  }
}

*{
  box-sizing: border-box;
}


/* 메인페이지 메뉴 바 */
.view{
  background-image: url('../images/aaa.jpg'); 
  background-repeat: no-repeat; 
  background-size: cover;
}

.navbar{
  background:none;
  height: 120px;
}

.navbar-brand {
  max-width: 90%;
  width: 100%;
  margin-left: 3%;
}

.c-header-div {
  max-width: 70%;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

#mainlogo{
  width: 380px;
  height: 120px;
  margin-left: -270px;
  margin-top: 120px;
}

/* 상세페이지 메뉴 바 */
/*.view{
  background-repeat: no-repeat; 
  background-size: cover; 
  height: 180px;
}*/

#navbarA{
  background-color: white; 
  background-repeat: no-repeat; 
  background-size: cover; 
  height: 120px;
}

.logoimg{
  width: 225px;
  margin-left: -15%;
  height: auto;
}

@media only screen and (max-width:450px) {
  .navbar{
    background:none;
    height: 80px!important;
  }

  #navbarA{
    position: absolute;
  }

  .logoimg{
    width: 135px!important;
    margin-left: -15%;
    margin-top: 7px;
    height: auto;
  }
}
/* 메인페이지 메뉴 바 */



/* 메뉴(공통) */
.row-menubar-ul{
  display: flex;
  flex-wrap: wrap;
  margin-right: 15px;
  width: 100%;
  margin-top: -7px;
}

#navDropLink1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 500;
  margin-top: -9px;
}

#navDropLink2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 500;
  margin-left: 70px;
  margin-top: -9px;
}

#navDropLink3{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 500;
  margin-left: 70px;
  margin-top: -9px;
}

#navDropLink4{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 500;
  margin-left: 70px;
  margin-top: -9px;
}

#navDropSub{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 0.9em;
  font-weight: 500;
  margin-left: 42px;
}

#navDropUl1{
  margin-left: -65px;
}

#navDropUl2{
  margin-left: 3px;
}

#navDropUl3{
  margin-left: 1px;
}

#navDropUl4{
  margin-left: 3px;
}

.menu_btn>a{
  display: none;
}

.menu_btn>a:hover{
  transform: rotate(-45deg);
}

.sidebar_menu{
  display: none;
  width: 40%;
  height: 910px;
  background:white;
  position: absolute;
  top:0;
  right: -50%;
}

.close_btn{
  width: 100%;
  height: 25px;
  display: flex;
  justify-content: flex-end;
  margin-top: 50px;
}

.close_btn > a{
  display: block;
  width: 20%;
  height: 100%;
}

.sidebarmenu_1_div{
  margin-top: 80px;
}

.sidebarmenu_1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 700;
  color: #0D1F3A;
  padding-left: 70px;
}

.sidebarmenu_1:hover{
  color: #0D1F3A;
  text-decoration: none;
}

.sidebarsubmenu_1{
  padding-top: 15px;
  padding-left: 80px;
  line-height: 30px;
}

.sidebarsubmenu_txt{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.1em;
  font-weight: 500;
  color: #7F8182;
  margin-top: 30px;
}

.sidebarsubmenu_txt:hover{
  color: #7F8182;
  text-decoration: none;
}

.sidebarsubline{
  border-top: 1.5px solid;
  color: #7F8182;
  width: 80%;
  margin-left: 0px;
}


.sidebarmenu_2_div{
  margin-top: 40px;
}

.sidebarmenu_2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 700;
  color: #0D1F3A;
  text-decoration: none;
  padding-left: 70px;
}

.sidebarmenu_2:hover{
  color: #0D1F3A;
  text-decoration: none;
}

.sidebarsubmenu_2{
  padding-top: 20px;
  padding-left: 80px;
  line-height: 30px;
}


.sidebarmenu_3_div{
  margin-top: 40px;
}

.sidebarmenu_3{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 700;
  color: #0D1F3A;
  text-decoration: none;
  padding-left: 70px;
}

.sidebarmenu_3:hover{
  color: #0D1F3A;
  text-decoration: none;
}

.sidebarsubmenu_3{
  padding-top: 15px;
  padding-left: 80px;
  line-height: 30px;
}


.sidebarmenu_4_div{
  margin-top: 40px;
}

.sidebarmenu_4{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 700;
  color: #0D1F3A;
  text-decoration: none;
  padding-left: 70px;
}

.sidebarmenu_4:hover{
  color: #0D1F3A;
  text-decoration: none;
}

.sidebarsubmenu_4{
  padding-top: 15px;
  padding-left: 80px;
  line-height: 30px;
}

@media only screen and (max-width:1100px) {
  .c-header-div {
    max-width: 90%;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .navbar-brand {
    max-width: 90%;
    width: 35%;
    margin-left: 3%;
  }

  .top-bar{
    display: none!important;
  }

  .menu_btn>a{
    display: block!important;
  }

  .menu_icon{
    width: 35px;
  }

  .menu_btn{
    text-align: right;
  }

  .sidebarsubmenu_1{
    display: none;
  }

  .sidebarsubmenu_2{
    display: none;
  }

  .sidebarsubmenu_3{
    display: none;
  }

  .sidebarsubmenu_4{
    display: none;
  }
}

@media only screen and (max-width:768px) {
  .c-header-div {
    max-width: 90%;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .navbar-brand {
    max-width: 90%;
    width: 40%;
    margin-left: 3%;
  }

  .top-bar{
    display: none!important;
  }

  .menu_btn>a{
    display: block;
  }

  .menu_icon{
    width: 32px;
  }

  .menu_btn{
    text-align: right;
  }

  .slidemenu{
    display:block;
    width: 37%;
    margin-left: 89%;
    margin-top: -64px;
  }

  .exdiv{
    background-color: white;
    width: 100px;
    height: 500px;
    display: none;
  }
  
  .exitfont{
    display: block;
  }
}

@media only screen and (max-width:600px) {
  .c-header-div {
    max-width: 95%;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .menu_icon{
    width: 28px;
  }

  .sidebar_menu{
    display: none;
    width: 100%;
    height: 910px;
    background:white;
    position: absolute;
    top:0;
    right: -50%;
  }

  .close_btn{
    width: 100%;
    height: 25px;
    display: flex;
    justify-content: flex-end;
    margin-top: 25px;
    margin-left: 0px;
  }

  .sidebarmenu_1{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: #0D1F3A;
    padding-left: 70px;
  }

  .sidebarmenu_2{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: #0D1F3A;
    padding-left: 70px;
  }

  .sidebarmenu_3{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: #0D1F3A;
    padding-left: 70px;
  }

  .sidebarmenu_4{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: #0D1F3A;
    padding-left: 70px;
  }
}


body, ul, li, h1 {
  margin:0;
  padding:0;
  list-style:none;
}

a {
  color:inherit;
  text-decoration:none;
}

.con {
  margin:0 auto;
}

.img-box > img {
  width:100%;
  display:block;
}

.row::after {
  content:"";
  display:block;
  clear:both;
}

.cell {
  float:left;
  box-sizing:border-box;
}

.cell-right {
  float:right;
  box-sizing:border-box;
}

.margin-0-auto {
  margin:0 auto;
}

.block {
  color: white;
  display:block;
  margin-top: -10px;
}

.blockA {
  color: black;
  display:block;
  margin-top: -10px;
}

.inline-block {
  display:inline-block;
}

.text-align-center {
  text-align:center;
}

.line-height-0-ch-only {
  line-height:0;
}

.line-height-0-ch-only > * {
  line-height:normal;
}

.relative {
  position:relative;
}

.absolute-left {
  position:absolute;
  left:0;
}

.absolute-right {
  position:absolute;
  right:0;
}

.absolute-middle {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
}

.width-100p {
  width:100%;
}

.table {
  display:table;
}

.table-cell {
  display:table-cell;
}

.vertical-align-top {
  vertical-align:top;
}

.vertical-align-middle {
  vertical-align:middle;
}

.vertical-align-bottom {
  vertical-align:bottom;
}

.con {
  max-width:1150px;
}

.con-min-width {
  min-width:320px;
}

.top-bar {
  position:fixed;
  top:55px;
  right:10%;
  height:44px;
  transition:height 0.3s, top 0.3s, left 0.3s, right 0.3s;
  overflow-y:clip;
  display: flex;
  flex-direction: row-reverse;
  max-width: 75%;
}

html.not-scroll-top-0 .top-bar {
  top:0;
  left:0;
  right:0;
}

.top-bar:hover {
  height:300px;
  display: block;
}

.top-bar > .sub-menu-bar-bg::after {
  content:"";
  position:absolute;
  top:44px;
  left:0;
  right:0;
  bottom:0;
  z-index:-1;
  background-color:black;
  margin-top: 20px;
  opacity: 0.2;
  filter: alpha(opacity=40);
  width: 100%;
}

#topbar > .sub-menu-bar-bg::after {
  content:"";
  position:absolute;
  top:44px;
  left:0;
  right:0;
  bottom:0;
  z-index:-1;
  background-color:white;
  margin-top: 20px;
  opacity: 1;
  filter: alpha(opacity=40);
}

.top-bar > .sub-menu-bar-bg.change::after{
  background-color:black!important;
  opacity: 0.2!important;
  filter: alpha(opacity=40)!important;
}

.top-bar > .menu-box-1-bg::after {
  position:absolute;
  content:"";
  top:0;
  left:0;
  width:100%;
  height:44px;
  z-index:-1;
}

.top-bar > .menu-box-1 ul > li {
  position:relative;
}

.top-bar > .menu-box-1 > ul ul {
  position:absolute;
  top:100%;
  left:0;
  margin-top: 57px;
  width: 185px;
  margin-left: -210px;
}

.top-bar > .menu-box-1 ul > li > a {
  padding:10px;
}
/* 메뉴(공통) */



/* 메인페이지 문구 */
.mb{
  font-family: 'Noto Sans KR', sans-serif;
  margin-bottom: 0px;
  margin-left: 395px; 
  font-size: 1.4em; 
  font-weight: 500;
}

.bitfont{
  float: left;
}

.bitgaram1{
  font-style: italic; 
  font-size: 1.8em;
}

.bitgaram2{
  color:red;
}

.system{
  font-style: italic; 
  font-size: 1.8em;
}

.bitsubtxt{
  margin-top: 18px;
}

.font{
  font-family: 'Noto Sans KR', sans-serif; 
  font-weight: 300; 
  font-size: 1.2em;
}

@media only screen and (max-width:768px){
  .bitgaram {
    font-size: 32px;
    display: flex;
    justify-content: center;
  }
  .system{
    font-style: italic; 
    margin-left:15px;
  }  

  .mb {
    font-family: 'Noto Sans KR', sans-serif;
    margin-bottom: 0px;
    margin-left: 320px;
    font-size: 18px;
    font-weight: 400;
    margin-bottom: -5px;
  }

  .font{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    font-size: 16px;
  }
}

@media only screen and (max-width:450px){
  .mb {
    font-family: 'Noto Sans KR', sans-serif;
    margin-bottom: 0px;
    margin-left: 160px;
    font-size: 10px;
    font-weight: 400;
  }

  .bitgaram {
    font-size: 16px;
    display: flex;
    justify-content: center;
  }

  .bitsubtxt{
    margin-top: 70px;
  }

  .font{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 300;
    font-size: 10px;
    margin-top: -52px;
  }
}
/* 메인페이지 문구 */


/* 메인페이지 ABOUT US */
.center2 {
  display: flex;
  justify-content: space-between;
  width: 100%;
  max-width: 85%;
  margin: 0 auto;
  margin-top:100px;
}

.backimg{
  width: 100%;
  margin: 0 auto;
  height: 830px;
  max-width: 90%;
}

.about{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 60px;
  font-weight: 900;
  color: #232942;
  text-align: center;
}

.about-div{
  margin-top:200px;
}

.aboutline{
  width: 370px; 
  display: block;
  margin: 0 auto;
  margin-top: -60px;
}

#cardbody {
  width: 100%;
  height: 280px;
  padding-top: 45px;
  text-align: center;
}

#cardbody:hover{
  background-color: #232942;
  color:white;
}

.mb-4{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 0.95em;
  font-weight: 300;
  margin-top: 10px;
}

.mb-4 :hover{
  color: white;
}

.fa {
  display: flex;
  justify-content: center;
}

.card-size-w-div {
  width: 75%;
  height: 85%;
  margin-left:2%;
}

@media only screen and (max-width:1024px){
  .backimg {
    max-width: 95%;
    margin: 0 auto;
    width: 100%;
    height:830px;
  }

  .about{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 60px;
    font-weight: 900;
    color: #232942;
    text-align: center;
  }
  
  .about-div{
    margin-top:200px;
  }
  
  .aboutline{
    width: 370px; 
    display: block;
    margin: 0 auto;
    margin-top: -60px;
  }

  .mt-4 {  
    padding-left: 1.5em;
  }

  .fa-3x {
    margin-left: -20px;
  }

  .center2 {
    width: 100%;
    max-width: 95%;
    display: flex;
    margin:0 auto;
    justify-content: space-between;
    margin-top:100px;
  }

  #cardbody:hover{
    background-color: #232942;
    color:white;
  }  
}


@media only screen and (max-width:768px) {
  .backimg{
    margin-top:35px;
    width:100%;
    max-width: 95%;
    height: 950px;
  }

  .about{
    font-size: 60px;
    font-weight: 700;
    color: #232942;
    text-align: center;
  }

  .about-div{
    margin-top:150px;
  }

  #main-row-card {
    margin: auto;
    width:100%;;
  }

  .fa-3x {
    margin-top: 10px;
  }

  .center2 {
    width: 100%;
    height: 300px;
    max-width: 95%;
    display: flex;
    flex-wrap: wrap;
    margin:0 auto;
    justify-content: center;
  }

  .card-size-w-div {
    width: 45%;
    height: 85%;
    margin-left: 3%;
    margin-top: 3%;
  }

  #cardbody {
    height: 280px;
    width: 100%;
    padding-top: 30px;
  }

  #cardbody:hover{
    background-color: #232942;
    color:white;
    height: 254px;
    width: 100%;
  }
}

@media only screen and (max-width:450px) {
  .backimg{
    margin-top:-20px;
    width:100%;
    max-width: 95%;
    height: 850px;
  }

  .about{
    font-size: 40px;
    font-weight: 700;
    color: #232942;
    text-align: center;
  }

  .aboutline{
    width: 300px; 
    display: block;
    margin: 0 auto;
    margin-top: -40px;
    margin-bottom: 40px;
  }

  .card-size-w-div {
    width: 45%;
    height: 70%;
    margin-left: 3%;
    margin-top: 3%;
  }

  #cardbody {
    height: 280px;
    width: 100%;
    padding-top: 0px;
  }

  #cardbody:hover{
    background-color: #232942;
    color:white;
    height: 100%;
    width: 100%;
    margin-top: 1px;
    padding-top: 1px;
  }

  .fa-3x{
    margin-left: 0px;
  }
}
/* 메인페이지 ABOUT US */



/* 메인페이지 카운터 */
.count-f-div {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.counter1{
  background-image: url('../images/counterimg2.jpg');
  color: white;
  height: 555px;
}

.counter-text-b {
  text-align: center;
  font-size: 30px;
  font-weight: 500;
  padding-top:80px;
}

.counter-hipen-b {
  margin:auto;
  margin-top:25px;
  width:55px;
  height:2px;
  background-color:white;
  margin-bottom:-30px;
}

.d-inline-block{
  font-size: 85px;
  font-weight: 600;
  font-family: 'Noto Sans KR', sans-serif;
}

.font-weight-normal2{
  font-weight: 600; 
  font-size: 1.1em; 
  font-family: 'Noto Sans KR', sans-serif;
}

#countertxt1{
  margin-top: 15px;
  font-weight: 500;
  font-size: 17px;
}

#countertxt2{
  margin-top: 15px;
  font-weight: 500;
  font-size: 17px;
}

#countertxt3{
  margin-top: -5px;
  font-weight: 500;
  font-size: 17px;
}

#countertxt4{
  margin-top: 10px;
  font-weight: 500;
  font-size: 17px;
}

#count1 {
  width: 100%;
  max-width: 25%;
  text-align: center;
}

#count2 {
  width: 100%;
  max-width: 25%;
  text-align: center;
}

#count3 {
  width: 100%;
  max-width: 25%;
  text-align: center;
}

#count4 {
  width: 100%;
  max-width: 25%;
  text-align: center;
}

.z-depth-1 {
  padding:79px;
}

@media only screen and (max-width:1024px) {

  #counter-row-div {
    width:100%;
    margin-left:0px;
  }

  .count-f-div {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  .counter1 {
    background-image: url(../images/counterimg2.jpg);
    color: white;
    margin-top: -95px;
    height: 557px;
  }

  #countertxt1{
    margin-top: -5px;
    font-weight: 500;
    font-size: 17px;
  }

  #countertxt2{
    margin-top: -5px;
    font-weight: 500;
    font-size: 17px;
  }

  .count-up {
    font-size: 70px;
    margin-top:9px;
  }

  .count1 {
    font-size: 70px;
    margin-top: 8px;
  }

  .count2 {
    font-size: 70px;
  }

  .count3 {
    font-size: 70px;
    margin-top: 8px;
  }

  .p-5 {
    height:458px;
  }

  #countertxt4 {
    margin-top:-5px;
  }

  .mb-6 {
    margin-top:9px;
  }

  .counter-text-b {
    padding-top: 100px;
  }

  #count1 {
    width: 100%;
    max-width: 25%;
    text-align: center;
  }
  
  #count2 {
    width: 100%;
    max-width: 25%;
    text-align: center;
  }
  
  #count3 {
    width: 100%;
    max-width: 25%;
    text-align: center;
  }
  
  #count4 {
    width: 100%;
    max-width: 25%;
    text-align: center;
  }
}

@media only screen and (max-width:768px) {
  #counter-row-div {
    width:100%;
  }

  .count-f-div {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  .counter1 {
    margin-top:0px;
    width: 100%;
    height: 830px;
  }

  .counter-text-b {
    font-size: 32px;
    padding-top:120px;
  }

  .count1 {
    margin-top:7px;
  }

  .count3 {
    margin-left:0px;
    margin-top:-2px;
  }

  .mb-6 {
    margin-left:-8px;
  }

  #countertxt1{
    font-size: 18px;
    margin-top:0px;
  }

  #countertxt2{
    margin-top:2px;
    font-size: 18px;
  }

  #countertxt3{
    font-size: 18px;
    margin-top:0px;
  }

  #countertxt4{
    font-size: 18px;
    margin-top:0px;
  }

  .p-5 {
    height: 600px;
  }

  .fa-users {
    margin-top:0px;
  }

  #count1 {
    width: 100%;
    max-width: 50%;
    text-align: center;
    margin-top:8px;
  }
  
  #count2 {
    width: 100%;
    max-width: 50%;
    text-align: center;
    margin-top:9px;
  }
  
  #count3 {
    width: 100%;
    max-width: 50%;
    text-align: center;
    margin-top:60px;
  }
  
  #count4 {
    width: 100%;
    max-width: 50%;
    text-align: center;
    margin-top: 70px;
  }
}


@media only screen and (max-width:450px) {
  .counter1 {
    margin-top:0px;
    width: 100%;
    height: 650px;
  }

  .counter-text-b {
    font-size: 22px;
    padding-top:85px;
  }

  .counter-hipen-b {
    margin:auto;
    margin-top:25px;
    width:40px;
    height:2px;
    background-color:white;
    margin-bottom:-30px;
  }

  .z-depth-1{
    padding: 48px;
  }

  .count-up {
    font-size: 40px;
    margin-top:9px;
  }

  .count1 {
    font-size: 40px;
    margin-top: 8px;
  }

  .count2 {
    font-size: 40px;
  }

  .count3 {
    font-size: 40px;
    margin-top: 8px;
  }

  #count4 {
    width: 100%;
    max-width: 50%;
    text-align: center;
    margin-top: 58px;
  }
}
/* 메인페이지 카운터 */



/* 메인페이지 MAJOR BUSINESS */
.majorb{
  margin-top: 200px;
  margin-bottom: -100px;
}

.major{
  font-size: 60px;
  font-weight: 700;
  color: #232942;
  text-align: center;
}

.majorline{
  width: 370px;
  display: block;
  margin: 0 auto;
  margin-top: -60px;
}

.snip1273 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  min-width: 310px -60px;
  max-width: 310px;
  width: 100%;
  color: #ffffff;
  text-align: left;
  background-color: #000000;
  font-size: 16px;
}

.snip1273 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.4s ease-in;
  transition: all 0.4s ease-in;
}

.snip1273 img {
  position: relative;
  max-width: 100%;
  vertical-align: top;
}

.snip1273 figcaption {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  padding: 140px 45px;
}

.snip1273 figcaption:before,
.snip1273 figcaption:after {
  width: 1px;
  height: 0;
}

.snip1273 figcaption:before {
  right: 0;
  top: 0;
}

.snip1273 figcaption:after {
  left: 0;
  bottom: 0;
}

.snip1273 h3,
.snip1273 p {
  line-height: 1.5em;
}

.snip1273 h3 {
  margin: 0 0 5px;
  font-weight: 700;
  text-transform: uppercase;
}

.snip1273 p {
  font-size: 0.8em;
  font-weight: 500;
  margin: 0 0 15px;
}

.snip1273 a {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  z-index: 1;
}

.snip1273:before,
.snip1273:after,
.snip1273 figcaption:before,
.snip1273 figcaption:after {
  position: absolute;
  content: '';
  background-color: #ffffff;
  z-index: 1;
  -webkit-transition: all 0.4s ease-in;
  transition: all 0.4s ease-in;
  opacity: 0.8;
}

.snip1273:before,
.snip1273:after {
  height: 1px;
  width: 0%;
}

.snip1273:before {
  top: 0;
  left: 0;
}

.snip1273:after {
  bottom: 0;
  right: 0;

}
.snip1273:hover img,
.snip1273.hover img {
  opacity: 0.4;
}

.snip1273:hover figcaption,
.snip1273.hover figcaption {
  opacity: 1;
}

.snip1273:hover figcaption:before,
.snip1273.hover figcaption:before,
.snip1273:hover figcaption:after,
.snip1273.hover figcaption:after {
  height: 100%;
}

.snip1273:hover:before,
.snip1273.hover:before,
.snip1273:hover:after,
.snip1273.hover:after {
  width: 100%;
}

.snip1273:hover:before,
.snip1273.hover:before,
.snip1273:hover:after,
.snip1273.hover:after,
.snip1273:hover figcaption:before,
.snip1273.hover figcaption:before,
.snip1273:hover figcaption:after,
.snip1273.hover figcaption:after {
  opacity: 0.1;
}

.snip1273 {
  background-color: #232942;
  max-width: 100%;
  height : 400px;
}

.figimg7{
  padding-top: 200px;
  padding-bottom: -400px;
}

.figcenter{
  display: flex;
  justify-content: center;
  height: 400px;
  width: 100%;
} 

.figcenter2{
  display: flex; 
  justify-content: center; 
  height: 400px; 
  width: 100%;
}

.fig1{
  margin-left: -10px;
}

.fig4{
  margin-left: -10px;
}

.figimg{
  height: 400px; 
  width:800px;
}

.figcaptionn{
  text-align: center; 
}



@media only screen and (max-width:1024px){
  .majorb {
    margin-top: 140px;
  }

  .figimg7 {
    margin-top:-115px;
  }

  .figcenter {
    display: flex;
    justify-content: center;
    height: 400px;
    width: 100%;
  }

  .figcenter2 {
    display: flex;
    justify-content: center;
    height: 400px;
    width: 100%;
  }
}

@media only screen and (max-width:768px) {
  .majorb {
    width:100%;
  }

  .figimg7 {
    width: 157%;
  }

  .example {
    height:auto;
  }

  .figcenter {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 1200px;
    width: 100%;
  }

  .figcenter2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 400px;
    width: 100%;
    height: 1600px;
  }

  .snip1273 {
    font-family: 'Raleway', Arial, sans-serif;
    margin-bottom: 0px;
  }
}

@media only screen and (max-width:450px) {
  .major{
    font-size: 40px;
    font-weight: 700;
    color: #232942;
    text-align: center;
  }
  
  .majorline{
    width: 300px;
    display: block;
    margin: 0 auto;
    margin-top: -40px;
  }
}
/* 메인페이지 MAJOR BUSINESS */



/* 메인페이지 파트너 */
.partner{
  text-align: center;
  width: 100%;
  height: 820px;
}

.partnerimg{
  padding-top: 5%;
  width: 80%;
  margin-bottom:5px;
}

.partnerlogoimg{
  width: 85%;
}

@media only screen and (max-width:1024px) {
  .partnerimg{
    width: 83%;
    margin-bottom:20px;
  }

  .partner{
    text-align: center;
    width: 100%;
    height: 450px;
    margin-top: 20px;
  }
}

@media only screen and (max-width:768px){
  .partner {
    height: 450px;
    text-align: center;
    width: 100%;
    margin-top: 0px;
    margin-bottom: -50px;
  }

  .partnerimg {
    padding-top: 30px;
    width: 100%;
    margin-bottom: 10px;
  }
}

@media only screen and (max-width:450px){
  .partner {
    height: 300px;
    text-align: center;
    width: 100%;
    margin-top: 0px;
    margin-bottom: -50px;
  }

  .partnerlogoimg {
    padding-top: 15px;
    width: 100%;
    margin-bottom: 10px;
  }
}
/* 메인페이지 파트너 */
/* 메인페이지 */







/* 인사말 페이지 */
#greetingmain{
  height: 2150px;
}

/* 회사소개 중간 메뉴(공통) */
#row-center-div {
  width: 100%;
  justify-content: center;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  max-width: 100%;
  margin-top: 130px!important;
}

.ddd-box {
  margin-left:-90px;
  display: flex;
  justify-content: space-around;
}

.his-card {
  width: 200px;
  height: 60px;  
}

.menubackimg{
  background-image: url('../images/backimgaa.png');
  width: 100%;
  height: 500px;
  margin-top: 20px;
  margin-bottom: -160px;
}

.companyinfo{
    font-size: 4em; 
    font-weight: 900;
    color: black;
    text-align: center;
    padding-top: 220px;
}

.menubar{
    display: flex; 
    justify-content: center; 
    width: 100%;
}

#menubardiv{
  max-width: 100%;
}

.g-menubtn-div {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 0.95em;
  font-weight: 300;
  position: relative;
  width: 100%;
  padding-right: 1%;
}

#menubarall{
  width: 2300px; 
  margin-left: -231px;
}

#card1{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#cardall{
  height: 100%; 
  width: 100%;
}

#cardall:hover{
  background-color: #232942;
  color: white!important;
}

#card1:hover{
  background-color: #232942;
  color: white!important;
}

#card2:hover{
  background-color: #232942;
  color: white!important;
}

#card3:hover{
  background-color: #232942;
  color: white!important;
}

#card4:hover{
  background-color: #232942;
  color: white!important;
}

#menutexts{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 1em; 
  font-weight: 600;
  margin-top: 13px;
}

#menutexts:hover{
  color: white;
}

#menutexts2{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 1em; 
  font-weight: 600;
}

#menutexts2:hover{
  color: white;
}


@media only screen and (max-width:1024px){
  .ddd-box {
    margin-left:-55px;
    display: flex;
  }

  #row-center-div {
    width: 100%;
    justify-content: center;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    max-width: 100%;
    margin-top: 125px!important;
  }
  
  .g-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 60%;
  }

  #menutexts{
    font-family: 'Noto Sans KR', sans-serif; 
    font-size: 1em; 
    font-weight: 600;
    margin-top: 10px !important;
  }
  
  #card1{
    height: 100%; 
    width: 95%; 
    background-color: #232942;
  }

  #cardall{
    height: 100%; 
    width: 95%;
  }
}

@media only screen and (max-width:768px) {
  .companyinfo {
    font-size: 55px;
  }
    
  #row-center-div {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left:0px !important;
    margin-top:9px;
  }

  .g-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 46%;
  }

  #card1 {
    height: 100%;
    width: 80%;
    margin: 0 auto;
  }

  #cardall {
    height: 100%;
    width: 80% !important;
    margin: 0 auto;
  }

  .ddd-box {
    margin:0 auto;
  }

  .margin-c-box {
    margin-left:0px;
  }

  .margin-mb5 {
    margin-top:0px;
  }

  .margin-mb6 {
    margin-top:0px;
  }

  .menubackimg{
    background-image: url('../images/backimgaa.png');
    width: 100%;
    height: 400px;
    margin-top: 20px;
    margin-bottom: -160px;
  }

  #menutexts{
    font-family: 'Noto Sans KR', sans-serif; 
    font-size: 1em; 
    font-weight: 600;
    margin-top: 2px;
  }
}

@media only screen and (max-width:450px) {
  #greetingmain{
    height: auto!important;
  }

  .menubackimg{
    background-image: url('../images/backimgaa.png');
    width: 100%;
    height: 255px;
    margin-top: 20px;
    margin-bottom: -160px;
  }

  .companyinfo {
    font-size: 40px;
    padding-top: 120px;
  }

  #card1 {
    height: 100%;
    width: 90%;
    margin: 0 auto;
  }

  #card2 {
    height: 100%;
    width: 90%!important;
    margin: 0 auto;
  }

  #card3 {
    height: 100%;
    width: 90%!important;
    margin: 0 auto;
  }

  #card4 {
    height: 100%;
    width: 90%!important;
    margin: 0 auto;
  }

  #card5 {
    height: 100%;
    width: 90%!important;
    margin: 0 auto;
  }

  #cardall {
    height: 100%;
    width: 90% !important;
    margin: 0 auto;
  }
}
/* 회사소개 중간 메뉴(공통) */




/* 인사말 페이지 내용 */
.backimage{
  background-image: url('../images/backimg.jpg');
}

.abouthead{
width: 50%;
display: block;
margin: 0 auto;
margin-top: 10%;
}

.www{
width: 2%;
display: block;
margin: 0 auto;
margin-top: 5%;
}

.abouthead2{
width: 35%;
display: block;
margin: 0 auto;
margin-top: 1%;
}

.aboutmaintxt{
width: 70%;
display: block;
margin: 0 auto;
margin-top: 90px;
}

@media only screen and (max-width:1024px) {  
  #greetingmain {
    height: 1410px;
  }

  .abouthead{
  width: 63%;
  display: block;
  margin: 0 auto;
  margin-top: 13%;
  }

  .abouthead2 {
    width: 43%;
    display: block;
    margin: 0 auto;
    margin-top: 1%;
  }

  .aos-init {
    width: 100%;
  }

  .aboutmaintxt {
    width: 77%;
    display: block;
    margin: 0 auto;
    margin-top: 90px;
  }
}

@media only screen and (max-width:768px){ 
  #greetingmain {
    height: 1450px;
  }

  .backimage {
    width:100%;
  }

  .abouthead {
    width: 75%;
    display: block;
    margin: 0 auto;
    margin-top: 16%;
  }

  .abouthead2{
    width: 48%;
    display: block;
    margin: 0 auto;
    margin-top: 1%;
  }

  .aboutmaintxt {
    width: 90%;
    display: block;
    margin: 0 auto;
    margin-top: 70px;
  }

  .www{
    width: 3%;
    display: block;
    margin: 0 auto;
    margin-top: 5%;
  }
}
/* 인사말 페이지 내용 */
/* 인사말 페이지 */




/* 연혁 페이지 */
#historymain{
  height: 7800px;
}

/* 회사소개 현재 메뉴 */
#card2{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#cardall{
  height: 100%; 
  width: 100%;
}

#menutexts2 {
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 1em; 
  font-weight: 600;
  margin-top: 16px;
}

#menubar1 {
  margin-left: 2%;
}
#menutexts {
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 1em; 
  font-weight: 600;
  margin-top: 16px;
}

.g-menubtn-div {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 0.95em;
  font-weight: 300;
  position: relative;
  width: 100%;
  padding-right: 1%;
}

@media only screen and (max-width:1024px){ 
  #cardall{
    height: 100%; 
    width: 95%;
    margin: 0 auto;
  }

  #card2 {
    margin: 0 auto;
    height: 100%; 
    width: 95%;
  }

  #menutexts2 {
    margin-top:-5px;
    font-family: 'Noto Sans KR', sans-serif; 
    font-size: 1em; 
    font-weight: 600;
    margin-top: 13px;
  }
  
  .g-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 60%;
  }

  .g-mt-box {
    width: 100%;
    justify-content: center;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    max-width: 100%;
  }
}

@media only screen and (max-width:768px){ 
  #menutexts2 {
    margin-top:-5px;
    font-family: 'Noto Sans KR', sans-serif; 
    font-size: 1em; 
    font-weight: 600;
    margin-top: 10px;
  }

  .g-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 60%;
    margin-left: 2%;
  }

  .g-mt-box {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left:0px !important;
    margin-top:9px;
  }

  #row-center-div {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 0px !important;
    margin-top: 9px;
  }

  #card2 {
    margin: 0 auto;
    width: 80%;
    height: 100%;
    background: #232942;
  }
}
/* 회사소개 현재 메뉴 */



/* 중간 메뉴 글 및 아이콘(공통) */
.text1{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 3em;
    color: black;
    font-weight: 900;
    text-align: center;
    margin-top: 100px;
}

.textline{
    display: block;
    margin: 0 auto;
    height: 250px;
    margin-top: -50px;
}

@media only screen and (max-width:450px){
  .text1{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 40px;
    color: black;
    font-weight: 900;
    text-align: center;
    margin-top: 100px;
  }

  .textline{
      display: block;
      margin: 0 auto;
      height: 165px;
      margin-top: -50px;
      margin-bottom: -80px;
  } 
}
/* 중간 메뉴 글 및 아이콘(공통) */



/* 연혁 내용 */
#divyear {
  width:100%;
  max-width: 80%;
  margin:0 auto;
}

.div2016 {
  font-family: 'Noto Sans KR', sans-serif;
  width: 100%;
  max-width: 92%;
  font-size: 1.1em;
  margin-left: -5%;
  margin: 0 auto;
}

.fade2016{
  margin-left: 4.3%;
}

.leftyear{
  font-size: 9em; 
  font-weight :500; 
  font-family: 'Open Sans', sans-serif;
  color: #232942;
}

.leftmonth{
    font-size: 2em; 
    font-weight :900; 
    font-family :'Noto Sans KR', sans-serif; 
    color: #232942;
}

.lefttext{
  font-family:'Noto Sans KR', sans-serif;
  margin-left: 30px;
}

.img2016 {
  width: 55%;
  margin-top: -40%;
  margin-left: 45%;
}

.hr2016 {
  width: 50%;
  margin: 0;
  margin-bottom: 10px;
}

.img17 {
  margin-top: 90px;
}

.img2017 {
  width: 55%;
  margin-top: 150px;
  margin-left: 0px;
}

.div2017{
  margin-top: 0px; 
  margin-left: 0px;
  padding-top: 3%;
}

.fade2017 {
  padding-left: 61%;
  margin-top: -45%;
}

.rightyear{
    font-size: 9em; 
    font-weight: 900; 
    font-family: 'Open Sans', sans-serif; 
    color :#b4b3b3;
}

.rightmonth{
    font-size: 2em; 
    font-weight :900; 
    font-family :'Noto Sans KR', sans-serif; 
    color :#b4b3b3;
}

.righttext{
    font-family:'Noto Sans KR', sans-serif;
    color: rgb(128, 126, 126);
    margin-left: 30px;
}

.div2018{
  margin-left: -130px; 
  width: 100%;
  max-width: 92%;
  margin: 0 auto;
  margin-top: -50px;
}

.fade2018 {
  margin: 5%;
  margin-left: 95px;
}

.img2018 {
  width: 55%;
  margin-top: -850px;
  margin-left: 662px;
}

.hr2018 {
  width: 50%;
  margin: 0;
  margin-bottom: 10px;
}

.img2019 {
  width: 56%;
  margin-left: -100px;
  margin-top: 130px;
}

.div2019 {
  margin-left: 120px;
  max-width: 92%;
  width: 100%;
}

.fade2019 {
  width: 100%;
  margin-left: 61%;
  margin-top: -715px;
}

.div2020{
  width: 100%;
  max-width: 92%;
  margin-left: -130px;
}

.fade2020 {
  margin-left: 260px;
  margin-top: 190px;
}

.img2020 {
  width: 41%;
  margin-top: -650px;
  margin-left: 918px;
}

.hr2020 {
  width: 55%;
  margin: 0;
  margin-bottom: 10px;
}
.img2021 {
  width: 55%;
  margin-top: 100px;
  margin-left: 10px;
}

.div2021 {
  width: 100%;
  max-width: 92%;
  margin-top: 100px;
  margin-left: 120px;
  margin: 0 auto;
  margin-top: 100px;
}

.fade2021 {
  width: 100%;
  margin-left: 61%;
  margin-top: -610px;
}

.hr2021{
  width: 100%;
}

.fade2022 {
  margin-left: 130px;
  margin-top: 270px;
}

.img2022 {
  width: 41%;
    margin-top: -340px;
    margin-left: 792px;
}


@media only screen and (max-width:1024px) {
  #historymain{
    height: 5250px;
  }
  
  #divyear {
    width:80%;
  }
  
  .leftyear {
    font-size: 120px;
    margin-left:12px;
    font-weight: 900;
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    color: #232942;
  }

  .leftmonth{
    font-size: 25px; 
    font-weight :900; 
    font-family :'Noto Sans KR', sans-serif; 
    color: #232942;
  }

  .img2016 {
    width: 68%;
    margin-top: -56%;
    margin-left: 40%;
  }

  .lefttext {
    font-family: 'Noto Sans KR', sans-serif;
    margin-left: 25px;
    margin-top:-5px;
  }

  .rightyear {
    margin-left:12px;
    font-size: 120px;
    font-weight: 900;
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    color: #b4b3b3;
  }

  .rightmonth {
    font-size: 25px;
    font-weight: 900;
    font-family: 'Noto Sans KR', sans-serif;
    color: #b4b3b3;
  }

  .righttext {
    font-family: 'Noto Sans KR', sans-serif;
    color: rgb(128, 126, 126);
    margin-left: 20px;
    margin-top:-5px;
  }

  .div2016 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin-left: -5%;
    margin: 0 auto;
  }

  .img2017 {
    width: 73%;
    margin-top: 95px;
    margin-left: -165px;
  }

  .fade2017 {
    margin-top: -400px !important;
  }

  .fade2018 {
    margin: 5%;
    margin-left: 15px;
  }

  .img2018 {
    width: 80%;
    margin-top: -650px;
    margin-left: 300px;
  }

  .img2019 {
    width: 80%;
    margin-top: 125px;
    margin-left: -170px;
  }

 .fade2019 {
    width: 100%;
    margin-left: 61%;
    margin-top: -530px;
  }

 .fade2020 {
  margin-left: 180px;
  margin-top: 190px;
  }

  .img2020 {
    width: 59%;
    margin-top: -600px;
    margin-left: 70%;
  }

  .img2021 {
    width: 81%;
    margin-top: 130px;
    margin-left: -87px;
  }

  .div2021 {
    margin-top: 20px;
  }

  .fade2021 {
    width: 100%;
    margin-left: 68%;
    margin-top: -510px;
  }
}

@media only screen and (max-width:768px) {

  #historymain{
    height: 4800px;
  }

  .divyear {
    width: 50%;;
  }
  .img2016 {
    display: none;
  }

  .div2016 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 55%;
    font-size: 1.1em;
    margin:0%;
  }

  .left-text-2016 {
    height: 145px;
  }
  .fade2016 {
    margin-left: 0px;
  }

  .div2017 {
    margin-top: 200px;
  }

  .fade2017 {
    padding-left: 61% !important;
  }

  .left-text-2017 {
    height: 145px;
  }

  .fade2017 {
    width: 1200px;
    margin-top:80px;
    padding-left:0px;
  }

  .hr2017 {
    width: 23%;
    margin-top: -35px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .hr2016 {
    width: 90%;
    margin-top: 16px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .img2017 {
    display: none;
  }

  .img2018 {
    display: none;
  }

  .div2018 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 55%;
    font-size: 1.1em;
    margin:0;
  }

  .left-text-2018 {
    height: 145px;
  }

  .hr2018 {
    width: 100%;
    margin-top: -35px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .fade2018 {
    margin-top: 10px;
  }

  .fade2019 {
    margin-top: 45px;
    padding-left: 10%;
  }

  .div2019 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 55%;
    font-size: 1.1em;
    margin: 0 auto;
  }

  .left-text-2019 {
    height: 145px;
  }

  .hr2019 {
    width: 27%;
    margin-top: -35px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .fade2020 {
    margin-top: 20px;
    padding-left: 0px;
    margin-left: 0px;
    padding-right: 0px;
  }

  .div2020 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 55%;
    font-size: 1.1em;
    margin: 0;
  }

  .left-text-2020 {
    height: 145px;
  }

  .hr2020 {
    width: 100%;
    margin-top: -35px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .fade2021 {
    margin-top: 30px;
    padding-left: 43%;
  }

  .div2021 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 55%;
    font-size: 1.1em;
    margin: 0;
  }

  .left-text-2021 {
    height: 145px;
  }

  .hr2021 {
    width:26%;
    margin-top: -35px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 5px;
  }

  .img2019 {
    display: none;
  }

  .img2020 {
    display: none;
  }

  .img2021 {
    display: none;
  }

  .img2021 {
    display: none;
  }
}

@media only screen and (max-width:450px) {
  
  #historymain{
    height: auto;
  }

  .div2016 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin: 0 auto;
    margin-left: -25px;
  }

  .div2017 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin: 0;
    margin-left: -130px;
    margin-top: 330px;
  }

  .div2018 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin: 0 auto;
    margin-left: -25px;
  }

  .div2019 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin: 0 auto;
    margin-left: -155px;
  }

  .hr2019 {
    width: 70% !important;
  }

  .div2020 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin: 0 auto;
    margin-left: -10px;
  }

  .hr2020 {
    width: 50% !important;
  }

  .div2021 {
    font-family: 'Noto Sans KR', sans-serif;
    width: 100%;
    max-width: 100%;
    font-size: 1.1em;
    margin-left: 79px;
  }

  .fade2021 {
    margin-top: 30px;
    padding-left: 0%;
    margin-left: 0px;
  }

  .leftyear {
    font-size: 55px;
    margin-left:5px;
    font-weight: 900;
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    color: #232942;
  }

  .leftmonth{
    font-size: 17px; 
    font-weight :900; 
    font-family :'Noto Sans KR', sans-serif; 
    color: #232942;
  }

  .lefttext {
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
    margin-left: 17px;
    margin-top:-5px;
  }

  .rightyear {
    font-size: 55px;
    font-weight: 900;
    font-family: 'Open Sans', sans-serif;
    font-style: italic;
    margin-left:65px;
    color: #b4b3b3;
  }

  .rightmonth {
    font-size: 17px;
    font-weight: 900;
    font-family: 'Noto Sans KR', sans-serif;
    color: #b4b3b3;
    margin-left: 62px;
  }

  .righttext {
    font-size: 12px;
    font-family: 'Noto Sans KR', sans-serif;
    color: rgb(128, 126, 126);
    margin-left: 80px;
    margin-top:-5px;
  }

  .hr2016 {
    width: 68%;
    margin-top: -70px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 0px;
  }

  .hr2017 {
      width: 19%;
      margin-top: -25px;
      border: 0;
      border-top: 1px solid rgba(0, 0, 0, 0.1);
      margin-left: 60px;
  }

  .hr2018 {
      width: 68%;
      margin-top: -25px;
      border: 0;
      border-top: 1px solid rgba(0, 0, 0, 0.1);
      margin-left: 5px;
  }

  .hr2019 {
      width: 20%;
      margin-top: -25px;
      border: 0;
      border-top: 1px solid rgba(0, 0, 0, 0.1);
      margin-left: 60px;
  }

  .hr2021 {
    width:65%;
    margin-top: -25px;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin-left: 60px;
  }
}
/* 연혁 내용 */
/* 연혁 페이지 */





/*인증서 페이지*/
#certificationmain{
  min-height: 4000px;
}

/* 회사소개 현재 메뉴 */
#card3{
  height: 100%;
  width: 100%; 
  background-color: #232942;
}

#menutexts33 {
  margin-top:16px;
  font-weight: 600;
}

@media only screen and (max-width:1024px) {
  #certificationmain{
    height: 4000px;
  }

  #card3 {
    height: 100%;
    width: 100%;
    background-color: #232942;
  }
  
  #menutexts {
    text-align: center;
  }

  #menutexts33 {
    margin-top:10px !important;
    font-weight: 600;
  }

  .card-body {
    width: 160px;
    height: 50px;  
  }
}

@media only screen and (max-width:768px) {
  #certificationmain{
    height: 8650px;
  }

  #card3 {
    height: 100%; 
    width: 80%; 
    background-color: #232942;
    margin: 0 auto;
  }
  
  #menutexts33 {
    margin-top:-6px;
    font-weight: 600;
  }

  .card-body {
    width: 300px;
    height: 50px;
  }

  .mb-4 {
    margin-top:0px;
  }
}
/* 회사소개 현재 메뉴 */



/*인증서 페이지 내용*/

.roww{
  text-align: center;
  flex: 0 0 25%;
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-top: 150px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.div-big-div{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  max-width: 88%;
  margin: 0 auto;
}

.b-card-s {
  width: 30%;
  margin-top:20px;
  margin-bottom:50px;
}

.pic{
  width: 210px;
  height: auto;
  box-shadow: 0 8px 17px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%) !important;
}

.pic:hover{
  -webkit-transform:scale(1.2);
  -moz-transform:scale(1.2);
  -ms-transform:scale(1.2);   
  -o-transform:scale(1.2);
  transform:scale(1.2);
  transition: all 0.3s ease-in-out;
}

@media only screen and (max-width:1024px) {
  #certificationmain{
    height: auto;
  }

  .div-big-div{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    max-width: 88%;
    margin: 0 auto;
  }
  
  .pic1{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic2{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic3{
    width: 210px; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic4{
    width: 200px; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic5{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic6{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic7{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic8{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic9{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic10{
    width: 210px; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic11{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic12{
    width: 210px; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic13{
    width:210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic14{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic15{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic16{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic17{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic18{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic19{
    width: 210px;
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }






}

@media only screen and (max-width:768px) {
  #certificationmain{
    height: auto;
  }

  .div-big-div{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  .pic1{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic2{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic3{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic4{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic5{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic6{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic7{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic8{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic9{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic10{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic11{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic12{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic13{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic14{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic15{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic16{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic17{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }
  
  .pic18{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }

  .pic19{
    width: 90%; 
    height: 300px;
    margin-left: 0px;
    margin-top: 0px;
  }





}

@media only screen and (max-width: 450px) {
  #certificationmain{
    height: 5300px!important;
  }

  #picdiv1 {
      text-align: center;
      flex: 0 0 15%;
      max-width: 70%;
      position: relative;
      width: 50%;
      height: 200px;
      margin: 0 auto;
      padding-right: 0px;
      padding-left: 0px;
      float: none;
      margin-top: 60px;
  }

  .pic1{
    height: 235px!important;
  }

  #certification_txt{
    font-size: 13px;
    margin-top: -5px!important;
  }

  #picdiv2 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic2{
    height: 235px!important;
  }

  #picdiv3 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic3{
    height: 235px!important;
  }

  #picdiv4 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic4{
    height: 235px!important;
  }

  #picdiv5 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic5{
    height: 235px!important;
  }

  #picdiv6 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic6{
    height: 235px!important;
  }

  #picdiv7 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic7{
    height: 235px!important;
  }

  #picdiv8 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic8{
    height: 235px!important;
  }

  #picdiv9 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic9{
    height: 235px!important;
  }

  #picdiv10 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic10{
    height: 235px!important;
  }

  #picdiv11 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic11{
    height: 235px!important;
  }

  #picdiv12 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic12{
    height: 235px!important;
  }

  #picdiv13 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 50%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic13{
    height: 235px!important;
  }

  #picdiv14 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic14{
    height: 235px!important;
  }

  #picdiv15 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic15{
    height: 235px!important;
  }

  #picdiv16 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic16{
    height: 235px!important;
  }

  #picdiv17 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic17{
    height: 235px!important;
  }


  #picdiv18 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic18{
    height: 235px!important;
  }

    #picdiv19 {
    text-align: center;
    flex: 0 0 15%;
    max-width: 70%;
    position: relative;
    width: 50%;
    height: 200px;
    margin: 0 auto;
    padding-right: 0px;
    padding-left: 0px;
    float: none;
    margin-top: 140px;
  }

  .pic19{
    height: 235px!important;
  }




}


/*인증서 페이지 내용*/
/*인증서 페이지*/




/*조직도 페이지*/
#organizationmain{
height: 1650px;
}

/* 회사소개 현재 메뉴 */
#card4{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

@media only screen and (max-width:1024px) {
  #organizationmain{
    height: 1350px;
  }

  #card4 {
    height: 100%;
    width: 100%;
    background-color: #232942;
  }
  
  #menutexts {
    text-align: center;
  }

  #menutexts33 {
    margin-top:1px;
    font-weight: 600;
  }

  .card-body {
    width: 160px;
    height: 50px;  
  }
}

@media only screen and (max-width:768px) {
  #organizationmain{
    height: 1500px;
  }

  #card4 {
    height: 100%;
    width: 80%;
    background-color: #232942;
    margin:0 auto;
  }

  .card-body {
    width: 300px;
    height: 50px;  
  }

  #menutexts {
    text-align: center;
  }
}
/* 회사소개 현재 메뉴 */


/* 조직도 페이지 내용 */
.chart11{
  width: 70%;
  display: block;
  margin: 0 auto;
  margin-top: -30px;
}

@media only screen and (max-width:450px) {
  #organizationmain{
    height: 1050px;
  }
  
  .chart11{
    width: 90%;
    display: block;
    margin: 0 auto;
    margin-top: 30px;
  }
}
/* 조직도 페이지 내용 */
/*조직도 페이지*/



/*회사위치 페이지*/
#locationmain{
height: 2750px;
}

/* 회사소개 현재 메뉴 */
#card5{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#carrdall {
  height: 100%; 
  width: 95%; 
}

#menutexts44 {
  margin-top:16px;
  font-weight: 600;
}

@media only screen and (max-width:1024px) {
  .g-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 60%;
  }

  .card-body {
    width: 100%;
    height: 95%;  
  }

  #menutexts {
    text-align: center;
  }

  #menutexts44 {
    margin-top:15px;
    font-weight: 600;
  }
}

@media only screen and (max-width:768px) {
  #card5{
    height: 100%;
    width: 80%; 
    margin:0 auto;
    background-color: #232942;
  }

  #card-size-l {
    margin-top: 16px;
  }

  #menutexts {
    text-align: center;
  }

  #menutexts44 {
    margin-top:-5px;
    font-weight: 600;
  }
}
/* 회사소개 현재 메뉴 */


/* 회사위치 페이지 내용 */
.contact{
  font-size: 3.5em;
  font-weight: 600;
  text-align: center;
  margin-top: -50px;
  color:#232942;
}

.conline{
  width: 400px;
  display: block;
  margin: 0 auto;
  margin-top: -70px;
}

.maptext{
  text-align: center;
}

.maptext1{
  font-size: 1.5em;
  font-weight: 900;
  font-family: 'Noto Sans KR', sans-serif;
  color: #232942;
}

.maptext2{
  font-size: 1.5em;
  font-weight: 600;
  font-family: 'Noto Sans KR', sans-serif;
}

.mapimg{
  display: block;
  margin: 0 auto;
  height: 200px;
}

.map-container{
  overflow:hidden;
  padding-bottom:56.25%;
  position:relative;
  height:0;
  width: 75%;
  display: block;
  margin: 0 auto;
}
    
.map-container iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute;
}

@media only screen and (max-width:1024px) {
  #locationmain {
    height: 2200px;
  }

  .mapimg {
    width: 700px;
    height:auto;
  }

  .maptext {
    margin-top:20px;
    text-align: center;
    font-size: 18px;
  }

  .contact {
    font-size: 3.5em;
    font-weight: 600;
    text-align: center;
    margin-top: -50px;
    color: #232942;
  }
}

@media only screen and (max-width:768px) {
  #locationmain {
    height: 2100px;
  }

  .mapimg {
    width: 500px;
    height:auto;
  }
}

@media only screen and (max-width:450px) {
  #locationmain {
    height: 1500px;
  }

  .contact {
    font-size: 40px;
    font-weight: 700;
    text-align: center;
    margin-top: 30px;
    color: #232942;
  }

  .conline{
    width: 300px;
    display: block;
    margin: 0 auto;
    margin-top: -45px;
  }

  .maptext {
    margin-top:15px;
    text-align: center;
    font-size: 12px;
  }

  .mapimg {
    width: 85%;
    height:auto;
  }
}
/* 회사위치 페이지 내용 */
/*회사위치 페이지*/



/* 인증서 등록 페이지 */
#certificationaddmain{
  height: 1500px;
}

.certification-add-main-div{
  width: 80%;
  display: block;
  margin: 0 auto;
  margin-top: 200px;
}

.titleDiv{
  margin-left: -50px;
  display: flex;
}

#c_name{
  width: 88%;
  margin-left: 20px;
  margin-top: -5px;
  border: 3px skyblue solid;
}

.certification-add-btn-div{
  float: right;
  margin-top: 30px;
}
/* 인증서 등록 페이지 */












/* 사업분야 페이지 */
#businessmain{
  height: 4000px;
}

/* 사업분야 문구 */
.businesstext{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 4em;
  color: black;
  font-weight: 900;
  text-align: center;
  margin-top: 275px;
}

@media only screen and (max-width:450px) {
  .businesstext{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 40px;
    color: black;
    font-weight: 900;
    text-align: center;
    margin-top: 180px;
  }
}
/* 사업분야 문구 */


/* 사업분야 페이지 내용 */
#busidiv {
  height: auto;
  margin: 0 auto;
  max-width: 80%;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  display: flex;
  flex-direction: row;
}

.busi1 {
  width: 50%;
  height: auto;
}

.business-t-box {
  max-width: 80%;
  margin-top: 150px;
  margin-left: 8%;
}

.txt1{
  font-size: 1.5em;
}

.txt1_1 {
  max-width: 100%;
  width: 100%;
  font-size: 0.9em;
}

.btn-box-set-box {
  width: 100%;
  max-width: 95%;
}

#btn1{
  width: 22%;
  margin-left: 83%;
  height: 45px;
  font-size: 12px;
}


#busidiv2{
  margin: 0 auto;
  max-width: 80%;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  height: auto;
  margin-top: 10%;
}

.busi2{
  width: 47%;
  height: auto;
}

.business-t-box2 {
  max-width: 80%;
  margin-top: 100px;
  margin-left: 0%;
}

.txt2{
  font-size: 1.5em;
}

.txt2_2{
  max-width: 100%;
  width: 100%;
  font-size: 0.9em;
}

#btn2 {
  margin-left: 78%;
  width: 22%;
  height: 45px;
  font-size: 12px;
}


#busidiv3{
  margin: 0 auto;
  max-width: 80%;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  margin-top: 83px;
  height: 518px;
  margin-top: 10%;
}

.busi3 {
  width: 52%;
  height: 518px;
}

.business-t-box3 {
  max-width: 82%;
  margin-top: 150px;
  margin-left: 9%;
}

.txt3{
  font-size: 1.5em;
}

.txt3_3{
  width: 98%;
  font-size: 0.9em;
}

#btn3{
  width: 22%;
  margin-left: 75%;
  height: 45px;
  font-size: 12px;
}


#busidiv4{
  margin: 0 auto;
  max-width: 80%;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  margin-top: 83px;
  height: 518px;
  margin-top: 10%;
}

.busi4{
  width: 48%;
  height: 518px;
}

.business-t-box4 {
  max-width: 82%;
  margin-top: 150px;
  margin-left: 9%;
}

.txt4{
  font-size: 1.5em;
}

.txt4_4{
  width: 97%;
  font-size: 0.9em;
}

#btn4{
  width: 22%;
  margin-left: 75%;
  height: 45px;
  font-size: 12px;
}


#busidiv5{
  margin: 0 auto;
  max-width: 80%;
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600;
  display: flex;
  flex-direction: row;
  margin-top: 83px;
  height: 507px;
  margin-top: 10%;
}

.busi5{
  width: 52%;
  height: 507px;
}

.business-t-box5 {
  width: 100%;
  max-width: 40%;
  margin-top: 155px;
  margin-left: 4%;
}

.txt5{
  font-size: 1.5em;
}

.txt5_5{
  width: 97%;
  font-size: 0.9em;
}

#btn5{
  width: 22%;
  margin-left: 75%;
  height: 45px;
  font-size: 12px;
}

@media only screen and (max-width:1024px) {
  #busidiv {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
  }
  
  .busi1 {
    width: 50%;
    height: auto;
    margin-left: 0%;
  }
  
  .business-t-box {
    margin-top: 100px;
    margin-left: 5%;
  }
  
  .txt1{
    font-size: 1.5em;
  }
  
  .txt1_1 {
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }
  
  .btn-box-set-box {
    width: 100%;
    max-width: 95%;
  }
  
  #btn1{
    width: 23%;
    margin-left: 81%;
    height: 45px;
  }
  
  
  #busidiv2{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 83px;
    height: 455px;
    margin-top: 10%;
  }
  
  .busi2{
    width: 48%;
    height: 455px;
  }
  
  .business-t-box2 {
    max-width: 80%;
    margin-top: 100px;
    margin-left: 11%;
  }
  
  .txt2{
    font-size: 1.5em;
  }
  
  .txt2_2{
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }
  
  #btn2 {
    margin-left: 80%;
    width: 23%;
    height: 45px;
  }
  
  
  #busidiv3{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 83px;
    height: 518px;
    margin-top: 10%;
  }
  
  .busi3 {
    width: 52%;
    height: 518px;
  }
  
  .business-t-box3 {
    max-width: 82%;
    margin-top: 150px;
    margin-left: 9%;
  }
  
  .txt3{
    font-size: 1.5em;
  }
  
  .txt3_3{
    width: 98%;
    font-size: 0.9em;
  }
  
  #btn3{
    width: 23%;
    margin-left: 81%;
    height: 45px;
  }
  
  
  #busidiv4{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 83px;
    height: 518px;
    margin-top: 10%;
  }
  
  .busi4{
    width: 48%;
    height: 518px;
  }
  
  .business-t-box4 {
    max-width: 82%;
    margin-top: 150px;
    margin-left: 9%;
  }
  
  .txt4{
    font-size: 1.5em;
  }
  
  .txt4_4{
    width: 97%;
    font-size: 0.9em;
  }
  
  #btn4{
    width: 23%;
    margin-left: 81%;
    height: 45px;
  }
  
  
  #busidiv5{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 83px;
    height: 507px;
    margin-top: 10%;
  }
  
  .busi5{
    width: 52%;
    height: 507px;
  }
  
  .business-t-box5 {
    width: 100%;
    max-width: 40%;
    margin-top: 155px;
    margin-left: 4%;
  }
  
  .txt5{
    font-size: 1.5em;
  }
  
  .txt5_5{
    width: 97%;
    font-size: 0.9em;
  }
  
  #btn5{
    width: 23%;
    margin-left: 81%;
    height: 45px;
  }
}

@media only screen and (max-width:768px) {
  #businessmain{
    height: 2750px;
  }

  #busidiv {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
  }

  .busi1 {
    width: 50%;
    height: 350px;
    margin-left: 0%;
  }

  .business-t-box {
    margin-top: 10px;
    margin-left: 4%;
  }

  .txt1{
    font-size: 1.5em;
  }

  .txt1_1 {
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }

  .btn-box-set-box {
    width: 100%;
    max-width: 100%;
  }
  
  #btn1{
    width: 35%;
    margin-left: 60%;
    height: auto;
  }


  #busidiv2{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    height: auto;
    margin-top: 15%;
  }

  .busi2{
    width: 50%;
    height: 350px;
    margin-left: 0%;
  }

  .business-t-box2 {
    max-width: 95%;
    margin-top: 15px;
    margin-left: 0%;
  }

  .txt2{
    font-size: 1.5em;
  }
  
  .txt2_2{
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }

  #btn2 {
    margin-left: 0%;
    width: 35%;
    height: auto;
    margin-top: 10px;
  }


  #busidiv3 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 15%;
  }

  .busi3 {
    width: 50%;
    height: 350px;
    margin-left: 0%;
  }

  .business-t-box3 {
    max-width: 100%;
    margin-top: 10px;
    margin-left: 8%;
  }

  .txt3{
    font-size: 1.5em;
  }

  .txt3_3 {
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }
  
  #btn3{
    width: 35%;
    margin-left: 60%;
    height: auto;
    margin-top: -15px;
  }


  #busidiv4{
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    height: auto;
    margin-top: 15%;
  }

  .busi4{
    width: 50%;
    height: 350px;
    margin-left: 0%;
  }

  .business-t-box4 {
    max-width: 95%;
    margin-top: 15px;
    margin-left: 0%;
  }

  .txt4{
    font-size: 1.5em;
  }
  
  .txt4_4{
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }

  #btn4 {
    margin-left: 0%;
    width: 35%;
    height: auto;
    margin-top: 10px;
  }


  #busidiv5 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 15%;
  }

  .busi5 {
    width: 50%;
    height: 350px;
    margin-left: 0%;
  }

  .business-t-box5 {
    max-width: 100%;
    margin-top: 10px;
    margin-left: 5%;
  }

  .txt5{
    font-size: 1.5em;
  }

  .txt5_5 {
    max-width: 100%;
    width: 100%;
    font-size: 0.9em;
  }
  
  #btn5{
    width: 35%;
    margin-left: 60%;
    height: auto;
  }
}

@media only screen and (max-width:600px) {
  #businessmain{
    height: 2050px!important;
  }

  #busidiv {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi1 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box {
    margin-top: 0px;
    margin-left: 3%;
  }

  .txt1{
    font-size: 1.1em;
  }

  .txt1_1 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box {
    width: 100%;
    max-width: 100%;
  }
  
  #btn1{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }


  #busidiv2 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi2 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box2 {
    margin-top: 0px;
    margin-left: 0%;
    max-width: 95%;
  }

  .txt2{
    font-size: 1.1em;
  }

  .txt2_2 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box2 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn2{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }


  #busidiv3 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi3 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box3 {
    margin-top: 0px;
    margin-left: 3%;
  }

  .txt3{
    font-size: 1.1em;
  }

  .txt3_3 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box3 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn3{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }


  #busidiv4 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi4 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box4 {
    margin-top: 0px;
    margin-left: 0%;
    max-width: 95%;
  }

  .txt4{
    font-size: 1.1em;
  }

  .txt4_4 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box4 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn4{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }


  #busidiv5 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi5 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box5 {
    margin-top: 0px;
    margin-left: 3%;
  }

  .txt5{
    font-size: 1.1em;
  }

  .txt5_5 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box5 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn5{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }
}
@media only screen and (max-width:768px) {


  #businessmain {
    height: 3400px;
  }
}
  
/*
  .txt1_1 {
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box3 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn3{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
    margin-top: -15px;
  }


  #busidiv4 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi4 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box4 {
    margin-top: 0px;
    margin-left: 0%;
    max-width: 95%;
  }

  .txt4{
    font-size: 1.1em;
  }

  .txt4_4 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box4 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn4{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }


  #busidiv5 {
    height: auto;
    margin: 0 auto;
    max-width: 95%;
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    display: flex;
    flex-direction: row;
    margin-top: 60px;
  }

  .busi5 {
    width: 50%;
    height: 170px;
    margin-left: 0px;
    margin-top: 35px;
  }

  .business-t-box5 {
    margin-top: 0px;
    margin-left: 3%;
    max-width: 95%;
  }

  .txt5{
    font-size: 1.1em;
  }

  .txt5_5 {
    max-width: 100%;
    width: 100%;
    font-size: 0.6em;
    margin-top: -10px;
  }

  .btn-box-set-box5 {
    width: 100%;
    max-width: 100%;
  }
  
  #btn5{
    width: 52%;
    margin-left: 45%;
    height: 40px;
    font-size: 0.7em;
  }
}
/* 사업분야 페이지 내용 */
/* 사업분야 페이지 */








/*CCTV 페이지*/
#cctvmain{
  height: 6000px;
}

.network{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

@media only screen and (max-width:450px) {

  .network {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 45px;
  }
}




/*사업분야 중간 메뉴(공통)*/
.c-menubtn-div-a {
  padding-right: 1%;
  flex-wrap: wrap;
}

.c-menubtn-div {
  flex-wrap: wrap;
}

#row-center-div-c {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  max-width: 88.2%;
  margin: 0 auto;
  margin-top: 110px;
  padding-left: 0.9%;
}

#row-center-div-ccc {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  max-width: 90%;
  margin: 0 auto;
  margin-top: 110px;
}

#menubar3{
  max-width: 100%;
  width: 100%;
}

#menubar1_1 {
  max-width: 100%;
  width: 100%;
}

#menubarA{
  max-width: 100%;
  width: 100%;
}

#card1_1{
  height: 100%;
  width: 100%;
  background-color: #232942;
}

#cardA {
  height: 100%;
  width: 100%;
}

#cardA:hover{
  background-color: #232942;
  color: white!important;
}

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

@media only screen and (max-width:768px) {

  #row-center-div-c{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #row-center-div-ccc{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #row-center-div {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-left: 0px !important;
  }

  .c-menubtn-div {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
    position: relative;
    width: 46%;
    padding-right: 0%;
  }
  
  #menubarA {
    margin: 0 auto;
    max-width: 60%;
    margin-bottom: 10px;
  }

  #menubar1_1 {
    margin: 0 auto;
    max-width: 60%;
    margin-bottom: 10px;
  }

  #card1_1 {
    height: 100%;
    width: 80%;
    margin: 0 auto;
  }
}
/*사업분야 중간 메뉴(공통)*/

/*CCTV 페이지 내용*/

.conA {
  width: 95%;
  height: 300px;
  display: flex;
  align-items: center;
}

.cctv{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.hr{
  display: block;
  margin: 0 auto;
  margin-top: -55px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.cctvimg{
  width: auto;
  height: 250px;
  display: block;
  margin: 0 auto;
  transform: translate(0, 50%);
  margin-bottom: 120px;
  max-width: 85%;
}

.cctvsystem{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.cctvsystem-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.5em;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 120px;
}

.cctvsystemimgdiv {
  margin-top: 160px;
  height: 680px;
}

.cctvsystemimg {
  max-width: 70%;
  width: auto;
  height: 520px;
  display: block;
  margin: 0 auto;
  transform: translate(0, -10%);
}

.utp{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.utp-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.5em;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 120px;
}

.utpimgdiv {
  margin-top: 240px;
}

.utpimg{
  width: auto; 
  height: 535px; 
  display: block;
  margin: 0 auto;
  transform: translate(0, -15%);
}


.hr-utp-text {
  display: block;
  margin: 0 auto;
  margin-top: 0px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.conA-cctv-op-box2 {
  margin-top: 5px;
}

.ipnetwork{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.contain1 {
  margin-top: 155px;
}

#line1-1{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line1-2{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line1-3{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#cardd{
  width: 370px; 
  height: 440px;
}

.card-body{
  font-family: 'Noto Sans KR', sans-serif; 
  font-weight: 600;
  text-align: center;
}

#icon{
  display: contents;
}

.card-img-top{
  height: 230px;
}

.contain2{
  margin-top: 80px;
}

.contain3{
  margin-top: 80px;
}

#line2-1{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line2-2{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line2-3{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line3-1{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line3-2{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line3-3{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line4-1{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line4-2{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line4-3{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}
.contain4{
  margin-top: 80px;
}

.contain5{
  margin-top: 80px;
  margin-bottom: 150px;
}

#line5-1{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line5-2{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#line5-3{
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  flex: 0 0 3%;
}

#row-sss-box-id {
  width: 100%;
  max-width: 100%;
  display: flex;
  justify-content: center;
}

.hr-cctvip-text {
  display: block;
  margin: 0 auto;
  margin-top: 0px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.hr-network-text {
  display: block;
  margin: 0 auto;
  margin-top: -55px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}


@media only screen and (max-width:1024px) {


  #row-sss-box-id {
    width: 100%;
    max-width: 100%;
    display: flex;
    margin: 0 auto;
  }

  #cctvmain{
    height: 5800px;
  }

  .cctv {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .cctvsystem {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;  
  }

  .cctvsystem-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23px;
    color: #db4e4e;
    font-weight: 900;
    margin-bottom: 250px;
    margin-left: 65px;
  }

  .cctvsystemimg {
    width: auto;
    height: 400px;
    display: block;
    margin: 0 auto;
    transform: translate(0, -10%);
  }

  .cctvimg {
    width: 82%;
    height: 200px;
    display: block;
    margin: 0 auto;
    transform: translate(0, 50%);
    margin-bottom: 120px;
  }

  .utp {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .utp-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23px;
    color: #db4e4e;
    font-weight: 900;
    margin-bottom: 250px;
    margin-left: 65px;
  }

  .utpimg {
    width: auto;
    height: 430px;
    display: block;
    margin: 0 auto;
    transform: translate(0, -15%);
  }

  .ipnetwork {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  #line1-1 {
    margin-left: 25px;
    margin-right: -15px;
  }

  #line1-2 {
    margin-left: 0px;
    margin-right: -17px;
  }

  #line1-3 {
    position: relative;
    padding-right: 3%;
    padding-left: 2%;
  }

  #cardd {
    width: 260px;
    height: 450px;
  }

  #row-sss-box-id {
    max-width: 90%;

  }

  #line2-1 {
    margin-left: 25px;
    margin-right: -15px;
  }

  #line2-2 {
    margin-left: 0px;
    margin-right: -17px;
  }

  #line2-3 {
    margin-left: 0px;
  }

  #line3-1 {
    margin-left: 25px;
    margin-right: -15px;
  }

  #line3-2 {
    margin-left: 0px;
    margin-right: -17px;
  }

  #line3-3 {
    margin-left: 0px;
  }
 
  #line4-1 {
    margin-left: 25px;
    margin-right: -15px;
  }

  #line4-2 {
    margin-left: 0px;
    margin-right: -17px;
  }

  #line4-3 {
    margin-left: 0px;
  }

  #line5-1 {
    margin-left: 25px;
    margin-right: -15px;
  }

  #line5-2 {
    margin-left: 0px;
    margin-right: -17px;
  }

  #line5-3 {
    margin-left: 0px;
  }
}

@media only screen and (max-width:768px) {

  #cctvmain{
    height: 10400px;
  }

  #row-sss-box-id {
    display: block;
  }

  #line1-1 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  .cctv {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }

  .cctvsystem {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }
  
  .cctvsystemimg {
    width: auto;
    height: 280px;
  
  }
  .cctvsystem-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-bottom: 250px;
    margin-left: 55px;
  }


  .ipnetwork{
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }

  .utp {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }

  .utp-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-bottom: 250px;
    margin-left: 55px;
  }

  .utpimg {
    width: auto;
    height: 330px;
    display: block;
    margin: 0 auto;
    transform: translate(0, -15%);
    max-width: 85%;
  }

  #cardd {
    display: block;
    margin:0 auto;
    width: 370px;
    height: 440px;
    margin-bottom: 20px;
  }

  #line1-2 {
    width: 370px;
    display: block;
    margin: 0 auto;
  }

  #line1-3 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line2-1 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line2-2 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line2-3 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line3-1 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line3-2 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line3-3 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  
  #line4-1 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line4-2 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line4-3 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line5-1 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line5-2 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #line5-3 {
    width: 370px;
    margin-left: 0px;
    display: block;
    margin: 0 auto;
  }

  #card-body {
    width: 100%;
  }
}

@media only screen and (max-width:450px) {

  #cctvmain {
    height: 10000px;
  }

  .conA {
    width: 95%;
    height: 255px;
  }

  .cctv {
    font-size: 25px;
    margin-top: 95px;
    margin-left: 6%;
  }

  .cctvimg {
    width: auto;
    height: 80px;
    padding-top: 10px;
    margin-bottom: 0px;
  }

  .conA-cctvsystem-box3 {
    height: 150px;
    max-width: 81%;
    text-align: justify;
    text-align-last: auto;
    margin-left: 8%;
  }

  .cctvsystem {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 25px;
    margin-left: 6%;
    margin-top: 100px;
  }

  .cctvsystem-1 {
    font-size: 12px;
    margin-bottom: 0px;
    padding-top: 4px;
    margin-left: 0px;
    text-align: justify; 
    text-align-last: left;
  }

  .cctvsystemimg {
    width: auto;
    height: 180px;
    margin-top: -190px;
  }

  .cctv3 {
    margin-top:-400px;
  }

  .conA-cctv-op-box{
    height:45px;
  }

  .utp {
    font-size: 25px;
    margin-left: 6%;
  }

  .utp-1 {
    font-size: 13px;
    margin-left: 0px;
    padding-top: 40px;
  }

  .conA-cctv-op-box2{
    width: 85%;
    text-align: justify;
    text-align-last: auto;
    margin-left: 7%;
  }

  .utpimg {
    width: auto;
    height: 200px;
    margin-top: -130px;
  }

  .ipnetwork {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 25px;
    color: black;
    margin-top: 0px;
    margin-left: 6%;
  }

  .cctv4 {
    margin-top: 100px;
  }
  
  .conA-cctvsystem-box3 {
    height: 155px;
  }
  
  .hr-cctvip-text {
    margin-top: 10px;
    background: #232942;
    height: 2px;
    width: 89.5%;
  }

  #cardd {
    display: block;
    margin: 0 auto;
    width: 280px;
    margin-top: 50px;
    height: 480px;
  }

  #line1-1 {
    width: 330px;
  }

  .contain1 {
    margin-top: 125px;
  }

  #line1-2 {
    width: 330px;
  }

  #line1-3 {
    width: 330px;
  }

  #line2-1 {
    width: 330px;
  }

  #line2-2 {
    width: 330px;
  }

  #line2-3 {
    width: 330px;
  }

  #line3-1 {
    width: 330px;
  }

  #line3-2 {
    width: 330px;
  }

  #line3-3 {
    width: 330px;
  }

  #line4-1 {
    width: 330px;
  }

  #line4-2 {
    width: 330px;
  }

  #line4-3 {
    width: 330px;
  }

  #line5-1 {
    width: 330px;
  }

  #line5-2 {
    width: 330px;
  }

  #line5-3 {
    width: 330px;
  }











}



/*CCTV 페이지 내용*/
/*CCTV 페이지*/



/* 네트워크 페이지 */

#networkmain{
  height: 2300px;
}

/* 사업분야 현재 메뉴 */

#card2_2{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#card3_2{
  height: 100% !important; 
  width: 100% !important; 
  background-color: #232942;
}

@media only screen and (max-width:1024px) {

  #card3_2 {
    width: 100% !important;
    height: 100% !important;
  }
}
@media only screen and (max-width:768px) {

  #menubar3 {
    display: block;
    margin:0 auto;
  }

  #card3_2{
    height: 50px !important; 
    width: 300px !important; 
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }

  #cardbodyA {
    height: 50px; 
    width: 300px; 
  }
}

@media only screen and (max-width:450px) {

  #card3_2{
    height: 50px !important; 
    width: 250px !important; 
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }
}


/* 사업분야 현재 메뉴 */


/*네트워크 페이지 내용*/
.networkline{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.networklinediv1{
  display: block;
  margin: 0 auto;
  width: 89.5%;
  height: 400px;
  margin-top: 40px;
  background-image: url(../images/networklineimg1.png);
}

.networklineleft {
  height: 40%;
  width: 18px;
  margin-left: 3%;
  margin-top: 1.5%;
}

.networkline-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 500;
  margin-top: -29%;
  margin-left: 5%;
  width: 68%;
}



.networkdia{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.networkdiaimg{
  width: 75%;
  display: block;
  margin: 0 auto;
  margin-top: 150px;
}

@media only screen and (max-width:1024px) {

  #networkmain{
    height: 1900px;
  }

  .networkline {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left:55px;
  }

  .networkline-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 22px;
    color: black;
    margin-left: 29px;
    width: 52%;
  }

  .networklineleft {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23px;
    font-weight: 500;
    margin-left: 2px;
    width: 25px;
    height: 135px;
  }

  .networkdia {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left:55px;
  }

  .networkdiaimg {
    width: 85%;
    display: block;
    margin: 0 auto;
    margin-top: 175px;
  }

  #conA-m-t-text {
    margin-top:-80px;
  }
}


@media only screen and (max-width:768px) {

  #networkmain{
    height: 1900px;
  }

  .networkline {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }

  .networklineleft {
    height: 58%;
    width: 35px;
    margin-left: 15px;
    margin-top: 0.5%;
  }

  .networkline-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 22px;
    font-weight: 500;
    margin-top: -35%;
    margin-left: 3%;
    width: 35%;
  }

  .networkdia {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: -80px;
  }

  #hr-id-x {
    margin-top:-155px;
  }

  .networkdiaimg {
    width: 80%;
    display: block;
    margin: 0 auto;
    margin-top: 155px;
  }
}

@media only screen and (max-width:450px) {

  #networkmain {
    height: 1300px;
  }

  .networkline {
    font-size: 25px;
    margin-left: 6%;
  }

  .hr-network-text {
    margin-top: -45px;
    width: 89.5%;
    height: 2px;
    background: #232942;
  }

  .networkline-1 {
    font-size: 14px;
    width: 88%;
    margin-top: 0px;
  }

  .networklinediv1 {
    display: flex;
    margin: 0 auto;
    width: 89.5%;
    height: 320px;
    margin-top: 25px;
    background-image: url(../images/networklineimg1.png);
    flex-direction: row;
  }

  .networklineleft {
    height: 58%;
    width: 40px;
    margin-top: 18.5%;
  }

  .conA-networkline-box3 {
    width: 12%;
    height: 270px;
  }

  .networkline-1 {
    font-size: 14px;
    width: 88%;
    margin-top: -80px;
  }

  .networkdia {
    font-size: 25px;
    margin-left: 6%;
    margin-top: -123px;
  }

  #conA-m-t-text {
    height: 210px;
  }

  #hr-id-x {
    margin-top: -145px;
  }

  .networkdiaimg {
    width: auto;
    margin-top: 90px;
    height: 153px;
  }
}




/*네트워크 페이지 내용*/
/* 네트워크 페이지 */









/* 전산ㆍ유지보수 페이지 */
#maintenancemain{
  height: 2400px;
}

.mro{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
  margin-bottom: -24px;
}

@media only screen and (max-width:450px) {
  .mro{
    font-family: 'Noto Sans KR', sans-serif; 
    font-size: 45px;
    font-weight: 900;
    text-align: center;
    margin-top: 270px;
    margin-bottom: -25px;
  }
}

/* 사업분야 현재 메뉴 */
#card1_1{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

@media only screen and (max-width:1024px) {


}

@media only screen and (max-width:768px) {

  #cardbodyA {
    width: 300px;
    height: 50px;
  }

  .mainten-margin-box {
    margin-top:0px !important;
  }
}


/* 사업분야 현재 메뉴 */

/* 전산ㆍ유지보수 페이지 내용 */

.c-b-1 {
  display: flex;
  flex-direction:column;
  background: white;
  width: 100%;
  max-width: 95%;
  height: 180px;
  margin:0 auto;
}

.c-b-2 {
  background-color:white;
  width: 100%;
  max-width: 95%;
  height: 180px;
  margin:0 auto;
}

.c-b-3 {
  background-color:white;
  width: 100%;
  max-width: 95%;
  height: 180px;
  margin:0 auto;
}

.conA-1 {
  margin-top:80px;
}

.conA-2 {
  padding-top:40px;
}

.conA-3 {
  padding-top:40px;
}

.conA-1-1 {
  padding-top: 0.5%;
}

.conA-1-2 {
  padding-top: 0.5%;
}

.conA-1-3 {
  padding-top: 0.5%;
}

.mrotxt{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.mrotxt-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.8em;
  font-weight: 600;
  margin-top: -5%;
  margin-left: 5.2%;
  width: 100%;
}

.mrotxt-11{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 500;
  margin-left: 8%;
  width: 100%;
}

.mrotxt-2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.8em;
  font-weight: 600;
  margin-left: 5.2%;
  width: 100%;
}

.mrotxt-22{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 500;
  margin-left: 8%;
  width: 100%;
}

.mrotxt-3{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.8em;
  font-weight: 600;
  margin-left: 5.2%;
  width: 100%;
}

.mrotxt-33{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.7em;
  font-weight: 500;
  margin-left: 8%;
  width: 100%;
}

.mroimg{
  width: 60%;
  display: block;
  margin: 0 auto;
  margin-top: 100px;
}


@media only screen and (max-width:1024px) {

  #maintenancemain {
    height: 1750px;
  }

  .mrotxt {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .mrotxt-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 27PX;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
    margin-top: 150px;
  }

  .mrotxt-11 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23PX;
    font-weight: 500;
    margin-left: 120px;
    width: 100%;
    margin-top: 20px;
  }

  .mrotxt-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 27PX;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
    margin-top: 0px;
  }

  .mrotxt-22 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23PX;
    font-weight: 500;
    margin-left: 122px;
    width: 100%;
    margin-top:0px;
  }

  .mrotxt-3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 27PX;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
    margin-top:0px;
  }

  .mrotxt-33 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 23PX;
    font-weight: 500;
    margin-left: 120px;
    width: 70%;
    margin-top:0px;
  }

  .mroimg {
    margin-top:50px;
  }
}

@media only screen and (max-width:768px) {

  #maintenancemain {
    height: 1780px;
  }

  .mrotxt {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 40px;
    margin-top: 120px;
  }

  .mrotxt-11 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21PX;
    font-weight: 500;
    margin-left: 120px;
    width: 71%;
    margin-top: 50px;
  }

  .mrotxt-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 27PX;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
    margin-top: 50px;
  }

  .con-m-t-b-text2 {
    width: 100%;
    height: 30px;
    margin-top: 35px;
    display: flex;
    align-items: center;
  }

  .mroimg {
    width: 85%;
    display: block;
    margin: 0 auto;
    margin-top:30px;
  }
}

@media only screen and (max-width:450px) {
  #maintenancemain {
    height: 1500px;
  }

  .mrotxt {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 25px;
    color: black;
    font-weight: 900;
    margin-left: 20px;
    margin-top: 100px;
  }

  .conA-1 {
    margin-top:30px;
    margin-left: -70px;
  }
  
  .conA-2 {
    margin-top:-40px;
    margin-left: -70px;
  }
  
  .conA-3 {
    margin-top:-30px;
    margin-left: -70px;
  }

  .conA-1-1 {
    padding-top: 0.5%;
    width: 73%;
    margin-left: 38px;
    margin-top: 5px;
  }

  .conA-1-2 {
    padding-top: 0.5%;
    width: 73%;
    margin-left: 38px;
    margin-top: -25px;
  }

  .conA-1-3 {
    padding-top: 0.5%;
    width: 73%;
    margin-left: 38px;
    margin-top: 10px;
  }

  .mrotxt-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 20px;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
  }

  .mrotxt-11 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 15px;
    font-weight: 500;
    margin-left: 3px;
    width: 71%;
    margin-top: 50px;
  }

  .mrotxt-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 20px;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
  }

  .con-m-t-b-text2 {
    width: 100%;
    height: 30px;
    margin-top: -5px;
    display: flex;
    align-items: center;
  }

  .mrotxt-22 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 15px;
    font-weight: 500;
    margin-left: 3px;
    width: 61%;
    margin-top: 50px;
  }

  .mrotxt-3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 20px;
    font-weight: 600;
    margin-left: 80px;
    width: 100%;
  }

  .mrotxt-33 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 15px;
    font-weight: 500;
    margin-left: 3px;
    width: 61%;
    margin-top: 50px;
  }

  .mroimg {
    width: 85%;
    display: block;
    margin: 0 auto;
    margin-top:30px;
  }
}
/* 전산ㆍ유지보수 페이지 내용 */
/* 전산.유지보수 페이지 */










/* 빔프로젝터 페이지 */
#projectormain{
  height: 9000px;
}

.projector{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
  margin-bottom: -24px;
}

@media only screen and (max-width:450px) {

  .projector {
    font-size: 45px;
    margin-bottom: -25px;
  }
}

/* 사업분야 현재 메뉴 */
#card1_1{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}


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

@media only screen and (max-width:768px) {

  #card1_1{
    height: 500px; 
    width: 300px; 
    background-color: #232942;
  }

  #menutexts {
    margin-top:0px;
  }

  #cardbodyA {
    width: 300px;
    height: 50px;
  }
}

/* 사업분야 현재 메뉴 */


/* 빔프로젝터 페이지 내용 */

.conB {
margin-top:180px;
}

.conB-1 {
  margin-top: 10px;
  font-size: 14px;
  margin-left: -1%;
}

.conB-text1 {
  margin-top: 70px;
  margin-left:5.5%;
}

.hr-b {
  display: block;
  margin: 0 auto;
  margin-top: 5px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.beam{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
}

.beam-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.5em;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 140px;
}

.beam-2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  color: black;
  font-weight: 500;
  margin-bottom: 560px;
  margin-left: 2.8%;
  width: 700px;
  white-space: break-spaces;
}

.beamimgdiv{
  width: 100%;
  margin-top: 80px;
  max-width: 90%;
  margin: 0 auto;
  margin-top: 90px;
}

.beamimg{
  width: auto; 
  height: 360px;
  margin-top: -550px; 
  display: block;
  margin: 0 auto;
}

.projector1-2 {
  display: flex;
  width: 100%;
  background-color: #EDEDED;
  height: 470px;
  margin-bottom: 100px;
  max-width: 100%;
  margin: 0 auto;
  margin-top: 150px;
}

.pj-box1 {
  margin: 0 auto;
  width: 60%;
}

.pj-box2 {
  width: 38%;
  margin: 0 auto;
}

.beamline{
  height: 130px;
  margin-left: 200px;
  margin-top: 170px;
}

.beam-3 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  color: black;
  font-weight: 500;
  margin-top: -130px;
  margin-left: 230px;
  width: 65%;
  max-width: 64%;
}

.beamimg2{
  width: auto;
  height: 400px;
  padding-top: 5%;
}

.beam-4{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.1em;
  color: #db4e4e;
  font-weight: 900;
  padding-top: 1%;
  margin-left: 30px;
}

.beamskill{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.beamskillimg{
  display: block;
  margin: 0 auto;
  margin-top: 120px;
  width: 90%;
}

.beamskillimg2{
  width: 78%;
  display: block;
  margin: 0 auto;
}

.beamskillimg3{
  width: 100%;
  height: 380px;
  margin-top: 150px;
}

.beamskilltxt3{
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 500;
  font-size: 29px;
  text-align: center;
  margin-top: -230px;
}

.beamskilltxt3-1{
  font-weight: 900;
}

.beamskilltxt5-1{
  width: 485px;
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2em;
  font-weight: 900;
  color: #38405f;
  height: 90px;
  display: block;
  margin: 0 auto;
}

.beamskilltxt5-2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.4em;
  font-weight: 500;
  width: 485px;
  max-width: 100%;
  margin: 0 auto;
}

.projector3{
  margin-top: 0px;
}

.beamex{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.beameximg1{
  display: block;
  margin: 0 auto;
  width: 40%;
  margin-top: 130px;
}

.beamextxt1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  font-weight: 600;
  text-align: center;
}

.beameximg2{
  display: block;
  margin: 0 auto;
  width: 40%;
  margin-top: 130px;
}

.beamskillimg4 {
  width: 53%;
  margin-left: 15%;
  padding-top: 60px;
}

.beamextxt2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  font-weight: 600;
  text-align: center;
  margin-top: 10px;
}

.beamskilltxtdiv5 {
  width: 45%;
  margin-left: -5%;
  padding-top: 80px;
}

.beamskilldivbox {
  display: flex;
  width: 100%;
  max-width: 90%;
  height: 400px;
  flex-direction: row;
  justify-content: center;
  margin: 0 auto;
  margin-top: 260px;
}


@media only screen and (max-width:1024px) {

  #projectormain {
    height: 6550px;
  }

  .pj-box1 {
    margin: 0 auto;
    width: 75%;
    display: flex;
  }

  .beamline {
    width: 25px;
    height: 250px;
    margin-left: 35px;
    margin-top: 25px;
  }

  .beam-3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    color: black;
    font-weight: 500;
    margin-left: 2%;
    width: 90%;
    padding-top: 27%;
  }
  .beamskilltxtdiv5 {
    width: 50%;
    margin-left: -5%;
    padding-top: 80px;
  }

  .beamskillimg4 {
    width: 65%;
    margin-left: 10%;
    padding-top: 93px;
  }

  .beamskilltxt5-1 {
    width: 410px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 26px;
    font-weight: 900;
    color: #38405f;
    height: 90px;
    display: block;
    margin: 0 auto;
  }

  .beamskilltxt5-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    font-weight: 500;
    width: 408px;
    max-width: 100%;
    margin: 0 auto;
  }
  
  .conB-text1 {
    margin-top: 80px;
    margin-left:2.5%;
  }

  .beamimg {
    width: auto;
    height: 300px;
    margin-top: -550px;
    display: block;
    margin: 0 auto;
  }  

  .beamimg2 {
    width: auto;
    height: 280px;
    margin-left: 20px;
    padding-top: 5%;
  }

  .beam {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .beam-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-left: 65px;
    margin-top: 10px;
    margin-bottom: 0px !important;
  }

  .beam-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    color: black;
    font-weight: 500;
    margin-left: 6%;
    margin-bottom: 0px;
    width: 52%;
  }

  .beamimgdiv {
    margin-top:0px;
  }

  .pro-margin-t-text {
    height: 30px;
  }

  .pro-margin-t-text2 {
    height: 230px;
  }

  .projector1-2 {
    background-color: #EDEDED;
    margin-top: 100px;
    height: 300px;
    margin-bottom: 0px;
  }

  .projector1 {
    height: 1200px;
  }

  .project-margin-t-box {
    width: 95%;
    height: 160px;
    display: flex;
    align-items: center;
  }

  .beamskill {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 2.5em;
    color: black;
    font-weight: 900;
    margin-left: 6%;
    margin-top: -15px;
  }
}

@media only screen and (max-width:768px) {

  #projectormain {
    height: 5550px;
  }

  .conB {
    margin-top:230px;
  }

  .conB-1 {
    margin-top: 0px;
    font-size: 13px;
    margin-left:1%;
  }

  .conB-text1 {
    margin-top: 80px;
  }

  .beam {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  .beam-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-bottom: 250px;
    margin-left: 55px;
    margin-top:10px;
  }

  .beam-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 18px;
    color: black;
    font-weight: 500;
    margin-bottom: 560px;
    margin-left: 45px;
    width: 40%;
  }

  .pro-margin-t-text {
    width: 100%;
    height: 30px;
    display: flex;
    align-items: center;
  }

  .beamimg {
    width: auto;
    height: 235px;
    margin-top: -550px;
    display: block;
    margin: 0 auto;
  }
  
  .beam-3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: black;
    font-weight: 500;
    margin-top: -90px;
    margin-left: 38px;
    width: 90%
  }

  .projector1 {
    height: 1015px;
  }

  .projector1-2 {
    background-color: #EDEDED;
    margin-top: 110px;
    height: 335px;
    margin-bottom: 100px;
  }

  .projector3 {
    margin-top: 50px;
  }

  .beamline {
    height: 115px;
    margin-left: 10px;
    margin-top: 80px;
    width: 25px;
  }

  .beamskilltxtdiv5 {
    width: 37%;
    margin-left: 10%;
    padding-top: 39px;
  }

  .beamskilltxt5-1 {
    width: 100%;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 22px;
    font-weight: 900;
    color: #38405f;
    height: 90px;
    display: block;
    margin: 0 auto;
  }

  .beamskilltxt5-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    font-weight: 500;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }
  
  .beamskill {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  .project-margin-t-box {
    height: 210px;
  }

  .hr-text2 {
    margin-top:-10px;
  }

  .beamskillimg {
    display: block;
    margin: 0 auto;
    margin-top: 120px;
    width: 92%;
  }

  .beamskillimg3 {
    width: 101%;
    height: 220px;
    margin-top: 100px;
  }

  .beamskilltxt3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 500;
    font-size: 21px;
    text-align: center;
    margin-top:-140px;
  }

  .beamskilldivbox {
    display: flex;
    width: 100%;
    max-width: 90%;
    height: 275px;
    flex-direction: row;
    justify-content: center;
    margin: 0 auto;
    margin-top: 135px;
  }

  .beamskillimg4 {
    width: auto;
    height: 180px;
    margin: 0 auto;
    display: block;
  }
  
  .beamex {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 25px;
  }

  .project-margin-t-box2 {
    height: 210px;
  }

  .beamskillimgdiv2 {
    margin-top:10px;
  }
}

@media only screen and (max-width:450px) {

  #projectormain {
    height: 3800px;
  }

  .conB {
    margin-top: 100px;
  }

  .beam {
    font-size: 25px;
    margin-top: 0px;
    margin-left: 20px;
  }

  .beam-1 {
    font-size: 13px;
    margin-bottom: 0px;
    margin-left: 30px;
    margin-top: -30px;
  }

  .pro-margin-t-text {
    height: 65px;
  }

  .conB-text1 {
    width: 100%;
    max-width: 85%;
    margin: 0 auto;
    margin-top: 25px;
  }

  .beam-2 {
    font-size: 14px;
    width: 40%;
    margin-left: 0px;
    margin-bottom: 0px;
    white-space: inherit;
  }

  .pro-margin-t-text2 {
    height: 170px;
  }

  .beamimg {
    width: auto;
    height: 125px;
  }

  .projector1-2 {
    display: flex;
    flex-direction: column;
    height: 380px;
  }

  .beamline {
    height: 150px;
    margin-top: 50px;
  }

  .pj-box1 {
    margin: 0 auto;
    width: 110%;
    display: flex;
  }
  
  .beam-3 {
    font-size: 13px;
    margin-left: 0px;
    margin-top: 58px;
    padding-top: 0px;
    width: 100%;
  }

  .beamimg2 {
    float: right;
    height: 125px;
    width: 28%;
    padding-top: 0px;
  }

  .pj-box2 {
    height: 127px;
    display: flex;
    width: 80%;
    flex-direction: column;
    align-items: flex-end;
  }

  .beam-4 {
    font-size: 7px;
  }

  .beamskill {
    font-size: 25px;
    margin-top: 0px;
    margin-left: 20px;
  }

  .project-margin-t-box {
    height: 70px;
  }

  .beamskillimg {
    margin-top: 75px;
  }

  .beamskillimg3 {
    height: 125px;
    margin-top: 70px;
  }

  .beamskilltxt3 {
    font-size: 11px;
    margin-top: -75px;
  }

  .beamskilldivbox {
    display: flex;
    width: 100%;
    max-width: 90%;
    height: 275px;
    flex-direction: column;
    margin: 0 auto;
    margin-top: 100px;
    align-items: center;
  }

  .beamskillimg4 {
    padding-top: 80px;
  }

  .beamskilltxtdiv5 {
    width: 100%;
    padding-top: 45px;
    text-align: center;
    margin-left: 0px;
  }

  .beamskilltxt5-1 {
    width: 100%;
    font-size: 18px;
    height: 65px;
  }

  .beamskilltxt5-2 {
    font-size: 13px;
    width: 100%;
    max-width: 83%;
    margin: 0 auto;
  }

  .beamex {
    font-size: 25px;
    margin-left: 6%;
  }

  .project-margin-t-box2 {
    height: 180px;
  }

  .beameximg1 {
    width: 60%;
    margin-top: 100px;
  }

  .beamextxt1 {
    font-size: 15px;
  }

  .beameximg2 {
    width: 60%;
    margin-top: 80px;
  }

  .beamextxt2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 15px;
  }
  








  
}
/* 빔프로젝터 페이지 내용 */
/* 빔프로젝터 페이지 */



/* 전자칠판 페이지 */

#iwbmain{
  height: 10300px;
}

.iwb{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
  margin-bottom: -24px;
}

@media only screen and (max-width:450px) {

  .iwb {
    font-size: 45px;
    margin-bottom: -25px;
  }
}


/* 사업분야 현재 메뉴 */

#card2_2{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

@media only screen and (max-width:1024px) {
 
  #card2_2 {
    height: 100%;
    width: 100%;
    background-color: #232942;
  }
}

@media only screen and (max-width:768px) {

  #card2_2 {
    height: 50px !important;
    width: 300px !important;
    background-color: #232942;
    display: block;
    margin: 0 auto;
}

  #cardA {
    height: 50px;
    width: 300px;
  }
}

/* 사업분야 현재 메뉴 */


/* 전자칠판 페이지 내용 */

.iwb1 {
  margin-top: 180px;
}

.board {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
}

.hr-text4 {
  display: block;
  margin: 0 auto;
  margin-top: 5px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.hr-text5 {
  display: block;
  margin: 0 auto;
  margin-top: 70px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.hr-text7 {
  display: block;
  margin: 0 auto;
  margin-top: 70px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.hr-text8 {
  display: block;
  margin: 0 auto;
  margin-top: 75px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.board-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 22px;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 120px;
}

.board-2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  color: black;
  font-weight: 500;
  margin-left: 13%;
  width: 63.7%;
}

.con-a-width {
  width:100%;
  height: 60px;
  display: flex;
  align-items: center;
  margin-top: 180px;
}

.con-a-width2 {
  width: 95%;
  height: 50px;
  display: flex;
  align-items: center;
}

.con-a-width3 {
  width: 95%;
  height: 200px;
  display: flex;
  align-items: center;
  margin-top: 150px;
  max-width: 66%;
}

.iwb-big-box {
  display: flex;
  height: 650px;
}

.boardimgdiv {
  margin-top: 0px;
  height: 400px;
  margin-top: 25px;
  margin-left: -6%;
}

.boardimg {
  width: auto;
  height: 420px;
}

.boardskill{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 6%;
  margin-top: 120px;
}

.boardskillimg{
  width: 90%;
  display: block;
  margin: 0 auto;
  margin-top: 120px;
}

.boardcha{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: -130px;
}

.boardcha-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.8em;
  font-weight: 900;
  margin-bottom: 80px;
  margin-top: -30px;
  text-align: center;
  margin: 0 auto;
}

.boardchaimg{
  width: 65%;
  display: block;
  margin: 0 auto;
  margin-top: 170px;
}

.boardtype{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.boardtypeimg{
  width: 65%;
  display: block;
  margin: 0 auto;
  margin-top: 250px;
}

.iwb5{
  background-image: url('../images/swback.png');
  height: 2600px;
  margin-top: 100px;
}

.sw{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 140px;
}

.sw-1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.8em;
  font-weight: 900;
  margin-bottom: 100px;
  margin:0 auto;
}

.swimg{
  width: 60%;
  display: block;
  margin: 0 auto;
  margin-top: 70px;
}

.swimg2{
  width: 60%;
  display: block;
  margin: 0 auto;
  margin-top: 80px;
}

@media only screen and (max-width:1024px) {
 
  #iwbmain{
    height: 7750px;
  }

  #board2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .hr-text4 {
    display: block;
    margin: 0 auto;
    margin-top: 65px;
    width: 89.5%;
    height: 2px;
    background: #232942;
  }

  .hr-text5 {
    display: block;
    margin: 0 auto;
    margin-top: 63px;
  }

  #iwb-text-box {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    color: black;
    font-weight: 500;
    margin-bottom: 0px;
    margin-left: 88px;
    width: 85%;
    margin-top: -3px;
    height: 400px;
  }

 #board-1-text {
    width: 100%;
    height: 40px;
    display: flex;
    align-items: center;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 18px;
    color: #db4e4e;
    font-weight: 900;
    margin-left: 7%;
    margin-top: -10px;
   }

  .boardskill {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
    margin-top: 120px;
  }

  .boardskillimgdiv {
    height: 880px;
  }

  .hr-text6 {
    margin-top:60px;
  }

  .boardcha {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 6%;
    margin-top: 120px;
  }

  .boardcha-1 {
    display: block;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 1.8em;
    font-weight: 900;
    margin-bottom: 80px;
    margin: 0 auto;
    margin-top: 150px;
  }

  .boardchaimgdiv {
    height: 980px;
  }

  .boardchaimg {
    width: auto;
    height: 900px;
    display: block;
    margin: 0 auto;
    margin-top: 120px;
  }

  .boardtype {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px;
  }

  .hr-text7 {
    margin-top:60px;
  }

  .boardtypeimgdiv {
    height: 960px;
  }

  .boardtypeimg {
    height: 900px;
    width: auto;
    display: block;
    margin: 0 auto;
    margin-top: 180px;
  }
  
  .sw {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 55px
  }

  .sw-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 100px;
    display: block;
    margin: 0 auto;
  }

  .hr-text8 {
    margin-top:70px;
  }

  .swimgdiv {
    margin-top:20px;
  }

  .swimg {
    width: 60%;
    display: block;
    margin: 0 auto;
    margin-top:-20px;
  }

  .iwb5 {
    background-image: url(../images/swback.png);
    height: 1400px;
    margin-top: 100px;
  }

  .margin-top-x-box2 {
    width: 100%;
    height: 100px;
    display: flex;
    align-items: center;
    margin-top: 70px;
  }

  #board-1-text3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }
}

@media only screen and (max-width:768px) {

  #iwbmain{
    height: 6450px;
  }

  .iwb1 {
    margin-top: -90px;
  }

  .con-a-width3 {
    width: 95%;
    height: 200px;
    display: flex;
    align-items: center;
    margin-top: 150px;
    max-width: 90%;
  }

  .hr-text5 {
    margin-top:60px;
  }

  #board2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  #board-1-text {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left: 55px;
  }

  #iwb-text-box {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 21px;
    color: black;
    font-weight: 500;
    margin-left: 55px;
    margin-top: 80px;
    margin-bottom: 0px;
    width: 100%;
  }

  .iwb-big-box {
    display: flex;
    height: 425px;
  }

  .bor-margin-t-box {
    width: 1700px;
    height: 30px;
    display: flex;
    align-items: center;
  }

  .boardimgdiv {
    margin-top:0px !important;
  }

  .boardimg {
    display: none;
  }

  #board-1-text2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  .boardskillimgdiv {
    height: 660px;
  }

  .boardskillimg {
    height: 610px;
    width: auto;
    display: block;
    margin: 0 auto;
    margin-top: 120px;
  }

  #board-1-text3 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  .margin-top-x-box {
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
    margin-top:90px;
  }

  .boardtypeimgdiv {
    height:730px;
  }

  .boardchaimgdiv {
    height: 620px;
  }

  .boardchaimg {
    display: block;
    margin: 0 auto;
    margin-top: 30px !important; 
    width: auto;
    height: 500px;
  }

  #board-1-text4 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  #iwb-img2 {
    height: 720px;
    display: block;
    margin: 0 auto;
    margin-top: 150px;
    width: auto;
  }

  #sw-text-box {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 30px;
    color: black;
    font-weight: 900;
    margin-left: 45px;
    margin-top: 120px;
  }

  #sw-center-box {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 22px !important;
    font-weight: 900;
    display: block !important;
    margin: 0 auto !important;
    margin-top:120px !important;
  }

  .margin-top-x-box2 {
    width: 100%;
    height: 75px;
    display: flex;
    align-items: center;
  }

  .swimgdiv {
    margin-top: 70px;
  }

  .swimg {
    width: auto;
    height: 300px;
    display: block;
    margin: 0 auto;
    margin-top:0px;
  }

  .swimg2 {
    width: auto;
    height: 425px;
    display: block;
    margin: 0 auto;
    margin-top:45px;
  }

  .iwb5 {
    background-image: url(../images/swback.png);
    height: 1273px;
    margin-top: 100px;
  }

  .margin-top-x-box3 {
    width: 100%;
    height: 65px;
    display: flex;
    align-items: center;
  }

  .hr-text3 {
    display: block;
    margin: 0 auto;
    margin-top:60px !important;
    width: 89.5%;
    height: 2px;
    background: #232942;
  }

  .hr-text8 {
    margin-top: 60px;
  }
}

@media only screen and (max-width:450px) {

  #iwbmain {
    height: 3295px;
  }

  .iwb1 {
    margin-top: 0px;
  }

  .con-a-width {
    margin-top: 25px;
  }

  #board2 {
    font-size: 25px;
    margin-left: 6%;
  }

  .hr-text4 {
    margin-top: 55px;
  }

  #board-1-text {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 14px;
    margin-left: 1.8%;
  }

  #iwb-text-box {
    font-size: 10px;
    width: 88%;
    margin: 0 auto;
    margin-top: -20px;
  }

  .con-a-width3 {
    width: 95%;
    max-width: 90%;
    margin: 0 auto;
    margin-top: 150px;
  }

  .iwb-big-box {
    display: flex;
    height: 170px;
  }

  #board-1-text2 {
    font-size: 25px;
    margin-left: 6%;
  }

  .hr-text5 {
    margin-top: 55px;
  }

  .boardskillimg {
    height: 335px; 
    margin-top: 50px;
  }

  .boardskillimgdiv {
    height: 200px;
  }

  .iwb3{
    margin-top: 100px;
  }

  #board-1-text3 {
    font-size: 25px;
    margin-left: 6%;
    margin-top: 200px;
  }

  .hr-text6 {
    margin-top: 95px;
  }

  .margin-top-x-box {
    margin-top: 40px;
  }

  .boardcha-1 {
    font-size: 18px;
    margin: 0 auto;
    margin-top: -25px;
  }

  .boardchaimg {
    display: block;
    margin: 0 auto;
    margin-top: 20px !important;
    width: auto;
    height: 370px;
  }

  .boardchaimgdiv {
    height: 260px;
  }

  .iwb4{
    margin-top: 100px;
  }

  #board-1-text4 {
    font-size: 25px;
    margin-left: 6%;
    margin-top: 200px;
  }

  .hr-text7 {
    margin-top: 95px;
  }

  #iwb-img2 {
    height: 470px;
    display: block;
    margin: 0 auto;
    margin-top: 60px;
  }

  .boardtypeimgdiv {
    height: 440px;
  }

  #sw-text-box {
    font-size: 25px;
    margin-top: 60px;
    margin-left: 6%;
  }

  .hr-text3 {
    display: block;
    margin: 0 auto;
    margin-top: 22px !important;
  }

  .margin-top-x-box2 {
    height: 20px;
  }

  #sw-center-box {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 20px !important;
  }

  .swimg {
    height: 170px;
  }

  .swimg2 {
    height: 240px;
  }

  .iwb5 {
    background-image: url(../images/swback.png);
    height: 800px;
  }
}


/* 전자칠판 페이지 내용 */
/* 전자칠판 페이지 */











/* LED 전광판 페이지 */
#billboardmain{
  height: 4400px;
}

.led{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

@media only screen and (max-width:450px) {

  .led {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 40px;
  }
}

/* 사업분야 현재 메뉴 */
#card1_1{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}
/* 사업분야 현재 메뉴 */


/* LED 전광판 페이지 내용 */

.conA-led-box {
  width: 95%;
  height: 235px;
  display: flex;
  align-items: center;
  margin-top: 35px;
}

.conA-led-box2 {
  width: 95%;
  height: 55px;
  display: flex;
  align-items: center;
}

.conA-led-box3 {
  width: 2%;
  height: 160px;
  display: flex;
  align-items: center;
  margin-left: 6%;
}

.conA-led-box4 {
  width: 90%;
  height: 300px;
  display: flex;
  align-items: center;
}

.ledintro-2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  color: black;
  font-weight: 900;
  margin-left: 0.2%;
  margin-top: -140px;
  width: 51%;
}

.conA-ledboard-box {
  width: 90%;
  height: 200px;
  display: flex;
  align-items: center;
}

.conA-ledboard-box2 {
  width: 90%;
  height: 55px;
  display: flex;
  align-items: center;
}

.conA-ledboard-box3 {
  width: 100%;
  height: 300px;
  display: flex;
  text-align: center;
}

.led1{
  margin-bottom: 0px;
}

.ledintro{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.ledintro-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 120px;
  margin-top: -13px;
}

.intro-text-box {
  display: flex;
  flex-direction: row;
}

.ledline {
  height: 39%;
  width: 113px;
  margin-left: 60%;
  margin-top: 5%;
}

.ledboard-2 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 500;
  width: 90%;
  margin: 0 auto;
  padding-top: 60px;
}

.hr-led-intro {
  display: block;
  margin: 0 auto;
  margin-top: -25px;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.ledboard{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 20px;
}

.ledboard-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 122px;
  margin-bottom: 0px;
}

.ledboard-3{
  font-weight: 900;
  color: #232942;
}

.ledboard-img-box {
  display: flex;
  max-width: 90%;
  margin: 0 auto;
}

.ledboardimgdiv {
  margin:0 auto;
  width: 25%;
}

.ledboardimgdiv2 {
  margin:0 auto;
  width: 25%;
}

.ledboardimg {
  width: 100%;
}

.ledboardimg2 {
  width: 100%;
}

.ledboardimgtxt1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 600;
  text-align: center;
  padding-top: 10px;
}

.ledboardimgtxt2 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  font-weight: 600;
  text-align: center;
  padding-top: 10px;
}

.led3{
  margin-top:150px;
}

.conA-ledboard-op2 {
  width: 95%;
  height: 300px;
  display: flex;
  flex-direction: column;
  margin-top:100px;
}

.conA-ledboard-op3 {
  width: 95%;
  height: 250px;
  display: flex;
  flex-direction: column;
  margin-top:50px;
}

.conA-ledboard-op4 {
  width: 95%;
  height: 200px;
  display: flex;
  flex-direction: column;
}

.hr-ledboard-op {
  display: block;
  margin: 0 auto;
  margin-top: 10px;
  width: 87.5%;
  height: 2px;
  background: #232942;  
}

.ledboardcon{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 120px;
}

.pixel {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 600;
  margin-left: 7%;
}

.pixel-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 22px;
  font-weight: 500;
  margin-left: 8%;
}

.module {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 600;
  margin-left: 7%;
}

.module-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 22px;
  font-weight: 500;
  margin-left: 8%;
}

.cabinet {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 600;
  margin-left: 7%;
}

.cabinet-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 22px;
  font-weight: 500;
  margin-left: 8%;
}

.conA-ledsystem-box {
  width: 95%;
  height: 200px;
  display: flex;
  align-items: center;
}

.system_g {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 15px;
}

.systemimg {
  width: 55%;
  display: block;
  margin: 0 auto;
  margin-top: 5%;
}

@media only screen and (max-width:1024px) {

  #billboardmain{
    height: 4000px;
  }

  .conA-ledboard-op2 {
    width: 95%;
    height: 300px;
    display: flex;
    flex-direction: column;
    margin-top: 100px;
  }
  
  .conA-ledboard-op3 {
    width: 95%;
    height: 300px;
    display: flex;
    flex-direction: column;
    margin-top: 180px;
  }

  .conA-ledboard-op4 {
    width: 95%;
    height: 200px;
    display: flex;
    flex-direction: column;
    margin-top: 90px;
  }
}

@media only screen and (max-width:768px) {

  #billboardmain{
    height: 3800px;
  }

  .conA-led-box2 {
    width: 95%;
    height: 40px;
    display: flex;
    align-items: center;
  }

  .conA-led-box3 {
    width: 3%;
    height: 100px;
    display: flex;
    align-items: center;
    margin-left: 6%;
  }

  .conA-led-box4 {
    width: 62%;
    height: 100px;
    display: flex;
    align-items: center;
    margin-left: 1%;
  }

  .ledline {
    height: 75%;
    width: 25px;
    margin-left: 5.5%;
    margin-top: 5%;
  }

  .ledintro {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
  }

  .ledintro-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-left: 7%;
  }

  .intro-text-box {
    margin-top:20px;
  }

  .conA-ledboard-box2 {
    width: 90%;
    height: 40px;
    display: flex;
    align-items: center;
  }

  .ledboard {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
  }

  .ledboard-1 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 19px;
    color: #db4e4e;
    font-weight: 900;
    margin-left: 7%;
  }

  .ledboardcon {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
  }

  .conA-ledboard-op3 {
    width: 95%;
    height: 250px;
    display: flex;
    flex-direction: column;
    margin-top: 200px;
  }

  .conA-ledboard-op4 {
    width: 95%;
    height: 200px;
    display: flex;
    flex-direction: column;
    margin-top:150px;
  }

  .system_g {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 35px;
    color: black;
  }

  .systemimg {
    width: 55%;
    display: block;
    margin: 0 auto;
    margin-top: 20%;
  }
}

@media only screen and (max-width:450px) {

  #billboardmain {
    height: 2550px;
  }

  .conA-led-box4 {
    width: 77%;
  }

  .conA-led-box {
    height: 170px;
  }

  .ledintro {
    font-size: 25px;
    margin-left: 25px;
  }

  .hr-led-intro {
    margin-top:0px;
  }

  .ledline {
    height: 77%;
    width: 25px;
    margin-left: 5.5%;
    margin-top: 0%;
  }

  .ledintro-2 {
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.5em;
    color: black;
    font-weight: 900;
    margin-left: 0.2%;
    margin-top: 0px;
    width: 51%;
}

  .ledintro-1 {
    font-size: 14px;
  }

  .conA-led-box2 {
    width: 95%;
    height: 30px;
  }

  .ledboard {
    font-size: 25px;
    margin-left: 25px;
  }

  .conA-ledboard-box {
    width: 90%;
    height: 160px;
  }

  .ledboard-1 {
    font-size: 14px;
  }

  .conA-ledboard-box2 {
    width: 90%;
    height: 30px;
  }

  .ledboard-2 {
    font-size: 14px;
  }

  .conA-ledboard-box3 {
    width: 100%;
    height: 170px;
  }

  .ledboardcon {
    font-size: 25px;
    margin-left: 25px;
  }

  .led3 {
    margin-top: 100px;
  }

  .hr-ledboard-op {
    margin-top: 5px;
  }

  .pixel {
    font-size: 20px;
  }

  .pixel-1 {
    padding-top: 10px;
    font-size: 14px;
  }

  .conA-ledboard-op2 {
    margin-top: 60px;
  }

  .conA-ledboard-op3 {
    margin-top: 45px;
  }

  .module {
    font-size: 20px;
  }

  .module-1 {
    font-size: 14px;
  }

  .conA-ledboard-op4 {
    margin-top: -25px;
    width: 95%;
    height: 110px;
  }

  .cabinet {
    font-size: 20px;
  }

  .cabinet-1 {
    font-size: 14px;
  }

  .conA-ledsystem-box {
    width: 95%;
    height: 155px;
  }

  .system_g {
    font-size: 25px;
    margin-left: 25px;
  }
}

/* LED 전광판 페이지 내용 */
/* LED 전광판 페이지 */











/* DID 페이지 */
#didmain{
  height: 7400px;
}

.did{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
  margin-bottom: -24px;
}

@media only screen and (max-width:450px) {

  .did {
    font-size: 40px;
    margin-bottom: -25px;
  }
}

/* 사업분야 현재 메뉴 */

#card3_2{
  height: 100%;
  width: 100%; 
  background-color: #232942;

}
/* 사업분야 현재 메뉴 */


/* DID 페이지 내용 */

.did1{

}

.conA-did-box {
  width: 95%;
  height: 80px;
  display: flex;
  align-items: center;
  margin-top: 165px;
}

.conA-did-box2 {
  width: 95%;
  height: 40px;
  display: flex;
  align-items: center;
}

.conA-did-box3 {
  width: 2%;
  height: 100px;
  display: flex;
  align-items: center;
  margin-top: 80px;
}

.conA-did-box4 {
  width: 95%;
  height: 100px;
  display: flex;
  align-items: center;
  margin-top: 80px;
}

.hr-did-box {
  display: block;
  margin: 0 auto;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.did-intro-box {
  display: flex;
  margin-left: 7%;
  max-width: 90%;
}

.did-box-sss {
  display: flex;
  margin-left: 7%;
  max-width: 40%;
  margin-top: 100px;
}

.didintro {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 15px;
}

.didintro-1 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 19px;
  color: #db4e4e;
  font-weight: 900;
  margin-left: 120px;
}

.didleftline {
  height: 100%;
  width: 25px;
}

.didintro-2 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 500;
  width: 60%;
}

.didleftline2 {
  height: 70%;
  width: 25px;
}

.didintro-3 {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 24px;
  font-weight: 500;
  width: 27.5%;
}

.didintro-33{
  font-weight: 600;
}

.didimgdiv1 {
  height: 240px;
}

.didimg1 {
  width: 30%;
  transform: translate(185%, -70%);
}

.conA-didtype-box {
  width: 95%;
  height: 85px;
  display: flex;
  align-items: center;
}

.didtype {
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 10px;
}

.didtypeimg1 {
  width: 100%;
}

.didtypeimg2 {
  width: 100%;
}

.didtypeimg3 {
  width: 100%;
}

.didtypeimg4 {
  width: 100%;
}

.hr-didtype-box {
  display: block;
  margin: 0 auto;
  width: 87.5%;
  height: 2px;
  background: #232942;
}

.didtypeimgline1 {
  display: block;
  margin: 0 auto;
  width: 100%;
  margin-top: 150px;
  max-width: 45%;
}

.didtypeimgline2 {
  display: block;
  margin: 0 auto;
  width: 100%;
  margin-top: 150px;
  max-width: 45%;
}

.did3{
  margin-top: 100px;
}

.didchar{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 110px;
}

.hr_did{
  display: block;
    margin: 0 auto;
    margin-top: 0px;
    width: 87.5%;
    height: 2px;
    background: #232942;
}

.didimg2{
  display: block;
  margin: 0 auto;
  margin-top: 100px;
}

.did4{
  margin-top: 100px;
}

.didex{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 2.5em;
  color: black;
  font-weight: 900;
  margin-left: 120px;
  margin-top: 110px;
}

.dideximg1{
  width: 50%;
  display: block;
  margin: 0 auto;
  margin-top: 130px;
}

.didextxt1{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  font-weight: 600;
  text-align: center;
  margin-top: 10px;
}

.dideximg2{
  width: 50%;
  display: block;
  margin: 0 auto;
  margin-top: 130px;
}

.didextxt2{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  font-weight: 600;
  text-align: center;
  margin-top: 10px;
}

.dideximg3{
  width: 50%;
  height: 450px;
  display: block;
  margin: 0 auto;
  margin-top: 130px;
}

.didextxt3{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.3em;
  font-weight: 600;
  text-align: center;
  margin-top: 10px;
}

@media only screen and (max-width:450px) {

  #didmain {
    height: 3300px;
  }

  .didintro {
    font-size: 25px;
    margin-left: 25px;
  }

  .conA-did-box {
    height: 45px;
  }

  .didintro-1 {
    font-size: 14px;
    margin-left: 25px;
  }

  .conA-did-box2 {
    width: 95%;
    height: 30px;
    margin-left:1%;
  }

  .didintro-2 {
    font-size: 14px;
    width: 90%;
  }

  .conA-did-box3 {
    margin-top: 40px;
    width: 3%;
    height: 110px;
  }

  .conA-did-box4 {
    margin-top: 45px;
    margin-left:2%;
  }

  .didintro-3 {
    font-size: 14px;
  }

  .didimg1 {
    width: 62%;
    transform: translate(30%, -245%);
  }

  .did-box-sss {
    margin-top: 280px;
    max-width: 71%;
  }

  .didleftline2 {
    height: 65%;
  }

  .didimgdiv1 {
    height: 50px;
  }

  .didtype {
    font-size: 25px;
    margin-left: 25px;
  }

  .conA-didtype-box {
    height: 50px;
  }

  .didtypeimgline1 {
    margin-top: 85px;
  }

  .didtypeimg2 {
    padding-top: 30px;
  }

  .didtypeimgline2 {
    margin-top: 30px;
  }

  .didtypeimg4 {
    width: 100%;
    padding-top: 30px;
  }

  .did3 {
    margin-top: 100px;
  }

  .conA-didchar-box3 {
    height: 95px;
  }

  .didchar {
    font-size: 25px;
    margin-left: 25px;
  }

  .hr_did{
    margin-top: -50px;
  }

  .didimg2 {
    width: 90%;
    margin-top: 60px;
  }

  .conA-didchar-box4 {
    height: 95px;
  }

  .did4 {
    margin-top: 80px;
  }

  .didex {
    font-size: 25px;
    margin-left: 25px;
  }

  .dideximg1 {
    margin-top: 100px;
    width: 60%;
  }

  .didextxt1 {
    font-size: 16px;
  }

  .dideximg2 {
    width: 60%;
    margin-top: 85px;
  }

  .didextxt2 {
    font-size: 16px;
  }

  .dideximg3 {
    width: 60%;
    height: 140px;
    margin-top: 85px;
  }

  .didextxt3 {
    font-size: 15px;
  }




}

/* DID 페이지 내용 */
/* DID 페이지 */



/* CCTV(제품소개) 페이지 */

#product_cctvmain{
  height: 4400px;
}

.productinfo{
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

#cctv_line_p{
  margin-bottom: 0px;
}

@media only screen and (max-width:450px) {
  
  .productinfo {
    font-size: 32px !important;
    font-weight: 900;
    text-align: center;
    margin-top: 240px;
  }
}

/* 제품소개 현재 메뉴 */

#card1_1{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

@media only screen and (max-width:768px) {

  .row-center-div-class{
    display: flex;
    flex-direction: column;
    width:100%;
    margin-left:20px;
    align-content: center;
  }

  #row {
    display: flex;
    flex-direction: column;
    margin:0 auto;
  }

  #card1_1{
    height: 50px; 
    width: 300px; 
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }

  #cardA {
    height: 50px; 
    width: 300px; 
    display: block;
    margin: 0 auto;
  }

  #menubar3 {
    display: block;
    margin:0 auto;
  }

  #menutexts {
    margin-top:-5px;
  }
}

@media only screen and (max-width:450px) {

  #menubar1_1 {
    margin: 0 auto;
    max-width: 90%;
    margin-bottom: 10px;
  }

  #menubarA {
    margin: 0 auto;
    max-width: 90%;
    margin-bottom: 10px;
  }

  #card1_1 {
    height: 50px;
    width: 250px;
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }

  #cardA {
    height: 50px;
    width: 250px;
    display: block;
    margin: 0 auto;
  }

  #cardbodyA {
    width: 250px;
    height: 50px;
  }
}

/* 제품소개 현재 메뉴 */


/* CCTV(제품소개) 페이지 내용 */

.conn{
  background-image: url(../images/product_cctv4.png);
  width: 100%;
  height: 300px;
  display: block;
  margin: 0 auto;
  margin-top: 30px;
  max-width: 86.4%;
}

.cctv-pro-div {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  box-sizing: border-box;
}

.maintextdiv  {
  text-align: center;
}

.text2{
  font-size: 4em;
  font-family: 'Noto Sans KR', sans-serif;
  color: white;
  font-weight: 900;
  text-align: center;
  padding-top: 65px;
}

.text11{
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600; 
  text-align: center;
  color: white;
  padding-top: 15px;
}

.card{
  height: 650px;
}

#cardDiv{
  padding-top: 20px;
}

.maintextdiv2 {
  text-align: center;
}

.maintextdiv3 {
  width: 108%;
  text-align: center;
}

.maintextdiv4 {
  text-align: center;
}
       
.maintextdiv5 {
  text-align: center;
}

.maintext1{
  font-size: 3.5em;
  font-weight: 900;
  font-style: italic;
  color: #232942;
  font-family: 'Noto Sans KR', sans-serif;
}

.subtextdiv{
  margin-top: 30px;
  margin-bottom: 50px;
  text-align: center;
}

.subtext1{
  font-size: 23px; 
  font-weight: 600;
  color:#8AA4E0;
  font-family: 'Noto Sans KR', sans-serif;
}

#na12 {
  background: #E4EDF9;
}

#na12:hover{
  background-color:#232942;
}

#ds15-box {
  width: 90%;
  margin: 0 auto;
}

#ds1-box {
  width: 90%;
  margin: 0 auto;
}

#ds1-box-2355 {
  width: 90%;
  margin: 0 auto;
}

#tc-c-box {
  width: 90%;
  margin: 0 auto;
}

#tc-nc-box {
  width: 90%;
  margin: 0 auto;
}

.nav-link{
  color: #232942;
}

.nav-link:hover{
  color: white;
}

.tab-content {
  margin: 0 auto;
  width: 90%;
  text-align: center;
}

.tab-pane{
  width:100%;
  font-family: 'Noto Sans KR', sans-serif; 
  font-weight: 600;
}

.fas{
  margin-top: 30px;
}

.texta{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.2em;
  font-weight: 600;
}

.textb{
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 1.05em;
  font-weight: 600;
}

#cctv-img-div {
  max-width: 32.333333%;
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  font-family: 'Noto Sans KR', sans-serif;
  font-size: 0.95em;
  font-weight: 300;
  margin-top: 10px;
}

.cctvimg1 {
  width: auto;
  height: 260px;
  margin-top: 138px;
  margin-left: -5px;
}

.cctvimg2 {
  width: auto;
  height: 228px;
  margin-top: 142px;
  margin-left: 10px;
}

.cctvimg3 {
  width: auto;
  height: 300px;
  margin-top: 160px;
  margin-left: 60px;
}

.cctvimg4 {
  width: auto;
  height: 200px;
  margin-top: 160px;
  margin-left: 25px;
}

.cctvimg5 {
  width: auto;
  margin-left: 50px;
  margin-top: 125px;
  height: 350px;
}

.cctv-con-box {
  margin:0 auto;
  width: 45%;
}

#row-cctv-text-div1 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#row-cctv-text-div2 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#row-cctv-text-div3 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#row-cctv-text-div4 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#row-cctv-text-div5 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#cctv-con-box-id-b {
  margin: 0 auto;
  width: 45%;
}

@media only screen and (max-width:1024px){

  #product_cctvmain{
    height: 5500px;
  }

  .cctv-con-box {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 30px;
  }

  #cctv-con-box-id-b {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 30px;
  }

  #cctv-img-div {
    max-width: 50.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }

  #cctv-img-div2 {
    max-width: 50.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }

  #cctv-img-div3 {
    max-width: 28.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }

  #cctv-img-div3 {
    max-width: 38.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }
  
  #cctv-img-div5 {
    max-width: 43.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }

  #row-cctv-text-div1 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    align-items: center;
  }

  #row-cctv-text-div2 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    align-items: center;
  }

  #row-cctv-text-div3 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    align-items: center;
  }

  #row-cctv-text-div4 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    align-items: center;
  }

  #row-cctv-text-div5 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    align-items: center;
  }

  #cardDiv {
    height:850px;
  }

  .cctvimg1 {
    width: auto !important;
    height: 220px !important;
    margin-top: 0px !important;
    margin-left: 0px !important;
  }

  .cctvimg2 {
    width: auto;
    height: 210px;
    margin: 0 auto;
    margin-top: -10px;
  }

  .cctvimg3 {
    width: auto;
    height: 240px;
    margin-left: 0px;
    margin-top: 5px;
  }

  .cctvimg4 {
    width: auto;
    height: 200px;
    margin-top: 0px;
    margin-left: 0px;
  }

  .cctvimg5 {
    width: auto;
    height: 280px;
    margin-top:0px;
    margin-left: 0px;
  }

  .maintext1 {
    font-size: 45px;
    font-weight: 900;
    font-style: italic;
    color: #232942;
    font-family: 'Noto Sans KR', sans-serif;
  }

  .subtextdiv {
    margin-top: 10px;
    margin-bottom: 50px;
    text-align: center; 
  }

  .c-box-5 {
    height: 970px !important;
  }
}


@media only screen and (max-width:768px){

  #product_cctvmain{
    height: 5600px;
  }

  #con-width {
    width: 100%;
  }

  .cctv-con-box {
    flex: 0 0 66.666667%;
    max-width: 97.666667%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 60px;
  }

  #cctv-img-div1 {
    max-width: 57.333333%;
  }

  #cctv-img-div2 {
    max-width: 35.333333%;
  }

  #cctv-img-div3 {
    max-width: 46.333333%;
  }

  #cctv-img-div4 {
    max-width: 65.333333%;
  }

  #cctv-img-div5 {
    max-width: 53.333333%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    font-family: 'Noto Sans KR', sans-serif;
    font-size: 0.95em;
    font-weight: 300;
    margin-top: 10px;
  }

  #cctv-con-box-id-b {
    flex: 0 0 66.666667%;
    max-width: 97.666667%;
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: 30px;
  }
  
  .cctvimg1 {
    width: auto !important;
    height: 180px !important;
    margin: 0 auto;
  }

  .cctvimg2 {
    width: auto;
    height: 190px;
    margin: 0 auto;
    margin-top: 10px;
    margin-left: -80px;
  }

  .cctvimg3 {
    width: auto;
    height: 220px;
    margin-left: 0px;
  }

  .cctvimg4 {
    width: auto;
    height: 165px;
    margin-top: 15px;
  }

  .cctvimg5 {
    width: auto;
    height: 255px;
    margin-top: -5px;
    margin-left: 0px;
  }

  .c-box-5 {
    height: 910px !important;
  }

  .maintext1 {
    font-size: 40px;
    font-weight: 900;
    font-style: italic;
    color: #232942;
    font-family: 'Noto Sans KR', sans-serif;
  }

  .subtextdiv {
    margin-top: 3px;
  }

  .subtext1 {
    font-size: 19px;
  } 
}

@media only screen and (max-width:450px){

  #product_cctvmain {
    height: 4900px;
  }
  
  .conn {
    background-image: url(../images/product_cctv_mobile.png);
    width: 100%;
    height: 100px;
    display: block;
    margin: 0 auto;
    margin-top: 30px;
    max-width: 89%;
  }

  .text2{
    font-size: 25px;
    font-family: 'Noto Sans KR', sans-serif;
    color: white;
    font-weight: 900;
    text-align: center;
    padding-top: 16px;
  }

  .text1 {
    font-size: 45px;
  }

  .text11 {
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    text-align: center;
    color: white;
    padding-top: 0px;
    font-size: 10px;
    margin-top: -10px;
  }

  #cctvimg1-1 {
    width: auto;
    height: 150px !important;
    margin: 0 auto;
  }

  .maintext1 {
    font-size: 30px;
    font-weight: 900;
    font-style: italic;
    color: #232942;
    font-family: 'Noto Sans KR', sans-serif;
  }

  .subtext1 {
    font-size: 17px;
  }

  .exx {
    font-size: 13px;
  }

  .tab-content {
    margin-top: -10px;
  }

  #cardDiv {
    height: 740px;
  }

  #cctv-img-div2 {
    max-width: 67.333333%;
  }

  .cctvimg2 {
    width: auto;
    height: 140px;
    margin-left:0px;
  }

  .cctv-con-box {
    margin-top: 40px;
  }

  #cctv-img-div3 {
    max-width: 53.333333%;
  }

  .cctvimg3 {
    width: auto;
    height: 170px;
  }

  #row-cctv-text-div3 {
    margin-top: 20px;
  }

  .cctvimg4 {
    width: auto;
    height: 125px;
    margin-top: 10px;
  }

  #cctv-img-div5 {
    max-width: 59.333333%;
  }

  .cctvimg5 {
    width: auto;
    height: 190px;
  }

}




/* CCTV(제품소개) 페이지 내용 */
/* CCTV(제품소개) 페이지 */













/* 녹화기(제품소개) 페이지 */
#productnvrmain{
  height: 5750px;
}

.productinfo{
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

/* 제품소개 현재 메뉴 */

#card2_2{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#card3_2{
  height: 60px; 
  width: 548px; 
  background-color: #232942;
}

@media only screen and (max-width:450px){

  #card2_2 {
    height: 50px;
    width: 250px !important;
  }  
}


/* 제품소개 현재 메뉴 */

/* 녹화기(제품소개) 페이지 내용 */

.cond{
  background-image: url('../images/product_nvr.png');
  width: 100%;
  height: 300px;
  display: block;
  margin: 0 auto;
  margin-top: 30px;
  max-width: 86.4%;
}

#row-nvr-text-div1 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

.nvr-con-box {
  margin:0 auto;
  margin-top: 30px;
}

#nvr-con-box-tc3220 {
  width: 47%;
  margin: 0 auto;
  margin-top: 30px;
}

#ds7208-nvr-box {
  width: 90%;
  margin:0 auto;
}

#ds7604-nvr-box {
  width: 90%;
  margin:0 auto;
}

#ds7616-nvr-box {
  width: 90%;
  margin:0 auto;
}

#ds7716-nvr-box {
  width: 90%;
  margin:0 auto;
}

#ds7732-nvr-box {
  width: 90%;
  margin:0 auto;
}

#tc4004-nvr-box {
  width: 90%;
  margin:0 auto;
}

#tc3220-nvr-box {
  width: 90%;
  margin:0 auto;
}

.text3{
  font-size: 4em;
  font-family: 'Noto Sans KR', sans-serif;
  color: white;
  font-weight: 900;
  text-align: center;
  padding-top: 65px;
}

.text33{
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600; 
  text-align: center;
  padding-top: 15px;
  color: white;
}

.nvrimg1 {
  width: auto;
  height: 110px;
  margin-top: 190px;
  margin-left: 0px;
}                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           

#na11:hover{
  background-color: #232942;
}

.nvrimg2 {
  width: auto;
  height: 115px;
  margin-top: 215px;
  margin-left: 0px;
}

.nvrimg3 {
  width: auto;
  height: 110px;
  margin-top: 223px;
  margin-left: 45px;
}

.nvrimg4 {
  width: auto;
  height: 120px;
  margin-top: 250px;
  margin-left: 20px;
}

.nvrimg5 {
  width: auto;
  height: 125px;
  margin-top: 235px;
  margin-left: 50px;
}

.nvrimg6 {
  width: auto;
  margin-top: 245px;
  margin-left: 65px;
  height: 105px;
}

.nvrimg7 {
  width: auto;
  margin-top: 250px;
  margin-left: 70px;
  height: 120px;
}

#na11 {
  background: #E4EDF9;
}

@media only screen and (max-width:1024px) {

  #productnvrmain{
    height: 6600px;
  }
  

  #row-nvr-text-div1 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    margin-top: 30px;
    flex-direction: column;
  }

  .nvr-con-box {
    flex: 0 0 66.666667%;
    max-width: 79.666667%;
    position: relative;
    width: 100%;
    margin: 0 auto;
    margin-top: 10px;
  }

  #nvr-img-div {
    max-width: 68.666667%;
    margin: 0 auto;
  }

  .nvrimg1 {
    width: AUTO;
    height: 125px;
    margin: 0 auto;
    margin-top: 30px;
  }

  .nvrimg2 {
    width: auto;
    height: 125px;
    margin-top: 40px;
    margin-left: 0px;
  }

  .nvrimg3 {
    width: auto;
    height: 100px;
    margin-left:0px;
    margin-top: 60px;
  }

  .nvrimg4 {
    width: auto;
    height: 115px;
    margin-top: 60px;
  }

  .nvrimg5 {
    width: auto;
    height: 120px;
    margin: 0 auto;
    margin-top: 60px;
  }

  .nvrimg6 {
    width: auto;
    height: 100px;
    margin-top: 70px;
    margin: 0 auto;
    margin-top: 60px;
  }

  .nvrimg7{
    height: 110px;
    width: auto;
    margin:0 auto;
    margin-top: 60px;
  }

  #cardDiv-nvr {
    height: 750px;
  }

  .maintext-tc-r3 {
    margin-left: -50px;
  }

  .maintextdiv6 {
    text-align: center;
  }
}

@media only screen and (max-width:768px) {

  #nvr-img-div {
    max-width: 87.666667%;
    margin: 0 auto;
  }

  .nvrimg1 {
    width: AUTO;
    height: 119px;
    margin: 0 auto;
    margin-top: 30px;
  }
}

@media only screen and (max-width:450px) {
  #productnvrmain {
    height: 5700px;
  }

  #cctv_line_p{
    margin-bottom: 16px;
  }

  .cond{
    background-image: url('../images/product_nvr_mobile.png');
    width: 100%;
    height: 100px;
    display: block;
    margin: 0 auto;
    margin-top: 30px;
    max-width: 86.4%;
  }

  .text3{
    font-size: 25px;
    font-family: 'Noto Sans KR', sans-serif;
    color: white;
    font-weight: 900;
    text-align: center;
    padding-top: 16px;
  }

  .text33{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    text-align: center;
    color: white;
    padding-top: 0px;
    font-size: 10px;
    margin-top: -10px;
  }

  .nvrimg1 {
    width: auto;
    height: 85px;
    margin: 0 auto;
    margin-top: 30px;
  }

  #cardDiv-nvr {
    height: 650px;
  }

  #ds7208-nvr-box {
    width: 95%;
  }

  #ds7604-nvr-box {
    width: 95%;
  }

  #ds7604-nvr-box {
    width: 95%;
  }

  .nvrimg2 {
    width: auto;
    height: 85px;
  }

  .nvrimg3 {
    width: auto;
    height: 70px;
  }

  .nvrimg4 {
    width: auto;
    height: 83px;
    margin-left:0px;
  }

  .maintext-ds {
    font-size: 26px;
  }

  .maintext-ds2 {
    font-size: 26px;
  }

  .maintext-ds3 {
    font-size: 26px;
    margin-right: 20px;
  }

  .maintext-ds4 {
    font-size: 26px;
  }

  .nvrimg5 {
    width: auto;
    height: 85px;
  }

  .maintext-ds5 {
    font-size: 26px;
  }

  #nvr-con-box2 {
    flex: 0 0 81.666667%;
    max-width: 79.666667%;
  }

  #nvr-con-box3 {
    flex: 0 0 79.666667%;
    max-width: 79.666667%;
  }

  #ds7616-nvr-box {
    width: 95%;
  }

  #nvr-con-box4 {
    flex: 0 0 80.666667%;
  }

  #ds7716-nvr-box {
    width: 95%;
  }

  #nvr-con-box5 {
    flex: 0 0 79.666667%;
  }

  #ds7732-nvr-box {
    width: 95%;
  }

  .nvrimg6 {
    width: auto;
    height: 68px;
  }

  .maintext-tc-nr {
    font-size: 26px;
  }

  #nvr-con-box6 {
    flex: 0 0 79.666667%;
  }

  #tc4004-nvr-box {
    width: 95%;
  }

  .nvrimg7 {
    height: 80px;
    width: auto;
  }

  #nvr-con-box-tc3220 {
    flex: 0 0 79.666667%;
  }

  #tc3220-nvr-box {
    width: 95%;
  }


}

/* 녹화기(제품소개) 페이지 내용 */
/* 녹화기(제품소개) 페이지 */














/* 블렌디드(제품소개) 페이지 */
#productblendedmain{
  height: 3000px;
}

.productinfo{
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

/* 제품소개 현재 메뉴 */

#card3_3{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#card3_2{
  height: 60px; 
  width: 548px; 
  background-color: #232942;
}

@media only screen and (max-width:768px) {

  #card3_3 {
    height: 50px !important;
    width: 300px !important;
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }
}

@media only screen and (max-width:450px) {

  #card3_3 {
    height: 50px !important;
    width: 250px !important;
    background-color: #232942;
    display: block;
    margin: 0 auto;
  }
}

/* 제품소개 현재 메뉴 */

/* 블렌디드(제품소개) 페이지 내용 */

/*.conc {*/
/*  background-image: url(../images/product_blended.png);*/
/*  width: 100%;*/
/*  height: 300px;*/
/*  display: block;*/
/*  margin: 0 auto;*/
/*  margin-top: 30px;*/
/*  max-width: 86.4%;*/
/*}*/

.blen-con-box {
  margin:0 auto;
  width: 45%;
}

#row-blen-text-div1 {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  margin-top: 30px;
}

#blen-img-div {
  max-width: 68.666667%;
  margin: 0 auto;
}

.text4{
  font-size: 4em;
  font-family: 'Noto Sans KR', sans-serif;
  color: white;
  font-weight: 900;
  text-align: center;
  padding-top: 65px;
}

.text44{
  font-family: 'Noto Sans KR', sans-serif;
  font-weight: 600; 
  text-align: center;
  color: white;
  padding-top: 15px;
}

.blanimg1{
  width: 300px; 
  margin-top: 200px;
  margin-left: 20px;
}

.blanimg2{
  width: 350px;
  height: 260px;
  margin-top: 150px;
}

.blanimg3{
  width: 350px; 
  margin-top: 170px;
}

@media only screen and (max-width:1024px) {

  #productblendedmain{
    height: 3500px;
  }

  #row-blen-text-div1 {
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    flex-direction: column;
    margin: 0 auto;
  }

  #cardDiv-blen {
    height: 850px;
  }

  #cardDiv-blen2 {
    height: 950px;
  }

  #cardDiv-blen3 {
    height: 920px;
  }

  .blen-con-box {
    margin: 0 auto;
    width: 45%;
    margin-top: 10px;
  }

  #blen-img-div {
    max-width: 49.666667%;
    margin: 0 auto;
  }

  .blanimg1 {
    width: auto;
    margin-top: 60px;
    height: 200px;
  }

  .blanimg2 {
    width: auto;
    height: 250px;
    margin-top: 0px;
    margin:0 auto;
  }

  .blanimg3 {
    width: auto;
    height: 250px;
    margin: 0 auto;
  }
}

@media only screen and (max-width:768px) {

  #productblendedmain{
    height: 3900px;
  }

  #blen-img-div {
    max-width: 68.666667%;
    margin: 0 auto;
  }

  .blen-con-box {
    margin: 0 auto;
    width: 63%;
    margin-top: 10px;
  }

  #cardDiv-blen {
    height: 850px;
  }

  #cardDiv-blen2 {
    height: 950px;
  }

  #cardDiv-blen3 {
    height: 1000px;
  }

  .blanimg1 {
    width: auto;
    margin-top: 60px;
    height: 175px;
  }

  .blanimg2 {
    width: auto;
    height: 235px;
    margin-top: 0px;
    margin: 0 auto;
  }

  .blanimg3 {
    width: auto;
    height: 220px;
    margin: 0 auto;
    margin-top: 20px;
  } 
}

@media only screen and (max-width:450px) {

  #productblendedmain {
    height: 3270px;
  }

  .conc {
    background-image: url(../images/product_blended_mobile.png);
    width: 100%;
    height: 100px;
  }

  .text4{
    font-size: 25px;
    font-family: 'Noto Sans KR', sans-serif;
    color: white;
    font-weight: 900;
    text-align: center;
    padding-top: 16px;
  }

  .text44{
    font-family: 'Noto Sans KR', sans-serif;
    font-weight: 600;
    text-align: center;
    color: white;
    padding-top: 0px;
    font-size: 10px;
    margin-top: -10px;
  }
  
  .blanimg1 {
    width: auto;
    margin-top: 60px;
    height: 130px;
    margin-left: 0px;
  }

  #blen-con-box2 {
    width: 80%;
  }

  #cardDiv-blen {
    height: 745px;
  }

  #blen-img-div {
    max-width: 82.666667%;
  }

  .blanimg2 {
    width: auto;
    height: 180px;
    margin-top: 30px;
  }

  .vs18021-c-heigt-b {
    height: 780px !important;
  }
  
  #blen-con-box3 {
    width: 80%;
  }

  .blanimg3 {
    width: auto;
    height: 175px;
    margin-top: 40px;
  }

  .sys750-c-heigt-b {
    height: 800px !important;
  }

}



/* 블렌디드(제품소개) 페이지 내용 */
/* 블렌디드(제품소개) 페이지 */













/* CCTV 공사 페이지 */
.construction{
  font-size: 4em; 
  font-weight: 900;
  text-align: center;
  margin-top: 270px;
}

@media only screen and (max-width:450px) {

  .construction{
    font-size: 32px !important;
    font-weight: 900;
    text-align: center;
    margin-top: 270px;
  }
}


/* 시공사례 중간메뉴(공통) */
.my-59{
transform: translate(5.3%, 0);
}

#menubar1_9{
  -ms-flex : 0 0 28.4%; 
  max-width: 100%;
  width: 100%;
  margin-left: 0.5%;
  margin-right: 0.5%;
}

#menubarall_9{
  -ms-flex : 0 0 28.4%; 
  max-width: 100%;
  width: 100%; 
  margin-left: 0.5%;
  margin-right: 0.5%;
}

#card1_11{
  height: 100%; 
  width: 100%; 
  background-color: #232942;
}

#cardall_9{
  height: 60px; 
  width: 100%;
  margin-left: 0px;
}

#cardmenubody_9{
  font-family: 'Noto Sans KR', sans-serif; 
  font-size: 1em;
  font-weight: 600;
  margin-top: -2px;
}

#cardall_9:hover{
  background-color: #232942;
  color: white!important;
}

@media only screen and (max-width:450px) {
  #row-center-div-ccc {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    max-width: 89%;
    margin: 0 auto;
    margin-top: 0px;
  }

  .row-center-div-class {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-content: center;
    margin: 0 auto;
  }

  #row-center-div-c {
    margin: 0 auto;
  }

  #card1_11 {
    height: 50px;
    width: 250px;
    background-color: #232942;
    margin: 0 auto;
  }

  #cardall_9 {
    height: 50px;
    width: 250px;
    margin: 0 auto;
  }

  .construction {
    font-size: 32px;
  }
}

/* 시공사례 중간메뉴(공통) */

/* CCTV 공사 페이지 내용 */
.conK{
  background-image: url('../images/backcase.png');
  width: 100%;
  max-width: 89%;
  height: 300px;
  display: block;
  margin: 0 auto;
  margin-top: 30px;
}

.textK{
  font-size: 4em;
  font-family: 'Noto Sans KR', sans-serif;
  color: white;
  font-weight: 900;
  text-align: center;
  padding-top: 100px;
}

.co{
  width: 100%;
  max-width: 80%;
  height: 1300px;
  padding-top: 80px;
  display: block;
  margin: 0 auto;
}

#example_info{
  visibility: hidden;
}

.col-md-7{
  flex: 1 0 0!important;
  max-width: 100%!important;
  margin-top: 50px;
}
/* CCTV 공사 페이지 내용 */
/* CCTV 공사 페이지 */












/* 네트워크 공사 페이지 */
.construction{
  font-size: 4em; 
  font-weight: 900;
  color: black;
  text-align: center;
  margin-top: 270px;
}

/* 시공사례 현재 메뉴 */
#card1_11_1{
  height: 100%; 
  width: 100%; 
}

#card1_11_1:hover{
  background-color:#232942;
  color: white!important;
}

#card2_22{
  height: 100%; 
  width: 100%;
  margin-left: 0px; 
  background-color: #232942;
}

@media only screen and (max-width:450px) {
  #card1_11_1 {
    height: 50px;
    width: 250px;
    margin: 0 auto;
  }

  #card2_22 {
    height: 50px;
    width: 250px;
    background-color: #232942;
    margin: 0 auto;
  }

  .row-center-div-class {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-content: center;
    margin: 0 auto;
  }

  #row-center-div-c {
    margin: 0 auto;
  }

  #card1_11 {
    height: 50px;
    width: 250px;
    background-color: #232942;
    margin: 0 auto;
  }
}

/* 시공사례 현재 메뉴 */
/* 네트워크 공사 페이지 */

@media only screen and (max-width:450px) {

  .conK {
    background-image: url(../images/construction_mobile.png);
    width: 100%;
    height: 260px;
  }
}






/* 블렌디드 공사 페이지 */
.construction{
  font-size: 4em; 
  font-weight: 900;
  color: black;
  text-align: center;
  margin-top: 270px;
}


@media only screen and (max-width:450px) {

  .conK {
    background-image: url(../images/construction_mobile.png);
    width: 100%;
    height: 260px;
  }
}


/* 시공사례 현재 메뉴 */
#card2_22_2{
  width: 100%;
  height: 100%;
}

#card2_22_2:hover{
  background-color:#232942;
  color: white!important;
}

#card3_33{
  height: 100%; 
  width: 100%;
  background-color: #232942;
}

@media only screen and (max-width:450px) {
  #card2_22_2 {
    height: 50px;
    width: 250px;
    margin: 0 auto;
  }

  #card3_33{
    height: 50px; 
    width: 250px;
    background-color: #232942;
    margin:0 auto;
  } 
}
/* 시공사례 현재 메뉴 */
/* 블렌디드 공사 페이지 */












/* LED 전광판 공사 페이지 */

.construction{
  font-size: 4em; 
  font-weight: 900;
  color: black;
  text-align: center;
  margin-top: 270px;
}

@media only screen and (max-width:450px) {

  #example_length {
    text-align: left;
  }

  #example_filter {
    text-align: left;
  }
}

/* 시공사례 현재 메뉴 */
#card3_33_3{
  width: 100%;
  height: 100%;
}

#card3_33_3:hover{
  background-color:#232942;
  color: white!important;
}

#card4_44{
  height: 60px; 
  width: 100%;
  background-color: #232942;
}

@media only screen and (max-width:450px) {
  #cardmenubody_9 {
    margin-top: 0px;
  }

  #card3_33_3 {
    height: 50px;
    width: 250px;
    margin: 0 auto;
  }

  #card4_44{
    height: 50px; 
    width: 250px; 
    background-color: #232942;
    margin:0 auto;
  }

  #card1_11{
    height: 50px; 
    width: 250px; 
    background-color: #232942;
  }
  
  #cardall_9{
    height: 50px; 
    width: 250px;
  }

  #menubar1_9 {
    max-width: 85%;
    width: 100%;
  }

  #menubarall_9 {
    max-width: 85%;
    width: 100%;
    margin-left: 0px;
  }
}
/* 시공사례 현재 메뉴 */
/* LED 전광판 공사 페이지 */




/* 시공사례 글 쓰기 페이지 */

#writemain{
  height: 1000px;
}

.notice-write-main-div{
  width: 80%;
  margin-top: 150px;
  display: block;
  margin: 0 auto;
}

.selectDiv{
  margin-left: -50px;
  margin-top: 170px;
  margin-bottom: -60px;
  display: flex;
}

#selectFrm{
  border: 3px skyblue solid;
  font-weight: 500;
  margin-top: -5px;
  margin-left: 20px;
  width: 10%;
}

.titleLabel {
  font-size: 20.5px;
  font-weight: 550;
  margin-left: 50px;
}

#c_title{
  width: 60%;
  border: 3px skyblue solid;
  margin-left: 20px;
  margin-top: -5px;
}

#writeBtn{
  margin-top: -5px;
  width: 135px;
  height: 38px;
}

.contentLabel {
  font-size: 20.5px;
  font-weight: 550;
  margin-top:100px;
  border-bottom: 3px solid #97ACDB;
  padding-bottom: 10px;
  margin-bottom: 40px;
}

#c_content{
  margin-top: 30px;
}

/* 시공사례 글 쓰기 페이지 */













/* 시공사례 글 상세 페이지 */
#detailmain{
  height: auto;
}

.construction-detail-main-div{
  display: flex;
  flex-direction: column;
  padding-left: 130px;
  padding-right: 130px;
  margin-top: 200px;
}

.detail-title-div{
  display: flex;
  flex-direction: row;
}

.title-div {
  border-radius:1em;
  margin-top:5px;
  height:40px;
  width: 7%;

}

.title-label {
  color:black;
  font-size: 21px;
  font-weight: 700;
  padding-top: 4px;
}

.title-data {
  background: #EBF3FF;
  height:35px;
  font-size: 18px;
  font-weight: 700;
  width: 100%;
  margin-top: 7px;
  padding-top: 5px;
}

.subTitle-div {
  display: flex;
  margin-top:35px;
  border-bottom:1px solid #D3DCE5;
  margin-bottom: 5px;
}

.subTitle-1 {
  font-weight: 600;
  font-size:18px;
  margin-left:0px;
  margin-bottom:10px;
}

.subTitle-2 {
  font-weight: 600;
  font-size:18px;
  margin-left: 25%;
}

.subTitle-3 {
  font-weight: 600;
  font-size:18px;
  margin-left:5%;
}

.content-div{
  padding-top:50px;
  border-bottom: 1px solid #D3DCE5;
  padding-bottom: 100px;
  border-top: 3px solid #97ACDB;
}

@media only screen and (max-width:1024px) {

  .subTitle-div {
    display: flex;
    flex-direction: column;
    margin-top:35px;
    border-bottom:1px solid #D3DCE5;
    margin-bottom: 5px;
  }

  .subTitle-1 {
    font-weight: 600;
    font-size:18px;
    margin-left:0px;
    margin-bottom:0px;
  }
  
  .subTitle-2 {
    font-weight: 600;
    font-size:18px;
    margin-left:0px;
  }
  
  .subTitle-3 {
    font-weight: 600;
    font-size:18px;
    margin-left:0px;
  }
}


@media only screen and (max-width:450px) {
  
  .conK {
    background-image: url(../images/construction_mobile.png);
    width: 100%;
    height: 100px;
    margin-top: 50px;
  }

  .textK {
    font-size: 30px;
    padding-top: 25px;
  }

  .co {
    height: 1000px;
  }

  .construction-detail-main-div {
    display: flex;
    flex-direction: column;
    padding-left: 0px;
    padding-right: 0px;
    max-width: 85%;
    margin: 0 auto;
    margin-top: 200px;
  }
}

/*시공사례 글 상세 페이지 버튼*/
.detail-btn-div{
  display: flex;
  flex-direction: row-reverse;
  margin-right: 6.5%;
  margin-top: 35px;
}

.detail-modify-btn{
  width:100px;
  height:40px;
  background-color:#9CB1FF;
  border:1px #9CB1FF;
}

.detail-delete-btn{
  width:100px;
  height:40px;
  background-color:red;
  border:1px red;
}
/*시공사례 글 상세 페이지 버튼*/
/* 시공사례 글 상세 페이지 */













/* footer(공통) */
.ft-4{
  background-color: #181B23;
  width: 100%;
  height:220px;
}

.fotlogo {
  margin-top: 65px;
  margin-left: -56%;
  height: auto;
  width: 20%;
}

.fottxt{
  margin-top: -105px;
  margin-left: 45%;
  width: 50%;
}

.txt22{
  font-size: 1.02em;
  font-weight: 300;
  margin-left: -2px;
}

.txt33{
  font-size: 1.02em;
  font-weight: 300;
}

.txt33div{
  margin-top: 10px;
  margin-left:-30px;
}

.txt44{
  font-size: 1.02em;
  font-weight: 300;
}

.txt44div{
  margin-top: 10px;
  margin-left:-75px;
}

.fotcopy{
  text-align: center;
  width: 50%;
  margin-top: -60px;
  margin-left: 42.1%;
}

.copy-text{
  text-align: center;
  width: 100%;
  margin-top: -3%;
  margin-left: 4.1%;
}

footer.page-footer a {
  color:darkgray;
}

@media only screen and (max-width:1024px) {
  .fotlogo-2 {
    float: left;
    height: auto;
    width: 25%;
    margin-top: 20px;
    margin-left: 100px;
  }

  .fotlogo {
    float: left;
    height: auto;
    width: 27%;
    margin-top: 85px;
    margin-left: 80px;
  }

  .fottxt {
    margin-left: 47%;
    padding-top: 60px;
    text-align: center;
    width: 52%;
    font-size: 15px;
  }

  .fotcopy {
    font-size: 15px;
    width: 100%;
    font-size: 15px;
    width: 100%;
    margin-top: -80px;
    margin-left: 16%;
  }

  .ft-4 {
    width: 100%;
    height:250px;
    background: none;
  }

  footer.page-footer {
    background: #181B23;
    width: 100%;
    height:230px;
    margin-top:20px !important;
  }
}

@media only screen and (max-width:768px){ 
  footer.page-footer {
    width: 100%;
    background: #181B23;
    height: 340px;
    margin-top:20px !important;
  }

  .ft-4 {
    display: flex;
    flex-direction: column;
    width: 100%;
    height:50px;
    background: none;
  }
    
  .fotlogo {  
    margin: auto;
    margin-top:55px;
    height: auto;
    width: 320px;
  }

  .fottxt {
    padding-top:40px;
    margin:auto;
    text-align: center;
    width: 80%;
    height: 120px;
    font-size: 16px;
  }

  .fotcopy {
    margin: 0 auto;
    margin-top: 230px;
  }

  .txt33 {
    margin-left:30px;
  }

  .txt44 {
    margin-left:75px;
  }

  .copy-text {
    margin-left: 0px;
  }
}

@media only screen and (max-width:450px){ 
 
  .fotlogo {
    margin: auto;
    margin-top: 55px;
    height: auto;
    width: 225px;
  }

  .mt-4 {
    padding-left: 0px;
  }

  .txt22 {
    font-size: 13px;
  }

  .fottxt {
    width: 53%;
  }

  .txt33 {
    font-size: 13px;
    margin-left: -27px;
  }

  .txt44 {
    font-size: 13px;
    margin-left: -52px;
  }

  .txt33div {
    width: 297px;
    margin-top: 3px;
  }

  .txt44div {
    margin-top: 3px;
    width: 260px;
    margin-left: 0px;
  }

  .fotcopy {
    font-size: 12px;
    margin-top: 230px;
  }

}
/* footer(공통) */