@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

.subConWrap {
   width: 100%;
   margin-top: 160px;
}

.zoomSection {
   height: auto;
}
/*
처음 시작시 직사각형에서 시작
.zoomWrap {
   position: sticky;
   top: 0px;
   width: 100%;
   height: 50vh;
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: hidden;
   position: relative;
}
.zoomImg {
   width: calc(100% - 30px);
   height: calc(100% - 30px);
   object-fit: cover;
   clip-path: inset(25% 25% 25% 25%);
   border-radius: 0px;
   filter: brightness(1);
   transition: clip-path 0.5s ease, border-radius 0.5s ease, filter 0.5s ease;
   z-index: 1;
}
*/
.zoomWrap {
   position: sticky;
   top: 0;
   width: 100%;
   height: 50vh;
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: hidden;
   border-radius: 30px; /* 둥근 모서리 */
   padding: 0 15px;
}
.zoomImg {
   width: 100%;
   height: 100%;
   object-fit: cover;

   /* clip-path inset에 round를 넣어 둥근 모서리 처리 */
   clip-path: inset(25% round 30px);
   filter: brightness(1);
   transition: filter 0.5s ease;
}
.textBox {
   position: absolute;
   top: 30%;
   left: 30%;
   transform: translate(-30%, -30%);
   color: white;
   z-index: 2;
   opacity: 0;
   pointer-events: none; /* 클릭 방지 */
}
.subTit {
   font-size: 56px;
}
@media (max-width: 1400px) {
   .textBox {
      top: 30%;
      left: 50%;
      transform: translate(-50%, -30%);
   }
   .subTit {
      font-size: 24px;
   }
}
@media (max-width: 576px) {
   .textBox {
      left: 50%;
      width: 80%;
      transform: translate(-50%, -30%);
   }
   .subTit {
      font-size: 24px;
   }
}
/* 스크롤 모션 E */

/* 서브페이지 서브 메뉴 S */
.subMenuWrap {
   position: relative;
   height: 74px;
   left: 0;
   top: 0;
   width: 100%;
   border-bottom: 1px solid #dee2e6;
   transition: top 0.3s ease;
}
.subMenuWrap.fixed {
   position: fixed;
   height: 74px;
   left: 0;
   top: 0;
   width: 100%;
   background-color: #fff;
   border-bottom: 1px solid #dee2e6;
   z-index: 1000;
}
.smWrapPc {
   height: 100%;
}
.smWrap {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100%;
}
.smWrap a {
   display: block;
   margin: 0 25px;
   color: #6c757d;
   font-size: 18px;
   font-weight: 700;
}
.smWrap a.on {
   display: block;
   margin: 0 25px;
   color: #68ae28;
   font-size: 18px;
   font-weight: 800;
   position: relative;
}
.smWrap a.on:after {
   position: absolute;
   content: '';
   display: block;
   top: 47px;
   left: 50%;
   width: 8px;
   height: 8px;
   border-radius: 50%;
   background-color: #68ae28;
}

@media (max-width: 1010px) {
   .subMenuWrap {
      height: 74px;
      left: 0;
      top: 0;
      width: 100%;
      border-bottom: 0px;
   }
   .subMenuWrap.fixed {
      position: fixed;
      height: 74px;
      left: 0;
      top: 0;
      width: 100%;
      background-color: #fff;
      border-bottom: 0px;
      z-index: 1000;
   }
   .smWrapPc {
      display: none;
   }
   #productSelect option {
      width: 100%;
   }
}
@media (min-width: 1011px) {
   .smWrapMobile {
      display: none;
   }
}
/* 서브페이지 서브 메뉴 E */





/* #subPage 공통 S */
#subPage >.inner,
.post_list, .post_view, .post_write {
   margin-top: 4rem;
   margin-bottom: 8rem;
}
#subPage >.inner section {
   margin-bottom: 4rem !important;
}

#subPage strong.underline {
   white-space : nowrap;
   word-break: keep-all;
   border-bottom: 1px solid #68ae284d;
   box-shadow: inset 0 -13px 0 #68ae284d;
   color: inherit;
}
@media (min-width: 992px) {
   [class*="box_bg"].rounded {
      border-radius: var(--bs-border-radius-xl) !important;
   }
}
@media (min-width: 1200px) {
   #subPage >.inner,
   .post_list, .post_view, .post_write {
      margin-top: 10rem;
      margin-bottom: 12.5rem;
   }
   #subPage >.inner section {
      margin-bottom: 8rem !important;
   }
}
@media (max-width: 576px) {
   #subPage >.inner section {
      margin-bottom: 3rem;
   }
}
/* #subPage 공통 E */


/* 인사말 S */
#greeting .display-6 {
   font-weight: 900;
}
#greeting .top_text p {
   margin-bottom: 1rem;
}
#greeting .top_text strong {
   font-size: 1.5rem;
   font-weight: 900;
}
#greeting section:has(.top_bg) {
   position: relative;
}
#greeting .top_bg {
   z-index: -100;
   position: absolute;
   bottom: 0;
   right: 0;
   width: 100%;
   height: 100%;
   min-height: 360px;
   background: #fff url(../html/images/bg_greeting_01.jpg) no-repeat bottom right;
   background-size: contain;
}
#greeting [class*="box_bg"] {
   min-height: 25rem;
   background-size: cover !important;
}
#greeting [class*="box_bg"] h6 {
   font-weight: 800;
}
#greeting [class*="box_bg"] h6 + p {
   font-weight: 700;
}
#greeting .box_bg_01 {
   background: #f8f9fa url(../html/images/bg_greeting_02.jpg) no-repeat center;
}
#greeting .box_bg_02 {
   background: #f8f9fa url(../html/images/bg_greeting_03.jpg) no-repeat center;
}
@media (min-width: 1200px) {
   #greeting .top_text p {
      margin-bottom: 1.5rem;
      font-size: 1.25rem;
   }
}
@media (max-width: 768px) {
   #greeting [class^="display-"] >br,
   #greeting p >br {
      display: none !important;
   }
   #greeting section:has(.top_bg) {
      padding-bottom: 200px;
   }
   #greeting .top_bg {
      filter: opacity(50%);
   }
   #greeting .top_text {
      backdrop-filter: blur(3px);
   }
   #greeting [class*="box_bg"] {
      min-height: 20rem;
   }
}
/* 인사말 E */


/* 비전 S */
#subPage > #vision.inner > section {
    margin-bottom: 8rem;
}
#vision section:nth-child(1) {
   padding-bottom: 6rem;
   margin-bottom: 2rem !important;
   background: #fff url(../html/images/bg_vision_01.jpg) no-repeat center;
   background-size: contain;
}
#vision section:has(h5.rounded-pill) *,
#vision .box_text * {
   word-break: keep-all !important;
}
#vision section {
   text-align: center;
}
#vision section > h5 {
   margin-bottom: 1rem;
   display: inline-block;
   padding: .75rem 1.5rem;
   min-width: 8rem;
   font-size: 1.25rem;
   font-weight: 900;
   text-align: center;
}
#vision h5.rounded-pill {
   text-transform: uppercase;
   background: #fff;
}
#vision section:has(.box_group) > h5 {
   background: var(--bs-gray-200);
   border-radius: var(--bs-border-radius-pill);
}
#vision section::{
   position: relative;
}
#vision [class*="box_bg"] {
   display: flex;
   flex-direction: row;
   align-items: center;
   text-align: left;
   background-color: #fff;
}
#vision [class*="box_bg"] {
   height: 100%;
   padding: 1rem;
   background-repeat: no-repeat;
   background-size: 70%;
   background-position: center;
}
#vision [class*="box_bg"]::before {
   content: '';
   min-width: 5rem;
   min-height: 7rem;
   margin-right: 1rem;
   background-position: center;
   background-repeat: no-repeat;
   background-size: contain;
}
#vision .box_bg_01::before {
   background-image: url("../html/images/bg-icon_vision_01-1.png");
}
#vision .box_bg_02::before {
   background-image: url("../html/images/bg-icon_vision_02-1.png");
}
#vision .box_bg_03::before {
   background-image: url("../html/images/bg-icon_vision_03-1.png");
}
#vision .box_bg_04::before {
   background-image: url("../html/images/bg-icon_vision_04-1.png");
}
@media (min-width: 992px) {
   #vision .box_group {
      background: #fff url(../html/images/bg_vision_02.jpg) no-repeat center;
   }
   #vision section:has(.box_group)::before {
      content: '';
      display: block;
      position: absolute;
      left: 50%;
      top: -4rem;
      transform: translateX(-50%);
      min-width: 7px;
      height: calc(50% + 4rem);
      background: url("../html/images/before_vision.png") no-repeat center top;
      background-size: contain;
   }
   #vision section:has(.box_group) > h5 {
      font-size: 3rem;
      background: none;
      border-radius: 0;
   }
   #vision [class*="box_bg"] {
      min-height: 11rem;
      padding: 1.5rem 2rem;
   }
   #vision [class*="box_bg"]::before {
      margin-right: 0;
   }
   #vision .box_group >div:nth-child(2n-1) [class*="box_bg"] {
      flex-direction: row-reverse;
      text-align: right;
   }
   #vision .box_group >div:nth-child(2n-1) .box_text {
      margin-right: 1rem;
   }
   #vision .box_group >div:nth-child(2n) .box_text {
      margin-left: 1rem;
   }
   #vision .box_bg_01 {
      background-image: url("../html/images/bg-icon_vision_01-2.png");
   }
   #vision .box_bg_02 {
      background-image: url("../html/images/bg-icon_vision_02-2.png");
   }
   #vision .box_bg_03 {
      background-image: url("../html/images/bg-icon_vision_03-2.png");
   }
   #vision .box_bg_04 {
      background-image: url("../html/images/bg-icon_vision_04-2.png");
   }
   #vision section:has(.box_group) {
      position: relative;
   }
   #vision section:has(.box_group) >h5 {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin-bottom:0;
   }
}
@media (min-width: 1200px) {
   #vision h5.rounded-pill {
      margin-bottom: 3rem;
   }
   #vision [class*="box_bg"] {
      min-height: 20rem;
      padding: 3rem;
      background-size: auto;
   }
   #vision [class*="box_bg"]::before {
      min-width: 7rem;
      background-size: auto;
   }
   #vision .box_group >div:nth-child(2n-1) .box_text {
      margin-right: 3rem;
   }
   #vision .box_group >div:nth-child(2n) .box_text {
      margin-left: 3rem;
   }
   #vision .box_bg_01,
   #vision .box_bg_02 {
      align-items: flex-end !important;
   }
   #vision .box_bg_03,
   #vision .box_bg_04  {
      align-items: flex-start !important;
   }
   #vision .box_bg_01 {
      background-position: 20% 160%;
   }
   #vision .box_bg_02 {
      background-position: 85% 300%;
   }
   #vision .box_bg_03 {
      background-position: 20% -70%;
   }
   #vision .box_bg_04 {
      background-position: 85% -50%;
   }
}
@media (max-width: 768px) {
   #vision h5.rounded-pill ~ * >br,
   #vision .box_text br {
      display: none !important;
   }
}
@media (max-width: 576px) {
   #subPage > #vision.inner > section {
      margin-bottom: 6rem;
   }
   #vision section:nth-child(1) {
      padding-bottom: 3rem;
      margin-bottom: 0;
   }
   #vision h5.rounded-pill {
      padding: .5rem 1.25rem;
   }
   #vision .display-4 {
      font-size: 1.5rem;
   }
   #vision .display-6,
   #vision .box_text h6 {
      font-size: 1.25rem !important;
   }
}
/* 비전 E */


/* 연혁 S */
#history [class*="box_bg"] {
   background-size: cover !important;
}

.history_top {
   background: url(../html/images/bg_history_top.png) no-repeat right 7%;
   background-size: 80%;
}
.history_top .row > div:has([class*="box_bg"]) {
   position: relative;
   min-height: 300px;
}
.history_top [class*="box_bg"] {
   position: absolute;
   margin-left: calc(var(--bs-gutter-x) * 0.5);
   margin-right: calc(var(--bs-gutter-x) * 0.5);
}
.history_top .box_bg_01 {
   top: 50%;
   left: 0;
   transform: translateY(-50%);
   z-index: 3;
   width: 40%;
   aspect-ratio: 3 / 4;
   background: url(../html/images/bg_history_top_01.jpg) no-repeat center;
}
.history_top .box_bg_02 {
   top: 0;
   right: 0;
   z-index: 2;
   width: 50%;
   aspect-ratio: 3 / 2;
   background: url(../html/images/bg_history_top_02.jpg) no-repeat center;
}
.history_top .box_bg_03 {
   bottom: 0;
   right: 0;
   z-index: 1;
   width: 35%;
   aspect-ratio: 1 / 1;
   background: url(../html/images/bg_history_top_03.jpg) no-repeat center;
}
#history [class^="part_year"] {
   aspect-ratio: 2 / 1;

}
#history [class^="part_year"] h5 {
   color: #ffffffbf;
   height: 100%;
   backdrop-filter: brightness(90%);
   border-radius: var(--bs-border-radius) !important;
   transition: backdrop-filter 0.2s;
}
#history [class^="part_year"] h5:hover {
   backdrop-filter: brightness(70%);
}
.box_bg.part_year_2021 {
   background: url(../html/images/bg_history_y2021.jpg) no-repeat 50% 80%;
}
.box_bg.part_year_2019 {
   background: url(../html/images/bg_history_y2019.jpg) no-repeat center;
}
.history-list {
   margin-top: 1rem;
   padding-bottom: 1.25rem;
   color: var(--bs-secondary-color) !important;
   border-bottom: 1px solid var(--bs-border-color);
}
.history-list + .year {
   margin-top: 1.5rem;
}
.history-list > li {
   display: flex;
   flex-direction: row;
   margin-bottom: .5rem;
}
.history-list .date {
   word-break: keep-all;
   display: inline-block;
   min-width: 3rem;
   margin-right: 1.5rem;
   font-family: "Roboto", sans-serif;
   font-weight: 600;
}
@media (min-width: 576px) {
   .history_top .box_bg_01 {
      width: 25%;
   }
   .history_top .box_bg_02 {
      width: 40%;
   }
   .history_top .box_bg_03 {
      right: 30%;
      width: 30%;
   }
}
@media (min-width: 992px) {
   .history_top {
      background-position: left bottom;
      background-size: auto;
   }
   .history_top .row {
      min-height: 500px;
   }
   .history_top .box_bg_01 {
      width: 41.5%;
      aspect-ratio: 2 / 3 !important;
   }
   .history_top .box_bg_02 {
      width: 68.5%;
   }
   .history_top .box_bg_03 {
      right: 0;
      width: 41.5%;
   }
   #history [class^="part_year"] {
      aspect-ratio: 1 / 1;
   }
   .box_bg.part_year_2021 {
      background-position: center;
   }
}
@media (min-width: 1200px) {
   #history [class^="part_year"] h5 {
      border-radius: var(--bs-border-radius-xl) !important;
   }
   .history_top .row {
      min-height: 700px;
      font-size: 1.25rem;
   }
   .history-list {
      margin-top: 3rem;
      padding-bottom: 3rem;
   }
   .history-list + .year {
      margin-top: 3.5rem;
   }
   .history-list > li {
      margin-bottom: 1rem;
   }
}
@media (min-width: 1400px){
   #history [class^="part_year"] h5 {
      font-size: 6rem !important;
   }
}
/* 연혁 E */

/* 특허인증현황 S */
#certificate section:not(:first-child) {
   padding-top: 5rem;
   border-top: 1px solid var(--bs-border-color);
}
#certificate h5 {
   margin-bottom: 1rem;
   color: var(--op-primary);
   font-size: 1.5rem !important;
   font-weight: 900;
   line-height: 1.25 !important;
}
#certificate .item_text {
   color: var(--bs-secondary-color);
}
#certificate h6 {
   color: var(--bs-body-color);
   font-weight: 700;
}
#certificate .item_box {
   padding: 1.5rem;
   border: 1px solid var(--bs-light-border-subtle);
   border-radius: 1rem;
   background-color: var(--bs-tertiary-bg);
}
#certificate .item_box:has(.item_text) {
   padding-bottom: 1rem;
}
#certificate img[src*="certificate"] {
   width: 100%;
   object-fit: cover;
}
#certificate .row-cols-xl-2 .item_text {
   margin-top: auto;
   padding: 1rem;
}
#certificate .row-cols-xl-2 .item_text h6{
   margin-top:auto
}
#certificate .row-cols-xl-4 .item_text {
   margin-top: 1rem;
   text-align: center;
}
#certificate .row-cols-xl-2 h6 {
   margin-bottom: .5rem;
}
@media (min-width: 992px){
   #certificate section:not(:first-child) {
      padding-top: 6rem;
   }
   #certificate .item_box {
      padding: 3rem;
   }
}
@media (min-width: 1200px) {
   #certificate h5 {
      font-size: 2rem !important;
   }
   #certificate h6 {
      font-size: 1.25rem !important;
   }
   #certificate .row-cols-xl-2 .item_box {
      margin-right: .75rem;
   }
   #certificate .row-cols-xl-2 .item_text {
      padding: 3rem 1rem;
   }
   #certificate [class*="bg_trademark"]::before {
      content: '';
      width: 100%;
      height: 3rem;
      display: block;
      position: relative;
      top: -3rem;
      background-size: contain;
      background-repeat: no-repeat;
   }
   #certificate .bg_trademark_01::before {
      background-image: url("../html/images/certificate_bg_trademark_01.png");
   }
   #certificate .bg_trademark_02::before {
      background-image: url("../html/images/certificate_bg_trademark_02.png");
   }
}
@media (max-width: 576px) {
   #certificate .item_box {
      padding: .75rem;
      border-radius: .5rem;
   }
   #certificate .row-cols-xl-2 .item_text {
      padding: .5rem;
   }
   #certificate .item_text p,
   #certificate .item_text li {
      font-size: .75rem;
   }
   #certificate .item_text span {
      display: block;
   }
}

/* 특허인증현황 E */


/* 오시는길 S */
#subPage > #location.inner section {
   margin-bottom: 0 !important;
}
#location .item {
   display: flex;
   flex-direction: row;
   align-items: center;
}
#location .item:not(:first-child) {
   margin-top: 1rem;
}
#location p.rounded-circle:has(i) {
   width: 3rem;
   height: 3rem;
   aspect-ratio: 1 / 1;
   line-height: 3rem;
   color: #fff;
   background-color: var(--bs-primary);
   text-align: center;
}
#location dl {
   margin-left: 1rem;
}
#location section >div {
   width: 100%;
}
#location .wrap_controllers,
#location .cont,
#location .map_border {
   display: none;
}
#location .rounded-bottom-4 .map {
   height: 400px;
   border: 1px solid var(--bs-border-color);
   border-radius: 0 0 1rem 1rem ;
}
@media (max-width: 576px) {
   #location .item {
      align-items: flex-start;
   }
   #location p.rounded-circle:has(i) {
      width: 2rem;
      height: 2rem;
      line-height: 2rem;
   }
   #location section:has(.map) {
      height: 300px;
   }
}
/* 오시는길 E */


/* 제품소개 서브메뉴 S */
.psmWrap {
   --psm-img-width: 2rem;
   display: flex;
   justify-content: center;
   align-items: center;
}
.psmWrap li {
   text-align: center;
}
.psmWrap li >a {
   margin: 0 auto;
   display: flex;
   flex-direction: row;
   align-items: center;
}
.psmWrap li div:has(img) {
   width: var(--psm-img-width);
   border: 1px solid var(--bs-light-border-subtle);
   border-radius: 50%;
}
.psmWrap img {
   padding: 1.5rem;
   object-fit: contain;
}
.psmWrap dl {
   margin-left: .25rem;
   color: rgb(var(--bs-secondary-rgb));
   font-size: 0.75rem;
   line-height: 1.25;
   text-align: left;
   overflow-wrap: break-word;
   word-break: keep-all;
}
.psmWrap a > div:has(img):hover {
   background-color: #fff;
   border-width: 5px;
}
.psmWrap a.on >div:has(img) {
   background-color: #fff;
   border: 5px solid var(--op-green);
}
.psmWrap a.on >dl {
   color: var(--op-green);
   font-weight: 800;
}

@media (min-width: 768px) {
   .psmWrap {
      --psm-img-width: 6.5rem;
   }
   .psmWrap ul {
      justify-content: center !important;
   }
   .psmWrap li {
      min-width: calc(var(--psm-img-width) + var(--bs-gutter-x) * 2);
   }
   .psmWrap li >a {
      flex-direction: column;
      width: fit-content;
   }
   .psmWrap dl {
      margin-left: 0;
      margin-top: .5rem;
      font-size: .875rem;
      text-align: center;
   }
}
@media (min-width: 992px) {
   .psmWrap >*[class^="container"] {
      max-width: 100% !important;
   }
   .psmWrap li {
      min-width: calc(var(--psm-img-width) + var(--bs-gutter-x) * 2.5);
   }
}
@media (min-width: 1600px) {
   .psmWrap {
      --psm-img-width: 7.5rem;
   }
   .psmWrap dl {
      font-size: 1rem;
   }
}
@media (max-width: 768px) {
   .psmWrap li div:has(img) {
      border-radius: 0;
      border: none !important;
      background-color: transparent !important;
   }
   .psmWrap img {
      padding: .25rem;
   }
}
/* 제품소개 서브메뉴 E */


/* 제품소개 S */
#product img {
   object-fit: contain;
}
#product >section  {
   margin-bottom: 4rem;
}
#product >section.product_top  {
   margin-bottom: 2rem;
}
#product >section.border-top {
   padding-top: 4rem;
}
#product article {
   color: var(--bs-secondary-color);
}
#product article:not(:last-child) {
   margin-bottom: 1.5rem;
}
#product h4,
#product h4 *,
#product h5 {
   font-weight: 900;
   text-transform: uppercase;
   color: var(--op-primary);
}
#product h5 {
   margin-bottom: .5rem;
   font-size: 1.25rem !important;
   line-height: 1.25 !important;
}
#product h5 small {
   font-weight: 600;
   text-transform: none;
}
#product h6 {
   font-weight: 600;
}
#product article h6[class*="bg-"] {
   display: inline-block;
   margin-bottom: .25rem;
   padding: .25rem .5rem;
   color: #fff;
   font-size: 1rem !important;
   text-align: center;
}

#product ul.list_disc {
   margin-left: 1rem;
}
#product ul.list_disc li {
   margin-bottom: .25rem;
   list-style-type: disc;
}
#product ul.list_disc li::marker {
   font-size: .8rem;
   vertical-align: text-top !important;
}
#product .product_top .ci {
   height: 100%;
   max-height: 100px;
   aspect-ratio: 9 / 10;
   background: url("../html/images/product/product_ci.svg") no-repeat center 85%;
   background-size: 80%;
}
.product_top .btn {
   padding: .5rem .75rem;
}

#product article.border-green {
   --bs-border-opacity: .5;
}
article:has(.product_bg-icon) * {
   line-height: 1.25;
}
article:has(.product_bg-icon) h5 {
   font-weight: 900;
}
.product_bg-icon {
   height: 100%;
}
.product_bg-icon >li {
   display: flex;
   align-items: center;
}
.product_bg-icon >li::before {
   content: '';
   display: inline-block;
   margin-right: 1rem;
   aspect-ratio: 1 / 1;
   height: 100%;
   min-height: 4.5rem;
}
.product_bg-icon:has(li.flex-column) >li::before {
   margin-right: 0;
   margin-bottom: .5rem;
}
.product_bg-icon *[class^="icon_"]::before {
   background-size: contain;
}
.product_bg-icon .icon_01::before {
   background-image: url("../html/images/product/bg-icon_01.png");
}
.product_bg-icon .icon_02::before {
   background-image: url("../html/images/product/bg-icon_02.png");
}
.product_bg-icon .icon_03::before {
   background-image: url("../html/images/product/bg-icon_03.png");
}
.product_bg-icon .icon_04::before {
   background-image: url("../html/images/product/bg-icon_04.png");
}
.product_bg-icon .icon_05::before {
   background-image: url("../html/images/product/bg-icon_05.png");
}
.product_bg-icon .icon_06::before {
   background-image: url("../html/images/product/bg-icon_06.png");
}
.product_bg-icon .icon_07::before {
   background-image: url("../html/images/product/bg-icon_07.png");
}
.product_bg-icon .icon_08::before {
   background-image: url("../html/images/product/bg-icon_08.png");
}
.product_bg-icon .icon_09::before {
   background-image: url("../html/images/product/bg-icon_09.png");
}
.product_bg-icon .icon_10::before {
   background-image: url("../html/images/product/bg-icon_10.png");
}
.product_bg-icon dd >span {
   white-space: nowrap;
}
.product .text-pink {
   opacity: .5;
}
/* --op-primary */
.text-primary *[class^="icon_"]::before {
   filter: invert(10%) sepia(66%) saturate(3662%) hue-rotate(208deg) brightness(87%) contrast(102%);
}
/* --op-mcyan */
.text-mcyan *[class^="icon_"]::before {
   filter: invert(57%) sepia(97%) saturate(2725%) hue-rotate(170deg) brightness(86%) contrast(82%);
}
/* --op-green */
.text-green *[class^="icon_"]::before {
   filter: invert(57%) sepia(34%) saturate(911%) hue-rotate(49deg) brightness(98%) contrast(87%);
}
/* --op-yellow */
.text-yellow *[class^="icon_"]::before {
   filter: invert(61%) sepia(74%) saturate(2078%) hue-rotate(3deg) brightness(98%) contrast(103%);
}
/* --op-pink*/
.text-pink *[class^="icon_"]::before {
   filter: invert(41%) sepia(69%) saturate(809%) hue-rotate(290deg) brightness(94%) contrast(89%);
}
/* --op-brown */
.text-brown *[class^="icon_"]::before {
   filter: invert(33%) sepia(97%) saturate(805%) hue-rotate(3deg) brightness(100%) contrast(101%);
}
.product_bg-icon dt {
   margin-bottom: .25rem;
   font-weight: 800;
}
.product_bg-icon dd {
   font-size: 0.875rem;
}

#product .product_info * {
   font-size: 1rem;
}
#product .product_info h6 {
   min-width: 5rem;
}

#product .table {
   --bs-border-opacity: .3;
}
#product th,
#product td {
   white-space: nowrap;
}
#product .table tr>* {
   width: 20%;
   vertical-align: middle;
}
#product .table tr>*:nth-child(1),
#product .table tr>*:nth-child(2) {
   min-width: 8rem;
}
#product thead th:first-child {
   border-radius: .5rem 0 0 .5rem;
}
#product thead th:last-child {
   border-radius: 0 .5rem .5rem 0;
}
#product tbody tr:first-child>*:first-child {
   border-radius: .5rem .5rem 0 0;
}

@media (min-width: 576px) {
   #product >section.border-top {
      padding-top: 3rem;
   }
   .product_top .btn {
      padding: 1rem 1.5rem;
   }
   .product_top .btn:first-child >i {
      display:none;
   }
}
@media (min-width: 768px) {
   #product img[src*="/img-p_"] {
      padding: 5rem;
   }
   .product_bg-icon dt {
      font-size: 1.25rem;
   }
   .product_bg-icon li::before {
      min-height: 6rem;
   }
   #product article h6[class*="bg_"] {
      margin-bottom: .5rem;
      padding: .5rem 1rem;
   }
}
@media (min-width: 1200px) {
   #product >section {
      margin-bottom: 8rem;
   }
   #product >section.border-top {
      padding-top: 8rem;
   }
   #product article:not(:last-child) {
      margin-bottom: 3.5rem;
   }
   #product h5 {
      margin-bottom: 1rem;
      font-size: 2rem !important;
   }
   #product h5[class^="col-xl-"] {
      margin: 0 !important;
   }
   #product h5.fs-4 {
      font-size: 1.5rem !important;
   }
   #product article ul[class*="list_"],
   #product article p {
      font-size: 1.25rem;
   }
   #product img[src*="img-p_"] {
      padding: 4rem !important;
   }
}
@media (min-width: 1400px) {
   #product h5 span {
      display: inline-block;
      white-space: nowrap;
   }
}
@media (max-width: 576px) {
   #product >section  {
      margin-bottom: 3rem;
   }
   .product_top .display-5 {
      font-size: 1.5rem;
   }
   .product_top ul:has(.btn) li:first-child span {
      display:none;
   }
   #product th,
   #product td {
      font-size: .875rem;
   }
   #product .table small {
      font-size: .75rem;
   }
   #product p.fs-5.text-bg-primary {
      font-size: 1rem !important;
   }
}
/* 제품소개 E */


/* 제품소개 graph_cylinder S */
div.graph_cylinder {
  --graph-padding-x: 1rem;
  --graph-padding-top: 1.5rem;
  --graph-padding-bottom: .5rem;
  --graph-yaxis-width: 2rem;
  --graph-xaxis-height: 1.5rem;
  --graph-g-width: 3rem;
  --graph-grid-height: calc(150px / 3);
  --graph-grid-bottom-heigh: 1rem;
  --op-bg-opacity: .8;

  position: relative;
  width: 100%;
  height: 220px;
  padding: var(--graph-padding-top) var(--graph-padding-x) var(--graph-padding-bottom);
  padding-bottom: var(--graph-padding-bottom);
  padding-left: calc(var(--graph-yaxis-width) + var(--graph-padding-x));
  font-size: 0.875rem;
}
div.graph_cylinder.y-grid-4 {
   --graph-grid-height: calc(150px / 4);
}
/* hyperlinks */
div.graph_cylinder a {
  color: #444444;
  text-decoration: none;
}
/* lists */
div.graph_cylinder ul {
  margin: 0px;
  padding: 0px;
  width: 100%;
  list-style-type: none;
}
div.graph_cylinder li {
  margin: 0px;
  padding: 0px;
  width: var(--graph-g-width);
}

/* ==================== Y-AXIS LABELS ==================== */
/* base */
div.graph_cylinder ul.y_axis {
  position: absolute;
  top: var(--graph-padding-top);
  left: var(--graph-padding-x);
  width: var(--graph-yaxis-width);
  text-align: right;
}
/* labels */
div.graph_cylinder ul.y_axis li {
  box-sizing: border-box;
  width: 100%;
  height: var(--graph-grid-height);
  line-height: var(--graph-grid-height);
  float: left;
  color: var(--bs-gray-600);
  /* --- alignment correction --- */
  border-top: 1px solid transparent;
  position: relative;
  left: -0.25rem;
  transform: translate(0, -50%);
}

/* ==================== X-AXIS LABELS  ==================== */
div.graph_cylinder ul.x_axis,
div.graph_cylinder ul:has(.bar)  {
  width: calc(100% - var(--graph-yaxis-width) - var(--graph-padding-x) * 2);
}
div.graph_cylinder ul:has(.bar) {
  position:absolute;
  bottom: calc(var(--graph-padding-bottom) + var(--graph-xaxis-height) + var(--graph-grid-bottom-heigh));
}
/* base */
div.graph_cylinder ul.x_axis {
  position: absolute;
  bottom: calc(var(--graph-padding-x) * .5);
  left: calc(var(--graph-yaxis-width) + 1rem);
  text-align: center;
}
div.graph_cylinder ul.x_axis li:first-child {
   font-weight: 700;
}

/* ==================== GRAPH  ==================== */
/* base */
div.graph_cylinder div.graph {
  width: 100%;
  height: 100%;
}
/* grid */
div.graph_cylinder div.graph ul.grid {
  width: 100%;
}
div.graph_cylinder div.graph li {
  box-sizing: border-box;
  width: 100%;
  height: var(--graph-grid-height);
  float: left;
  border-top: 1px solid var(--bs-border-color);
}
div.graph_cylinder div.graph li.bottom {
  background-color: var(--bs-gray-200);
  height: var(--graph-grid-bottom-heigh);
}

/* ==================== BARS COMMON  ==================== */
/* common styles */
div.graph_cylinder div.graph li.bar {
  width: var(--graph-g-width);
  position: relative;
  bottom: 0;
  text-align: center;

	/* --- transitions --- */
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
/* bar top circle */
div.graph_cylinder div.graph li.bar div.top {
  width: 100%;
  height: 20px;
  margin-top: -10px;

  /* --- css3 --- */
  -moz-border-radius: 50px/20px;
  -webkit-border-radius: 50px 20px;
  border-radius: 50px/20px;

  /* --- transitions --- */
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
/* bar bottom circle */
div.graph_cylinder div.graph li.bar div.bottom {
  width: 100%;
  height: 20px;
  position: absolute;
  bottom: -10px;
  left: 0px;

  /* --- css3 --- */
  -moz-border-radius: 50px/20px;
  -webkit-border-radius: 50px 20px;
  border-radius: 50px/20px;

  /* --- transitions --- */
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
/* bar top label */
div.graph_cylinder div.graph li.bar span {
  display: inline-block;
  position: relative;
  top: -50px;
  left: 50%;
  transform: translate(-50%, 0);
  z-index: 100;
  color: #00265d;
  font-size: 0.75rem;
  font-weight: 700;

  /* --- shadow --- */
  text-shadow: 0px 1px 0px rgba(255,255,255,1);
  box-shadow: 0px 1px 0px rgba(0,0,0,0.1);
  -webkit-box-shadow: 0px 1px 0px rgba(0,0,0,0.1);
  -moz-box-shadow: 0px 1px 0px rgba(0,0,0,0.1);

  /* --- transitions --- */
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}

/* ==================== GREEN BAR  ==================== */
/* base */
.graph_cylinder >.graph .green {background: rgba(var(--op-green-rgb), var(--op-bg-opacity))}
/* top */
.graph_cylinder >.graph .green div.top { background: #a0d470}
/* bottom */
.graph_cylinder >.graph .green div.bottom { background: #68ae28}

/* ==================== MCYAN BAR  ==================== */
/* base */
.graph_cylinder >.graph .mcyan {background: rgba(var(--op-mcyan-rgb), var(--op-bg-opacity))}
/* top */
.graph_cylinder >.graph .mcyan div.top {background: #62c1f0}
/* bottom */
.graph_cylinder >.graph .mcyan div.bottom {background: #2091ca}

/* ==================== yellow BAR  ==================== */
/* base */
.graph_cylinder >.graph .yellow {background: rgba(var(--op-yellow-rgb), var(--op-bg-opacity))}
/* top */
.graph_cylinder >.graph .yellow div.top {background: #f7d095}
/* bottom */
.graph_cylinder >.graph .yellow div.bottom {background: #f39800}

/* ==================== brown BAR  ==================== */
/* base */
.graph_cylinder >.graph .brown {background: rgba(var(--op-brown-rgb), var(--op-bg-opacity))}
/* top */
.graph_cylinder >.graph .brown div.top {background: #ebab66}
/* bottom */
.graph_cylinder >.graph .brown div.bottom {background: #b96000}

/* ==================== GRAY BAR  ==================== */
/* base */
.graph_cylinder >.graph .gray {background: rgba(173, 181, 189, var(--op-bg-opacity))}
/* top */
.graph_cylinder >.graph .gray div.top { background: #ced4da}
/* bottom */
.graph_cylinder >.graph .gray div.bottom { background: #adb5bd}

/* ==================== HOVERS  ==================== */
.graph_cylinder div.graph li.green:hover {background: var(--op-green)}
.graph_cylinder div.graph li.mcyan:hover {background: var(--op-mcyan)}
.graph_cylinder div.graph li.yellow:hover {background: var(--op-yellow)}
.graph_cylinder div.graph li.brown:hover {background: var(--op-brown)}
.graph_cylinder div.graph li.bar:hover span {top: -55px; margin: 0px;}
/* 제품소개 graph_cylinder E */


/* 연구개발 S */
#research > section  {
   margin-bottom: 10rem;
}
#research h5, #research h6 {
   font-weight: 800;
}
#research [class*="box_bg"] {
   background-size: cover !important;
   background-repeat: no-repeat;
   background-position: center;
}
.research-top > div ~ div {
   margin-top: 1rem;
}
.research-top [class*="box_bg"],
.research-wide [class*="box_bg"] {
   width: 100%;
   aspect-ratio: 2 / 1;
}
.research-top .box_bg_01 {
   background-image: url("../html/images/bg_research_top_01.jpg");
}
.research-top .box_bg_02 {
   background-image: url("../html/images/bg_research_top_02.jpg");
}
.research-top .box_bg_03 {
   background-image: url("../html/images/bg_research_top_03.jpg");
}
.research-top .box_text h6 {
   margin-bottom: 1rem;
}
.research-top .box_text br {
   display: none;
}
.research-wide [class*="box_bg"] {
   background-image: url("../html/images/bg_research_01.jpg");
}
.research-bottom [class*="box_bg"],
.research-bottom .box_text  {
   min-height: 20rem;
}
.research-bottom [class*="box_bg"] ~ [class*="box_bg"] {
   margin-top: 1rem;
}
.research-bottom {
   --op-before-width: 2rem;
}
.research-bottom h6 {
   position: relative;
   padding-left: calc(var(--op-before-width) + .5rem);
}
.research-bottom h6::before {
   content:'';
   position: absolute;
   top: 50%;
   left: 0;
   width: var(--op-before-width);
   height: var(--op-before-width);
   transform: translateY(-50%);
   background-size: contain;
   background-position: center;
}
.research-bottom .box_bg_01 h6::before {
   background-image: url("../images/icon_main_rnd_01_wh.png");
}
.research-bottom .box_bg_02 h6::before {
   background-image: url("../images/icon_main_rnd_02_wh.png");
}
.research-bottom .box_bg_03 h6::before {
   background-image: url("../images/icon_main_rnd_03_wh.png");
}
.research-bottom .box_text {
   color: #fff;
   backdrop-filter: brightness(75%);
   border-radius: inherit;
   transition: backdrop-filter 0.2s;
}
.research-bottom .box_text:hover {
   backdrop-filter: brightness(60%);
}
.research-bottom div .box_bg_01 {
   background-image: url("../html/images/bg_research_02.jpg");
}
.research-bottom div .box_bg_02 {
   background-image: url("../html/images/bg_research_03.jpg");
}
.research-bottom div .box_bg_03 {
   background-image: url("../html/images/bg_research_04.jpg");
}
@media (min-widht: 768px) {
   #research .box_text * {
      word-break: keep-all;
   }
}
@media (min-width: 992px) {
   #research [class*="rounded"] {
      --bs-border-radius: 1rem;
   }
   .research-top > div ~ div {
      margin-top: 0;
   }
   .research-top [class*="box_bg"] {
      aspect-ratio: 7 / 5 !important;
   }
   .research-top .box_text h6 {
      margin-bottom: 2rem;
   }
   .research-top .box_text h6 > br {
      display: block !important;
   }
   .research-wide .box_bg {
      min-height: 20rem;
      aspect-ratio: auto;
   }
   .research-bottom h6 {
      padding-left: calc(var(--op-before-width) + .75rem);
   }
}
@media (min-width: 1200px) {
   .research-bottom {
      --op-before-width: 2.6rem;
   }
   .research-bottom h6::before {
      background-size: auto;
   }
   .research-bottom [class*="box_bg"],
   .research-bottom .box_text  {
      min-height: 25rem;
   }
   .research-bottom .box_text {
      font-size: 1.25rem;
   }
}
@media (min-width: 1400px) {
   .research-top .box_text h6.fs-4 {
      font-size: 1.75rem !important;
   }
   #research .box_text p > br {
      display: block !important;
   }
}
@media (max-width: 576px) {
   #subPage > #research.inner > section {
      margin-bottom: 4rem;
   }
}
/* 연구개발 E */

/* 보유시설 S */
#facility img {
   width: 100%;
}
#facility h6 {
   margin-bottom: .5rem;
   color: var(--bs-primary);
   font-weight: 900;
}
#facility h6 + p {
   margin-bottom: .75rem;
   font-weight: 600;
}
#facility .item_text {
   padding-top: 1.5rem;
   margin-bottom: 1.5rem;
   border-top: 2px solid var(--bs-border-color);
}
@media (min-width: 992px) {
   #facility .item:nth-child(2n-1) {
      padding-right: 3rem;
   }
   #facility .item:nth-child(2n) {
      padding-left: 3rem;
   }
   #facility .item_text {
      padding-top: 3rem;
      margin-bottom: 3rem;
   }
   #facility h6 {
      margin-bottom: 1rem;
   }
   #facility h6 + p {
      margin-bottom: 1.5rem;
      font-weight: 700;
   }
}
@media (max-width: 576px) {
   #facility h6 + p {
      font-size: var(--bs-body-font-size) !important;
   }
}
/* 보유시설 E */

/* 주요동반자 S */
#customer .item_img {
   min-height: 12rem;
   position: relative;
}
#customer .item_img > img {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   max-width: 80%;
}
#customer [class^="item"] {
   border: 1px solid var(--bs-border-color);
}
#customer a {
   color: var(--bs-secondary-color);
}
#customer h5 {
   color: var(--op-primary);
   font-size: 1.5rem !important;
   font-weight: 900;
   line-height: 1.25 !important;
}
@media (min-width: 1200px) {
   #customer h5 {
      font-size: 2rem !important;
   }
}
/* 주요동반자 E */

/* 고객지원 > Contact Us S */
#contact .agree-terms {
   overflow-x: hidden;
   overflow-y: auto;
   height: 300px;
   width: 99%;
   margin-top: 20px;
   padding: 25px 30px;
   color: #666;
   line-height: 22px;
   border: 1px solid #ddd;
   background: transparent;
}

#contact .agree-terms p {
   font-size: 18px;
   margin: 0 0 10px 0;
}

#contact .agree-terms h4 {
   font-size: 18px;
   margin: 20px 10px 0 0;
   font-weight: 500;
   color: #555;
   line-height: 1.8;
}

#contact .ag_widthline {
   margin-top: 5px;
   font-size: 17px;
}

#contact .ag_widthline > li {
   position: relative;
   padding-left: 14px;
   margin-bottom: 5px;
}

/* 라디오 버튼 영역 스타일 수정 */
#contact .reg_ag {
   margin: 25px 0;
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 30px;
   /* 버튼 사이 간격 */
}

#contact .regag_check {
   position: relative;
   display: flex;
   align-items: center;
}

/* 실제 라디오 버튼 숨김 */
#contact .regag_check input[type='radio'] {
   position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip: rect(0, 0, 0, 0);
   border: 0;
}

/* 라디오 버튼 라벨 (기본 텍스트 및 박스 위치) */
#contact .regag_check input[type='radio'] + label {
   display: inline-flex;
   align-items: center;
   position: relative;
   cursor: pointer;
   font-size: 18px;
   color: #333;
   user-select: none;
}

/* 체크박스 모양 (네모 박스 만들기) */
#contact .regag_check input[type='radio'] + label:before {
   content: '';
   display: inline-block;
   width: 30px;
   height: 30px;
   margin-right: 10px;
   /* 박스와 텍스트 사이 간격 */
   background: #fff;
   border: 1px solid #ccc;
   /* 회색 테두리 */
   box-sizing: border-box;
   transition: all 0.2s;
}

/* 체크되었을 때 박스 스타일 (주황색 배경) */
#contact .regag_check input[type='radio']:checked + label:before {
   background: #f8971c;
   border-color: #f8971c;
}

/* 체크되었을 때 체크 표시 (CSS로 체크 모양 그리기) */
#contact .regag_check input[type='radio']:checked + label:after {
   content: '';
   position: absolute;
   left: 11px;
   /* 체크 위치 미세 조정 */
   top: 8px;
   /* 체크 위치 미세 조정 */
   width: 7px;
   height: 11px;
   border: solid #fff;
   border-width: 0 2px 2px 0;
   /* L자 모양 만들기 */
   transform: rotate(45deg);
   /* 회전시켜 체크 모양 만들기 */
}

#contact .con_title:after {
   display: inline-block;
   width: 12px;
   height: 12px;
   content: '';
   background-color: #6fb43f;
   border-radius: 50%;
   margin-left: 5px;
}

/* ==================================================
	접수하기 form
================================================== */
/* 테이블 */
#contact .tb_wrap {
   border-top: 1px solid #d6d6d6;
   border-bottom: 1px solid #d6d6d6;
   overflow: hidden;
   /*box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.10);*/
   margin-top: 25px;
}

#contact .tb_form {
   position: relative;
   left: -1px;
   width: 100%;
   margin-bottom: -1px;
   font-size: 20px;
}

#contact .tb_form th {
   text-align: left;
   padding: 18px 20px;
   border-bottom: 1px solid #e8e8e8;
   border-left: 1px solid #e8e8e8;
   background: #fafafa;
   font-weight: 500;
   line-height: 1;
   color: #333;
   vertical-align: middle;
}

#contact .tb_form td {
   padding: 12px 20px;
   border-bottom: 1px solid #e8e8e8;
   border-left: 1px solid #e8e8e8;
   vertical-align: middle;
}

#contact .tb_form tbody tr td input::placeholder {
  color: #898989;
  font-size: 18px;
}
#contact .tb_form tbody tr td input[type="password"],
#contact .tb_form tbody tr td input[type="text"] {
    -webkit-appearance: none;
    width: 100%;
    background: #fff;
    border: 1px solid #D9D9D9 !important;
    -webkit-appearance: none;
    box-shadow: none;
    padding: 0px 10px;
    box-sizing: border-box;
    height: 40px;
    text-align: left;
}
#contact .tb_form tbody tr td textarea {
    padding: 20px;
    width: 100%;
    min-height: 200px;
    vertical-align: middle;
    line-height: 1.5;
    background: #fff;
    border: 1px solid #D9D9D9;
    color: #898989;
    -webkit-appearance: none;
    box-shadow: none;
    border-radius: 0;
    resize: vertical;
}
/* 테이블사이즈 */
#contact .conformtb_width01 {
   width: 25%;
}

#contact .conformtb_width02 {
   width: 75%;
}

/* 테이블 안 내용 */
#contact .file {
   position: relative;
   width: 100%;
   display: flex;
}

#contact .file input[type='file'] {
   position: absolute;
   top: 0;
   left: 0;
   opacity: 0;
   z-index: -1;
}

#contact .file input[type='text'] {
   margin-right: 5px;
}

#contact .file a {
   vertical-align: top;
}

#contact .file span {
   margin-left: 20px;
   font-size: 15px;
   color: #767676;
}

#contact a.fileBtn {
   display: inline-block;
   flex-shrink: 0;
   width: 90px;
   padding: 0 10px;
   height: 40px;
   line-height: 40px;
   background: #333;
   font-weight: normal;
   font-size: 17px;
   color: #fff;
   text-align: center;
   margin-left: 0px !important;
   cursor: pointer;
}

#contact a.fileBtn:hover {
   background: #000;
}

/* 모바일CSS */
@media screen and (max-width: 1030px) {
   /* 테이블 */
   #contact .tb_form {
      font-size: 17px;
   }
}

@media screen and (max-width: 767px) {
   /* 테이블 */
   #contact .tb_wrap {
      box-shadow: none;
      border: none;
   }

   #contact .tb_form {
      left: 0;
      margin-bottom: 0;
      font-size: 17px;
   }

   #contact .tb_form,
   #contact .tb_form thead,
   #contact .tb_form tbody,
   #contact .tb_form th,
   #contact .tb_form td,
   #contact .tb_form tr {
      display: block;
   }

   #contact .tb_form thead tr {
      position: absolute;
      top: -9999px;
      left: -9999px;
   }

   #contact .tb_form th {
      border: 1px solid #e6e6e6;
      border-bottom: none;
   }

   #contact .tb_form td {
      border: 1px solid #e6e6e6;
      border-bottom: 0;
      position: relative;
      padding: 10px;
   }

   #contact .tb_form td:last-child {
      border-bottom: 1px solid #e6e6e6;
   }
}

@media screen and (max-width: 767px) {
   #contact .tb_form {
      font-size: 16px;
   }
}

#contact ul.contact_ul {
	display: flex;
	justify-content: space-between;
	width: 100%;
}

#contact ul.contact_ul>li {
	display: flex;
	font-size: 18px;
}

#contact ul.contact_ul_32>li {
	flex-basis: 32%;
}

#contact ul.contact_ul_49>li {
	flex-basis: 49%;
}

#contact ul.contact_ul>li.contact_li_27 {
	flex-basis: 27%;
}

#contact ul.contact_ul>li.contact_li_43 {
	flex-basis: 43%;
}

/* 모바일CSS */
@media screen and (max-width:850px) {
	#contact ul.contact_ul {
		display: block;
		justify-content: left;
	}

	#contact ul.contact_ul>li {
		margin-top: 10px;
	}
}

@media screen and (max-width:767px) {
	#contact ul.contact_ul li .radio:not(:first-child) {
		margin-top: 0;
	}

	#contact ul.contact_ul>li {
		font-size: 1.7rem;
	}
}
#contact .reg_btn {
	text-align: center;
	padding: 30px 0 0 0;

}

#contact a.btn_confirm {
	display: inline-block;
	margin: 0px 5px;
	width: 220px;
	height: 60px;
	line-height: 60px;
	font-weight: 500;
	color: #fff;
	border: 1px solid #6fb43f;
	background-color: #6fb43f;
	cursor: pointer;
	border-radius: 3px;
	font-size: 20px;
  text-align: center;
}

#contact a.btn_cancel {
	display: inline-block;
	margin: 0px 5px;
	width: 220px;
	height: 60px;
	line-height: 60px;
	font-weight: 500;
	color: #888;
	background-color: #fff;
	border: 1px solid #888;
	cursor: pointer;
	border-radius: 3px;
	font-size: 20px;
}

#contact a.btn_confirm:hover,
#contact a.btn_cancel:hover {
	box-shadow: 5px 10px 15px rgba(0, 0, 0, 0.15);
}

/* 모바일CSS */
@media screen and (max-width:767px) {
	#contact .reg_btn {
		padding: 20px 0 0 0;
	}

	#contact .reg_ag {
		text-align: center;
		margin: 15px 0 15px;
	}

	#contact a.btn_confirm,
	#contact a.btn_cancel {
		width: 45%;
		height: 50px;
		line-height: 50px;
		font-size: 1.8rem;
	}
}

@media screen and (max-width:640px) {

	#contact a.btn_confirm,
	#contact a.btn_cancel {
		font-size: 1.7rem;
	}
}

@media screen and (max-width:450px) {

	#contact a.btn_confirm,
	#contact a.btn_cancel {
		font-size: 1.6rem;
	}
}
/* 고객지원 > Contact Us E */

/* 홍보센터 > 전시회 S */
.markingTitle {
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 25px;
   background-color: #00265D;
   color: #ffffff;
   width: 60px;
   height: 34px;
   margin-bottom: 0 !important;
   margin-right: 10px;
}
.markginCon {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   flex: 1;
   min-width: 0;
}
/* 홍보센터 > 전시회 E */
