img {
  -webkit-user-drag: none;
  -webkit-user-select: none;
  user-select: none;
}

/* noto-sans-kr-100 - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 100;
  src: url("/files/noto-sans-kr-v13-latin_korean-100.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-100.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-100.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-100.woff") format("woff"),
    /* Modern Browsers */ url("/files/noto-sans-kr-v13-latin_korean-100.ttf")
      format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-100.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}
/* noto-sans-kr-300 - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 300;
  src: url("/files/noto-sans-kr-v13-latin_korean-300.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-300.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-300.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-300.woff") format("woff"),
    /* Modern Browsers */ url("/files/noto-sans-kr-v13-latin_korean-300.ttf")
      format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-300.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}
/* noto-sans-kr-regular - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 400;
  src: url("/files/noto-sans-kr-v13-latin_korean-regular.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-regular.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-regular.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-regular.woff") format("woff"),
    /* Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-regular.ttf") format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-regular.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}
/* noto-sans-kr-500 - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 500;
  src: url("/files/noto-sans-kr-v13-latin_korean-500.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-500.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-500.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-500.woff") format("woff"),
    /* Modern Browsers */ url("/files/noto-sans-kr-v13-latin_korean-500.ttf")
      format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-500.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}
/* noto-sans-kr-700 - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 700;
  src: url("/files/noto-sans-kr-v13-latin_korean-700.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-700.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-700.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-700.woff") format("woff"),
    /* Modern Browsers */ url("/files/noto-sans-kr-v13-latin_korean-700.ttf")
      format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-700.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}
/* noto-sans-kr-900 - latin_korean */
@font-face {
  font-family: "Noto Sans KR";
  font-style: normal;
  font-weight: 900;
  src: url("/files/noto-sans-kr-v13-latin_korean-900.eot"); /* IE9 Compat Modes */
  src: local(""),
    url("/files/noto-sans-kr-v13-latin_korean-900.eot?#iefix")
      format("embedded-opentype"),
    /* IE6-IE8 */ url("/files/noto-sans-kr-v13-latin_korean-900.woff2")
      format("woff2"),
    /* Super Modern Browsers */
      url("/files/noto-sans-kr-v13-latin_korean-900.woff") format("woff"),
    /* Modern Browsers */ url("/files/noto-sans-kr-v13-latin_korean-900.ttf")
      format("truetype"),
    /* Safari, Android, iOS */
      url("/files/noto-sans-kr-v13-latin_korean-900.svg#NotoSansKR")
      format("svg"); /* Legacy iOS */
}

@font-face {
  font-family: "Recipekorea";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Recipekorea.woff")
    format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "BMDOHYEON";
  src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/BMDOHYEON.woff")
    format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'GmarketSans';
  font-weight: 300;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansLight.ttf') format("truetype");
  font-display: swap;
} 
@font-face {
  font-family: 'GmarketSans';
  font-weight: 500;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansMedium.ttf') format("truetype");
  font-display: swap;
} 
@font-face {
  font-family: 'GmarketSans';
  font-weight: 700;
  font-style: normal;
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot');
  src: url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.eot?#iefix') format('embedded-opentype'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff2') format('woff2'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.woff') format('woff'),
       url('https://cdn.jsdelivr.net/gh/webfontworld/gmarket/GmarketSansBold.ttf') format("truetype");
  font-display: swap;
} 

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);


@-webkit-keyframes spinAround {
  from {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes spinAround {
  from {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  to {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

.tabs,
.pagination-previous,
.pagination-next,
.pagination-link,
.pagination-ellipsis,
.breadcrumb,
.file,
.button,
.is-unselectable,
.modal-close,
.delete {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.navbar-link:not(.is-arrowless)::after,
.select:not(.is-multiple):not(.is-loading)::after {
  border: 3px solid transparent;
  border-radius: 2px;
  border-right: 0;
  border-top: 0;
  content: " ";
  display: block;
  height: 0.625em;
  margin-top: -0.4375em;
  pointer-events: none;
  position: absolute;
  top: 50%;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transform-origin: center;
  transform-origin: center;
  width: 0.625em;
}

.tabs:not(:last-child),
.message:not(:last-child),
.list:not(:last-child),
.level:not(:last-child),
.breadcrumb:not(:last-child),
.highlight:not(:last-child),
.block:not(:last-child),
.title:not(:last-child),
.subtitle:not(:last-child),
.table-container:not(:last-child),
.table:not(:last-child),
.progress:not(:last-child),
.notification:not(:last-child),
.content:not(:last-child),
.box:not(:last-child) {
  margin-bottom: 1rem;
}

.modal-close,
.delete {
  -moz-appearance: none;
  -webkit-appearance: none;
  background-color: rgba(10, 10, 10, 0.2);
  border: 0;
  border-radius: 290486px;
  cursor: pointer;
  pointer-events: auto;
  display: inline-block;
  flex-grow: 0;
  flex-shrink: 0;
  font-size: 0;
  height: 20px;
  max-height: 20px;
  max-width: 20px;
  min-height: 20px;
  min-width: 20px;
  outline: 0;
  position: relative;
  vertical-align: top;
  width: 20px;
}

.modal-close::before,
.delete::before,
.modal-close::after,
.delete::after {
  background-color: white;
  content: "";
  display: block;
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
  transform: translateX(-50%) translateY(-50%) rotate(45deg);
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.modal-close::before,
.delete::before {
  height: 2px;
  width: 50%;
}

.modal-close::after,
.delete::after {
  height: 50%;
  width: 2px;
}

.modal-close:hover,
.delete:hover,
.modal-close:focus,
.delete:focus {
  background-color: rgba(10, 10, 10, 0.3);
}

.modal-close:active,
.delete:active {
  background-color: rgba(10, 10, 10, 0.4);
}

.is-small.modal-close,
.is-small.delete {
  height: 16px;
  max-height: 16px;
  max-width: 16px;
  min-height: 16px;
  min-width: 16px;
  width: 16px;
}

.is-medium.modal-close,
.is-medium.delete {
  height: 24px;
  max-height: 24px;
  max-width: 24px;
  min-height: 24px;
  min-width: 24px;
  width: 24px;
}

.is-large.modal-close,
.is-large.delete {
  height: 32px;
  max-height: 32px;
  max-width: 32px;
  min-height: 32px;
  min-width: 32px;
  width: 32px;
}

.loader,
.control.is-loading::after,
.select.is-loading::after,
.button.is-loading::after {
  -webkit-animation: spinAround 500ms infinite linear;
  animation: spinAround 500ms infinite linear;
  border: 2px solid #dbdbdb;
  border-radius: 290486px;
  border-right-color: transparent;
  border-top-color: transparent;
  content: "";
  display: block;
  height: 1em;
  position: relative;
  width: 1em;
}

.hero-video,
.modal-background,
.modal,
.image.is-square img,
.image.is-square .has-ratio,
.image.is-1by1 img,
.image.is-1by1 .has-ratio,
.image.is-5by4 img,
.image.is-5by4 .has-ratio,
.image.is-4by3 img,
.image.is-4by3 .has-ratio,
.image.is-3by2 img,
.image.is-3by2 .has-ratio,
.image.is-5by3 img,
.image.is-5by3 .has-ratio,
.image.is-16by9 img,
.image.is-16by9 .has-ratio,
.image.is-2by1 img,
.image.is-2by1 .has-ratio,
.image.is-3by1 img,
.image.is-3by1 .has-ratio,
.image.is-4by5 img,
.image.is-4by5 .has-ratio,
.image.is-3by4 img,
.image.is-3by4 .has-ratio,
.image.is-2by3 img,
.image.is-2by3 .has-ratio,
.image.is-3by5 img,
.image.is-3by5 .has-ratio,
.image.is-9by16 img,
.image.is-9by16 .has-ratio,
.image.is-1by2 img,
.image.is-1by2 .has-ratio,
.image.is-1by3 img,
.image.is-1by3 .has-ratio,
.is-overlay {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.pagination-previous,
.pagination-next,
.pagination-link,
.pagination-ellipsis,
.file-cta,
.file-name,
.select select,
.input,
.textarea,
.button {
  -moz-appearance: none;
  -webkit-appearance: none;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 4px;
  box-shadow: none;
  display: inline-flex;
  font-size: 1rem;
  height: 2.25em;
  justify-content: flex-start;
  line-height: 1.5;
  padding-bottom: calc(0.375em - 1px);
  padding-left: calc(0.625em - 1px);
  padding-right: calc(0.625em - 1px);
  padding-top: calc(0.375em - 1px);
  position: relative;
  vertical-align: top;
}

.pagination-previous:focus,
.pagination-next:focus,
.pagination-link:focus,
.pagination-ellipsis:focus,
.file-cta:focus,
.file-name:focus,
.select select:focus,
.input:focus,
.textarea:focus,
.button:focus,
.is-focused.pagination-previous,
.is-focused.pagination-next,
.is-focused.pagination-link,
.is-focused.pagination-ellipsis,
.is-focused.file-cta,
.is-focused.file-name,
.select select.is-focused,
.is-focused.input,
.is-focused.textarea,
.is-focused.button,
.pagination-previous:active,
.pagination-next:active,
.pagination-link:active,
.pagination-ellipsis:active,
.file-cta:active,
.file-name:active,
.select select:active,
.input:active,
.textarea:active,
.button:active,
.is-active.pagination-previous,
.is-active.pagination-next,
.is-active.pagination-link,
.is-active.pagination-ellipsis,
.is-active.file-cta,
.is-active.file-name,
.select select.is-active,
.is-active.input,
.is-active.textarea,
.is-active.button {
  outline: 0;
}

[disabled].pagination-previous,
[disabled].pagination-next,
[disabled].pagination-link,
[disabled].pagination-ellipsis,
[disabled].file-cta,
[disabled].file-name,
.select select[disabled],
[disabled].input,
[disabled].textarea,
[disabled].button,
fieldset[disabled] .pagination-previous,
fieldset[disabled] .pagination-next,
fieldset[disabled] .pagination-link,
fieldset[disabled] .pagination-ellipsis,
fieldset[disabled] .file-cta,
fieldset[disabled] .file-name,
fieldset[disabled] .select select,
.select fieldset[disabled] select,
fieldset[disabled] .input,
fieldset[disabled] .textarea,
fieldset[disabled] .button {
  cursor: not-allowed;
}

/* minireset.css v0.0.4 | MIT License | github.com/jgthms/minireset.css */

html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}

ul,
li {
  list-style: none !important;
}

button,
input,
select,
textarea {
  margin: 0;
}

html {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

img,
embed,
iframe,
object,
video {
  height: auto;
  max-width: 100%;
}

audio {
  max-width: 100%;
}

iframe {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
  text-align: left;
}

html {
  background-color: white;
  font-size: 16px;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  min-width: 300px;
  width: 100%;
  overflow-x: hidden;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

article,
aside,
figure,
footer,
header,
hgroup,
section {
  display: block;
}

body,
button,
input,
select,
textarea {
  font-family: "Noto Sans KR";
}

code,
pre {
  -moz-osx-font-smoothing: auto;
  -webkit-font-smoothing: auto;
  font-family: monospace;
}

body {
  color: #4a4a4a;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
}

a {
  text-decoration: none;
  color: black;
  cursor: pointer;
}

/* header css */

header {
  background: #ffffff;
  height: 80px;
  width: 100%;
  position: fixed;
  border-bottom: 1px solid #cecece;
  top: 0;
  z-index: 12;
}

header > #fixedcon {
  padding: 20px;
  width: 100%;
  height: 60px;
}

.headerlogo {
  /* width: 160px; */
  height: 80px;
  display: flex;
  float: left;
  position: relative;
  padding-left: 60px;
}

.headerlogo > a {
  display: block;
  width: 160px;
  height: auto;
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
}

.headerlogo > a > img {
  width: 120px;
  /* position: absolute; */
  /* top: 50%;
  transform: translateY(-50%); */
}

.navcontainer {
  text-align: center;
  display: flex;
  justify-content: flex-end;
  margin-right: 60px;
}

.navmenu {
  display: grid;
  width: 160px;
  height: 80px;
  font-size: 18px;
  color: black;
  /* padding: 25px; */
  position: relative;
  line-height: 80px;
}

.navmenu:hover > a {
  color: #2806b8;
}

.navmenu > a {
  width: 160px;
  display: block;
  height: 80px;
  font-weight: 500;
}

.navmenu > ul {
  position: absolute;
  top: 65px;
  display: none;
  height: auto;
  width: auto;
  line-height: 40px;
  background: white;
  border: 1px solid #dddddd;
  border-radius: 5px;
  overflow: hidden;
}

.navmenu > ul > li {
  text-align: center;
  width: 160px;
}

.navmenu ul > li > a {
  display: block;
  font-size: 16px;
}

.navmenu ul > li > a:hover {
  background-color: #2806b8;
  font-weight: 500;
  color: #fff;
}

.navmenu:hover ul {
  display: inline-block;
}

/*footer css*/

footer {
  background-color: #ffffff;
  justify-content: center;
  width: 100%;
  padding-bottom: 40px;
  margin: 0 auto;
  border-top: 1px solid black;
}
/* 
.tab_menu{position:relative;}
.tab_menu .list{overflow:hidden;}
.tab_menu .list li{float:left; margin-right:14px; width: 200px;height: 100px;background-color: green;text-align: center;line-height: 100px;border-radius: 20px;}
.tab_menu .list .btn{font-size:25px; color: white;} */

/* 
.new-container {
  width: 100%;
  max-width: 1300px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans KR";
  margin-left: auto;
  margin-right: auto;
  flex-direction: column;
}

.new-container > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.new-container > .new-content {
  width: 100%;
  max-width: 1200px;
  flex-flow: column;
  text-align: center;
}

.content-wrap {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  /* display: grid; */
  /* width: 1200px;
  height: auto;
  margin: 50px auto;
  display: grid;
  color: black;
  justify-content: center; 
}*/

/* .new-content > b {
  font-size: 30px;
  line-height: 40px;
  font-weight: 500;
}

.new-content > b > span {
  font-size: 32px;
  line-height: 40px;
  font-weight: 600;
  color: #18604a;
}

.new-content > p {
  font-size: 20px;
  margin: 60px 20px;
} */
table {
  border-collapse: collapse;
  border: 1px solid black;
}

th, td {
  text-align: center;
  border: 1px solid black;
}


.gray_empty {
  background: #F2F2F2;
}

.pay {
  width: 130px;
  height: 35px;
  margin: 5px auto 0;
  background-color: #dbe9d7;
  text-align: center;
  border-radius: 20px;
  transition: background-color 0.3s;
  border: #4d8f37 2px solid;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pay>a{
  color: #006b3d;
}
.bigbig {
  font-size: 26px;
  text-align: center;
  color: #006b3d;
  padding-top: 10px;
  padding-bottom: 5px;
}
.m {
  margin-bottom: 20px;
  margin-top: 10px;
  font-size: 30px;
}

.tab_menu {
  position: relative;
  margin-bottom: 80px;
}

.tab_menu .list {
  overflow: hidden;
  align-items: center;
  justify-content: center;
  display: flex;
  margin-bottom: 80px;
  gap: 30px;
}

.tab_menu .list li {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 10px;
}

.tab_menu .list .btn {
  width: 130px;
  height: 80px;
  background-color:#f2f2f2;
  text-align: center;
  border-radius: 12px;
  transition: background-color 0.3s;
  font-size: 22px;
  color: #ffffff;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tab_menu .list li.is_on .btn {
  background: #006b3d;
  border: 2px solid #4D8F37;
}
.tab_menu .list li:not(.is_on) .btn {
  color: #c3c3c3;
}
.discount_box.hidden {
  visibility: hidden;
}
.discount_box {
  color: #afafaf;
  padding: 5px 10px;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  width: 130px;
  height: 30px;
  line-height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tab_menu .cont_area .cont {
  display: none;
}

.tab_menu .cont_area .cont.show {
  display: block;
}
.finish{
  font-size: 12px;
  height: 18px;
}
.new-footer {
  width: 1200px;
  margin: auto;
}

.new-price-table-area {
  /* padding: 0 20px; */
}
.new-price-table {
  font-family: 'Pretendard SemiBold';
  min-width: 1000px;
  margin: 0 auto;
}
.new-price-table td, .new-price-table th {
  border-color: #BFBFBF;
  height: auto;
  padding: 20px 0;
}

.new-price-table .Border_Box_green td {
  position: relative;
  padding: 0;
  height: 70px;
}

.new-price-table-area .gray-content {
  padding: 8px;
  width: 1000px;
}
.new-price-table-area .gray-content p {
  color: #BFBFBF;
  font-size: 12px;
  height: 16px;
  text-align: start;
  margin: 0;
  margin-bottom: 0;
}

/* .new-price-table .Border_Box_green td {
  border-right: 1px solid white;
  border-left: 1px solid white;
  text-align: center;
  padding: 10px;
  color: green;
  font-size: 30px;
  font-weight: bold;
} */

.new-price-table #green_bg {
  left: -10px;
  top: -1px;
  width: calc(100% + 20px);
  height: calc(100% + 2px);
  position: absolute;
  border: #006b3d 2px solid;
  background: #fff;
  color: #006b3d;
  border-radius: 10px;
  text-align: center;
  white-space: nowrap;
  font-size: 20px;
  display: grid;
  grid-template-columns: 1fr 199.75px 199.75px 199.75px 199.75px;
  align-items: center;
  padding-right: 8px;
}
.new-price-table .green_bg {
  position: relative;
  width: 100%;
  height: 100%;
}
.new-price-table .green_bg_tab {
  position: absolute;
  width: calc(100% + 10px);
  height: calc(100% + 4px);
  left: -2px;
  top: -2px;
  background: #006b3d;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  flex-direction: column;
}

.new-price-table .left_text {
  position: relative;
  text-align: left;
  width: 100;
  padding: 10px;
  color: #fff;
  background: #F2F2F2;
  color: #4a4a4a;
}

.new-price-table .line_space {
  text-decoration-line: line-through;
  color: #a6a6a6;
  font-size: 20px;
}

.new-price-table .qu {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-color: #BFBFBF;
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  cursor: pointer;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.new-price-table .texttip {
  display: none;
  position: absolute;
  top: 50%;
  left: calc(100% + 20px);
  transform: translateY(-50%);
  background-color: #333;
  color: white;
  border-radius: 5px;
  z-index: 20;
  width: 280px;
  height: 60px;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  padding: 0 20px;
  word-wrap: break-word;
  text-align: center;
  line-height: 16px;
}

.new-price-table .texttip p {
  font-size: 12px;
  margin: 0;
  line-height: 100px;
}

.new-price-table .texttip::after {
  content: "";
  position: absolute;
  border-top: 6px solid transparent;
  border-right: 6px solid #333;
  border-bottom: 6px solid transparent;
  border-left: 6px solid transparent;
  top: 50%;
  right: 100%;
  transform: translateY(-50%);
}

.new-price-table .texttip.show {
  display: flex;
}

.fc_texttip{
  display: none;
  position: absolute;
  top: -20px;
  left:-80px;
  transform: translateY(-50%);
  background-color: #333;
  color: white;
  padding: 5px;
  border-radius: 5px;
  z-index: 20;
  width: 350px;
  height: 70px;
  text-align: center;
}
.fc_texttip p {
  font-size: 10px;
  margin: 0;
}
.fc_texttip::after {
  content: "";
  position: absolute;
  border-top: 6px solid #333;
  border-right: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 6px solid transparent;
  bottom: -10px;
  right: 15%; 
  transform: translateX(-50%); 
}
.hide {
  display: none;
}
.show {
  display: inline-block;
}


.footer-top {
  margin-left: 0;
  padding-top: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid lightgray;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-use-select: none;
  user-select: none;
}

.footer-title {
  color: #4a4a4a;
  padding-left: 20px;
}

.footer-bottom {
  width: 100%;
  padding-top: 35px;
}

.footer-top span:nth-child(1) a {
  color: #2806b8;
  font-weight: bold;
}

.footer-logo {
  margin-left: 0;
  margin-top: 6px;
  margin-bottom: 15px;
  width: 200px;
  height: 40px;
  display: flex;
  align-items: center;
}

.footer-text {
  font-size: 14px;
  margin-right: 0;
  margin-left: 0;
  flex-flow: column;
  color: #757575;
}

.footer-text > div {
  margin-left: 0;
  margin-bottom: 10px;
}

.footer-text > div > span {
  margin-bottom: 6px;
}

.footer-text > div:last-child {
  color: #aaa;
}

/*footer 모바일*/

footer {
  background-color: #ffffff;
  justify-content: center;
  width: 100%;
  padding-bottom: 40px;
  margin: 0 auto;
  border-top: 1px solid black;
}

/* .new-container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans KR";
  margin-left: auto;
  margin-right: auto;
}

.new-container > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: auto;
  margin-right: auto;
} */
.new-footer-m {
  width: 100%;
  margin: auto;
}

.footer-top {
  margin-left: 0;
  padding-top: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid lightgray;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-use-select: none;
  user-select: none;
}

.footer-title {
  color: #4a4a4a;
  padding-left: 20px;
}

.footer-bottom {
  width: 100%;
  padding-top: 35px;
  padding: 10px;
}

.footer-logo {
  margin-left: 0;
  margin-top: 6px;
  margin-bottom: 15px;
  width: 180px;
  height: 40px;
}

.footer-text {
  font-size: 14px;
  margin-right: 0;
  margin-left: 0;
  flex-flow: column;
  color: #757575;
}

.footer-text > div {
  margin-left: 0;
  margin-bottom: 10px;
}

.footer-text > div > span {
  margin-bottom: 6px;
}

.footer-text > div:last-child {
  color: #aaa;
}

/*footer 모바일 끝*/

body > .container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans KR";
  margin-left: auto;
  margin-right: auto;
  line-height: 24px;
  margin-top: 80px;
  justify-content: center;
  /* overflow-x: hidden;
  overflow-y: visible; */
  flex-direction: column;
  align-items: center;
}

.new-slide {
  height: 550px;
  overflow: hidden;
  float: left;
  color: #333;
}

.mainslide {
  width: 100%;
  height: 550px;
  display: flex;
  flex-wrap: nowrap;
  overflow: hidden;
  position: relative;
  align-items: center;
  justify-content: center;
}

.swipercontainer {
  width: 1400px;
  position: relative;
}

.material-icons {
  font-size: 60px;
  width: 50px;
  height: 50px;
  color: rgba(0, 0, 0, 0.7);
  position: absolute;
  display: contents;
  user-select: none;
  border-radius: 100%;
  -webkit-user-drag: none;
  -webkit-user-select: none;
}

.business {
  margin-top: 50px;
  width: 1300px;
  position: relative;
  text-align: center;
}

.title {
  font-size: 60px;
  font-weight: bold;
  color: #000000;
  width: 100%;
  text-align: center;
}

.busi-sub {
  font-size: 20px;
  color: #18604a;
  text-align: left;
  padding: 0px 10px;
}

.busi-con {
  display: flex;
  flex-flow: column;
  justify-content: center;
}

.busi-con > p {
  text-align: left;
  padding: 0px 10px;
}

.business-container {
  margin-top: 30px;
  height: auto;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-row-gap: 20px;
  grid-column-gap: 20px;
}

.business-item {
  position: relative;
  width: 100%;
  max-width: 500px;
  height: auto;
  overflow: hidden;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  z-index: 2;
}
.busi-inner {
  position: absolute;
  font-size: 110px;
  line-height: 110px;
  text-align: right;
  right: -160px;
  top: 484px;
  font-weight: bold;
  color: whitesmoke;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  z-index: 1;
}

.bitem-text {
  position: absolute;
  color: white;
  font-size: 22px;
  z-index: 1;
  left: 25px;
  bottom: 25px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-use-select: none;
  user-select: none;
  font-weight: bold;
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.7);
  border-radius: 5px;
}

.business-item:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.business-item > img {
  width: 100%;
  height: 100%;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-filter: brightness(0.7);
  filter: brightness(0.7);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.business-item:hover img {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  -webkit-filter: brightness(1);
  filter: brightness(1);
  transition: 0.3s ease-in-out;
}

.business-m {
  margin-top: 50px;
  width: 100%;
  position: relative;
  text-align: center;
}

.title-m {
  font-size: 40px;
  font-weight: bold;
  color: #000000;
  width: 100%;
  text-align: center;
}

.busi-sub-m {
  font-size: 20px;
  color: #18604a;
  text-align: left;
  padding: 0px 10px;
}

.busi-con-m {
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
}

.busi-con-m > p {
  text-align: left;
  padding: 0px 10px;
  text-align: center;
}

.business-container-m {
  margin-top: 30px;
  height: auto;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 10px;
}

.business-item-m {
  position: relative;
  width: 100%;
  padding: 10px;
  height: auto;
  overflow: hidden;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
  z-index: 2;
}
.busi-inner-m {
  position: absolute;
  font-size: 30px;
  line-height: 30px;
  text-align: right;
  right: 20px;
  bottom: 41px;
  font-weight: bold;
  color: gray;
  opacity: 0.5;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  z-index: 3;
}

.bitem-text-m {
  position: absolute;
  color: white;
  font-size: 14px;
  z-index: 1;
  left: 30px;
  bottom: 20px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-use-select: none;
  user-select: none;
  text-shadow: 0 0 4px rgb(0 0 0 / 70%);
  border-radius: 5px;
}

.business-item-m:hover {
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.business-item-m > img {
  width: 100%;
  height: 100%;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-filter: brightness(0.7);
  filter: brightness(0.7);
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}

.business-item-m:hover img {
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-filter: brightness(1);
  filter: brightness(1);
  transition: 0.3s ease-in-out;
}

.sns {
  background: #333;
  width: 100%;
  height: 10px;
  margin-top: 100px;
}

.side {
  margin: 0 10px;
  color: #757575;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  user-select: none;
}

/* .sns-wrap {
    margin: auto;
    padding:17px;
    width:324px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 30px;
  }

  .sns-item {
    width:50px;
    height:50px;
  }

  .sns-item>img {
    width:50px;
    height:50px;
    border-radius: 5px;
  } */

.sns-wrap {
  width: 50px;
  height: auto;
  position: fixed;
  display: flex;
  flex-flow: column;
  bottom: 80px;
  right: 50px;
  z-index: 10;
  background: rgba(0, 0, 0, 0.7);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22), 0 10px 10px rgba(0, 0, 0, 0.22);
  border-radius: 5px;
}

.sns-hide {
  width: 50px;
  height: 50px;
  overflow: hidden;
  cursor: pointer;
  transition: 0.3s ease-in-out;
  -webkit-transition: 0.3s ease-in-out;
}

.sns-btn {
  width: 40px;
  height: 40px;
  margin: 5px;
}

.sns-hide:hover {
  height: 230px;
}

.sns-hide:hover .sns-btn {
  display: none;
}

.sns-hide:hover .sns-item {
  display: block;
}

.sns-item {
  display: none;
  width: 40px;
  height: 40px;
  margin: 5px;
  border-radius: 10px;
}

.sns-item > a,
.sns-item > a > img {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}

.support {
  max-width: 1100px;
  /* height: 530px; */
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin: 80px auto;
}

.support-item {
  display: block;
  height: 200px;
  padding: 50px;
  box-shadow: 7px 7px 10px 1px rgba(153, 153, 153, 0.1);
  background: #fff;
  align-items: center;
  border-radius: 20px;
}

.support-text {
  /* width: 440px; */
  /* height: 85%; */
  margin: auto;
  /* margin-top: 50px; */
  position: relative;
}

.spt-back {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(/images/main/notice.png) no-repeat bottom right / 20%;
  filter: grayscale(100%) brightness(100%);
  opacity: 0.4;
}

.support-item:nth-child(2) .spt-back {
  background-image: url(/images/main/contact.png);
}

.support-item:nth-child(4) .spt-back {
  background-image: url(/images/main/news.png);
}

.support-text2 {
  width: 100%;
  height: auto;
}

.support-text > p {
  width: 440px;
  height: auto;
  margin-top: 30px;
}

.spti {
  position: relative;
}

.spti > p {
  height: 50px;
  margin-top: 20px;
  font-size: 17px;
  color: #222;
}

.spti > .spi {
  justify-content: center;
  position: absolute;
  right: 0;
  bottom: 0;
}

/* .spi2 {
  width: 100px;
  height: 100px;
  display: block;
  position: absolute;
  right: 30px;
} */
/* 
.spi2 > img {
  width: 100px;
  height: 100px;
} */

.spi > img {
  width: 100px;
  height: 100px;
  filter: opacity(0.1) drop-shadow(0 0 0 #01236b) grayscale(0.5);
}

.sptitle {
  font-size: 24px;
  font-weight: bold;
  color: #01236b;
}
.support-item > .sptitle {
  /* padding: 20px; */
}

.support-text2 > .catal-con {
  display: flex;
}

.catal-item {
  width: 159px;
  height: 165px;
  display: inline-flex;
  flex-flow: column;
  align-items: center;
  text-align: center;
  justify-content: center;
}

.catal-text {
  font-weight: bold;
}

.catal-item:nth-of-type(3) {
  border-left: 1px solid gray;
  border-right: 1px solid gray;
}

.catal-img {
  width: 70px;
  height: 70px;
  margin-top: 10px;
}

/*모바일 카탈로그 시작*/
@media (max-width: 1023px) {
  .support-m {
    width: 85%;
    height: auto;
    display: flex;
    margin: 40px auto;
  }

  .support-item-m {
    margin: 0 auto;
    box-shadow: 7px 7px 15px 3px gray;
    width: 30%;
    height: auto;
    background: #f7f7f7;
    align-items: center;
    padding: 15px;
  }

  .support-item-m:nth-of-type(2) {
    margin: 0 15px;
  }

  .support-item2-m {
    margin: 0 auto;
    box-shadow: 7px 7px 15px 3px gray;
    width: 85%;
    height: auto;
    background: #f7f7f7;
    align-items: center;
    padding: 15px;
    margin-bottom: 50px;
  }

  .support-text-m {
    width: 100%;
    height: auto;
    margin: auto;
    position: relative;
  }

  .support-text2-m {
    width: 100%;
    height: auto;
  }

  .support-text-m > p {
    width: 440px;
    height: auto;
    margin-top: 30px;
  }

  .spti-m {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .spti-m > p {
    display: flex;
    padding-top: 30px;
    font-size: 17px;
    padding-right: 20px;
  }

  .spti-m > .spi-m {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
  }

  .spi2-m {
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
  }

  .spi2-m > img {
    width: 40px;
    height: 40px;
  }

  .spi-m > img {
    width: 40px;
    height: 40px;
  }

  .sptitle-m {
    font-size: 16px;
    text-align: center;
  }

  .sptitle2-m {
    font-size: 20px;
    text-align: center;
  }
  .support-item-m > .sptitle-m {
    padding: 20px;
  }

  .support-text2-m > .catal-con-m {
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin-top: 10px;
  }

  .catal-item-m {
    width: 30%;
    height: auto;
    display: inline-flex;
    flex-flow: column;
    align-items: center;
    text-align: center;
    justify-content: center;
  }

  .catal-text-m {
    font-size: 12px;
    text-align: center;
    line-height: 15px;
    margin-bottom: 5px;
  }

  .catal-item-m:nth-of-type(2) {
    border-left: 1px solid gray;
    border-right: 1px solid gray;
  }

  .catal-img-m {
    width: 50px;
  }
}

/*모바일 카탈로그 끝*/

.mainimg, .footerimg {
  position: relative;
  width: 100%;
  height: 300px;
  overflow: hidden;
}

.mainimg:hover img {
  transform: scale(1.1);
}

.mainimg > img, .footerimg > img {
  position: absolute;
  height: auto;
  width: 100%;
  height: 100%;
  margin: auto;
  text-align: center;
  display: flex;
  justify-content: center;
  transition: 0.2s ease-in-out;
  -webkit-transition: 0.2s ease-in-out;
  object-fit: cover;
}

.maintext {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: auto;
  display: grid;
  align-content: center;
  justify-items: center;
  background: rgba(0, 0, 0, 0.3);
  color: #ffffff;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}
.maintext-white {
  background: rgba(255, 255, 255, 0.7);
  color: #000;
}
.maintext > .main-title {
  font-size: 60px;
  font-weight: bold;
  line-height: 65px;
}
.maintext-white > .main-title {
  font-size: 40px;
  font-weight: bold;
  line-height: 45px;
}
.maintext > .main-sub-title {
  font-size: 30px;
  font-weight: bold;
  line-height: 35px;
}
.color-bar {
  width: 30px;
  height: 4px;
  background: #006b3d;
}
.color-bar.white {
  background: #fff;
}
.color-title {
  color: #006b3d;
  font-size: 24px;
  margin: 20px 0;
}
.maintext > .main-button {
  cursor: pointer;
  padding: 8px 30px;
  background: #006b3d;
  color: #fff;
  font-size: 18px;
  border-radius: 30px;
  margin-top: 20px;
  border: none;
  width: auto;
}
.maintext > .main-button:hover {
  background: #4D8F37;
}

.maintext > .sub-title {
  margin-top: 10px;
  font-size: 16px;
}

.contentmenu {
  position: relative;
  width: 100%;
  height: 70px;
  border-bottom: 1px solid lightgray;
}

.pagemenu {
  width: 820px;
  height: 70px;
  display: flex;
  margin: auto;
  padding: 20px;
  justify-content: space-between;
  user-select: none;
  -webkit-user-select: none;
}

.pagemenu > li {
  color: black;
  width: auto;
  max-width: 150px;
  height: 35px;
  font-weight: bold;
  margin: auto;
  text-align: center;
  cursor: pointer;
  -webkit-transition: 0.1s ease-in-out;
  transition: 0.1s ease-in-out;
}

.pagemenu > li:hover {
  color: #18604a;
}
.pagemenu > li:hover a {
  color: #18604a;
}

.pagemenu > p {
  color: gray;
}

.pagemenu > li.active {
  color: #18604a !important;
}
.pagemenu > li.active > a {
  color: #18604a !important;
}

.pagemenu > li.active::after {
  content: "";
  display: block;
  width: 30px;
  border-bottom: 4px solid #18604a;
  margin: 5px auto;
}

.content {
  width: 100%;
  height: auto;
}

.pagetext {
  width: 100%;
  height: auto;
  margin: 50px auto;
  /* display: grid;
  align-content: center;
  justify-items: center; */
  color: black;
}

.pagetext > .pagetitle {
  font-size: 18px;
  font-weight: 600;
  margin: 0 auto;
  margin-bottom: 10px;
  text-align: center;
}

.pagetext > .pagesub {
  margin-top: 10px;
  margin-bottom: 50px;
  font-size: 16px;
  color: gray;
}

.aboutsub {
  font-size: 30px;
  color: #18604a;
  margin-bottom: 30px;
  font-weight: bold;
}

.about-content {
  width: 1000px;
  margin-top: 40px;
}
.about-content > p {
  font-size: 20px;
  text-align: start;
  margin-top: 40px;
}

.ceo {
  margin-top: 40px;
  text-align: right;
  font-size: 22px;
}

.ceoname {
  font-style: oblique;
}

.mapcontainer {
  width: 100%;
}

.location-content {
  margin: 30px;
}

.location-title {
  font-weight: bold;
  font-size: 24px;
  padding-bottom: 10px;
}

.customerlogo {
  width: 1140px;
  height: auto;
  display: grid;
  margin: auto;
  margin-bottom: 100px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-column-gap: 20px;
  grid-row-gap: 20px;
}

.cusitem {
  width: 270px;
  height: 90px;
  border: 1px solid lightgray;
  box-shadow: 0 0 1px gray;
  -webkit-user-select: none;
  user-select: none;
  text-align: center;
}

.cusitem::after {
  display: inline-block;
  height: 100%;
  content: "";
  vertical-align: middle;
}

.cusitem > img {
  width: auto;
  height: auto;
  max-width: 250px;
  max-height: 70px;
  vertical-align: middle;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

.pageico {
  width: 120px;
  height: auto;
  margin: 0 auto;
  text-align: center;
  /* margin-bottom: 20px; */
}

.pagebox {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  width: 1200px;
  height: 630px;
  margin: 50px auto;
  overflow: hidden;
}

.primx-item {
  width: 900px;
  background: white;
  box-shadow: 0 0 15px gray;
  padding: 30px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 70px;
  text-align: center;
}
.primx-iscele {
  font-size: 30px;
  color: #18604a;
}

.primx-itext {
  font-size: 20px;
  color: black;
  text-align: center;
  line-height: 40px;
}

.primx-ex {
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
}

.primx-ext {
  width: 100%;
  padding: 30px 0;
  margin-left: 0;
}
.primx-exi {
  width: 100%;
  margin-bottom: 50px;
}

.primx-benefit {
  width: 1200px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  justify-items: center;
}

.primx-be {
  width: 400px;
  box-shadow: 0 0 15px gray;
  height: 350px;
}

.primx-be > img {
  height: 350px;
  width: 100%;
}

.primx-ne {
  width: 700px;
  background: white;
  box-shadow: 0 0 15px gray;
  padding: 30px;
  text-align: center;
}

.primx-ntext {
  font-size: 18px;
  color: black;
  text-align: center;
  line-height: 30px;
}

.sol-container {
  width: 1200px;
  height: auto;
  margin: 50px auto;
  display: grid;
  color: black;
  justify-content: center;
}
.hpe-container {
  width: 1200px;
  height: auto;
  margin: 50px auto;
  display: grid;
  color: white;
  background-color: black;
  justify-content: center;
}

.primx-container {
  width: 100%;
  height: auto;
  margin: 50px auto;
  display: grid;
  color: black;
}

.xlog-container {
  width: 100%;
  height: auto;
  margin: 50px auto;
  display: grid;
  color: black;
}

.sol-title {
  text-align: center;
  font-size: 34px;
  margin-top: 50px;
  font-weight: bold;
}

.sol-title::after {
  content: "";
  display: block;
  width: 400px;
  border-bottom: 1px solid gray;
  margin: 30px auto;
}
.sol-title2 {
  text-align: center;
  font-size: 34px;
  margin-top: 50px;
  font-weight: bold;
}

.sol-title2 > img {
  width: 200px;
}

.sol-title2::after {
  content: "";
  display: block;
  width: 400px;
  border-bottom: 1px solid gray;
  margin: 10px auto;
}

.sol-container > .sol-sub {
  border-left: 4px solid #18604a;
  font-size: 20px;
  height: 30px;
  text-align: left;
  margin-top: 50px;
  margin-bottom: 30px;
}

.sol-subtext {
  padding: 3px;
  font-weight: bold;
}

.sol-con {
  width: 1200px;
  margin: 0 auto;
}

.sol-con > .sol-sub2 {
  border-left: 4px solid #18604a;
  font-size: 24px;
  height: 34px;
  text-align: left;
  margin-top: 50px;
  margin-bottom: 30px;
}

.sol-subtext2 {
  padding: 4px 6px;
}

.sol-item {
  width: auto;
  max-width: 1000px;
  height: auto;
  margin: 0 auto;
  font-size: 30px;
  color: black;
}

.sol-item > img {
  width: 1000px;
  height: auto;
}

.sol-item > .sol-text {
  display: flex;
  margin-bottom: 30px;
  font-size: 24px;
}
.imp-item {
  width: 90%;
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
  font-size: 30px;
  color: white;
  display: flex;
  justify-content: center;
}

.imp-item > img {
  width: 100%;
  max-width: 1200px;
  height: auto;
}

.imp-item > .imp-text {
  display: flex;
  width: 100%;
  height: 100%;
}
.imp-dot {
  font-weight: 100;
  font-size: 10px;
  color: #068ddd;
  margin-right: 15px;
}
.imp-img {
  height: 25%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.imp-text > p {
  display: flow-root;
  color: black;
  font-size: 20px;
  line-height: 30px;
}
.imp-text > .imp-textsub {
  color: black;
}
.imp-text > .imp-textsub > p {
  font-size: 16px;
  display: flex;
  line-height: 30px;
  margin-left: 5%;
}
.imp-subdot {
  color: gray;
  font-size: 30px;
  margin-right: 15px;
}
.imp-2item {
  width: 100%;
  height: 100%;
  display: flex;
}
.imp-left {
  padding-right: 3%;
}
.imp-right {
  padding-left: 3%;
}
.imp-2item > div > .imp-img > img {
  width: 200px;
}
.imp-left {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.imp-right {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.imp-2img {
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.img-back {
  z-index: 1;
  position: absolute;
  width: 90%;
  height: auto;
  padding-bottom: 10%;
}
.img-front {
  z-index: 2;
  position: absolute;
  width: 90%;
  right: 0;
  padding-top: 10%;
  height: auto;
}
.imp-rightmid {
  width: 450px;
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #068ddd;
  padding: 1%;
  flex-direction: column;
}
.imp-midtext {
  width: 100%;
  line-height: 30px;
  color: white;
  font-size: 22px;
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 25%;
}
.imp-middot {
  font-weight: 100;
  font-size: 1px;
  color: white;
  margin: 3%;
}

.imp-3item {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  justify-content: space-around;
  justify-items: center;
  align-items: center;
  background-color: whitesmoke;
  padding: 3%;
  margin-bottom: 30px;
}
.imp-icot {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.imp-icot > img {
  width: 40%;
  height: auto;
  margin-bottom: 10px;
}
.imp-icot > .imp-t {
  text-align: center;
  display: flex;
  color: black;
  flex-direction: column;
  font-size: 18px;
  width: 82%;
  line-height: 24px;
}

.imp-textcon {
  display: block;
}
.imp-druid {
  color: black;
  font-weight: bold;
  font-size: 18px;
}
.imp-druidsub {
  color: black;
  font-size: 15px;
  display: flex;
}

.druid {
  color: #0a8fdd !important;
  font-weight: bold;
}

.imp-lr {
  width: 100%;
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
  font-size: 30px;
  color: white;
  display: flex;
  justify-content: center;
}

.imp-left2 {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.imp-right2 {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.imp-righttext {
  color: black;
  font-size: 18px;
  display: flex;
  margin-left: 10%;
  line-height: 50px;
}

.imp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 1%;
}
.imp-griditem {
  width: 100%;
  height: 100%;
}
.imp-griditem > img {
  width: 100%;
  height: auto;
}
.imp-gridtext {
  width: 100%;
  height: 25%;
  text-align: center;
  display: flex;
  color: #89929d;
  font-weight: bold;
  font-size: 20px;
  align-items: center;
  justify-content: center;
}

.hpe-item {
  width: 90%;
  max-width: 1200px;
  height: auto;
  margin: 0 auto;
  font-size: 30px;
  color: white;
  display: flex;
  justify-content: center;
}

.hpe-item > img {
  width: 100%;
  max-width: 1200px;
  height: auto;
}

.hpe-item > .hpe-text {
  display: flex;
  margin-bottom: 30px;
  font-size: 24px;
}

.hpe-products {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hp-con {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  margin-bottom: 20px;
}
.hp-big {
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
}

.hp-proleft {
  width: 18%;
  text-align: center;
  font-size: 20px;
  display: flex;
  align-items: center;
  color: white;
}

.hp-procenter {
  width: 2%;
  height: 230px;
  border-left: 2px solid #06b688;
  border-top: 2px solid #06b688;
  border-bottom: 2px solid #06b688;
}

.hp-procenter::before {
  content: "";
  width: 100%;
  height: 51%;
  border-bottom: 2px solid #06b688;
  display: flex;
  margin-left: -20px;
  justify-content: flex-start;
  align-items: center;
}

.hp-proright {
  width: 80%;
  display: flex;
  flex-direction: row;
}

.hp-conleft {
  display: flex;
  flex-direction: column;
  width: 25%;
  height: 100%;
  margin-right: 2.5%;
  margin-left: 2.5%;
}

.hp-conleft > div {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.hp-leftcontop {
  height: 35%;
  width: 100%;
  background: none;
  font-size: 16px;
  color: white;
}

.hp-leftconbottom {
  height: 65%;
  width: 100%;
  border: 3px solid #dd742d;
  background-color: gray;
  color: white;
  font-size: 18px;
  font-weight: bold;
  line-height: 30px;
}

.hp-conright {
  width: 70%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 3px solid #dd742d;
  background-color: white;
  color: black;
}

.hp-rightcontop {
  height: 35%;
  width: 100%;
  background: none;
  font-size: 24px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.hp-rightconbottom {
  height: 65%;
  width: 100%;
  font-size: 18px;
  font-weight: bold;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  line-height: 30px;
}

.hp-rightconbottomitem {
  width: 30%;
  height: 100%;
  display: flex;
  border: 3px solid #dd742d;
  align-items: center;
  justify-content: center;
}

.hp-bigcon {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding-left: 2.5%;
}

.hp-bigtop {
  height: 70%;
  margin-bottom: 1%;
  display: flex;
  width: 100%;
  border: 3px solid #dd742d;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}
.hp-bigtopleft {
  width: 45%;
  height: 100%;
  font-size: 16px;
  color: white;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hp-bigtopright {
  width: 55%;
  height: 100%;
  margin-right: 1%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.hp-bigtopright > div {
  background-color: gray;
  border: 3px solid #dd742d;
  color: white;
  font-size: 14px;
  text-align: start;
  line-height: 28px;
  display: flex;
  justify-content: center;
}

.hp-bigrighttop {
  height: 65%;
}

.hp-bigrightbottom {
  height: 25%;
}

.hp-bigbottom {
  height: 28%;
  width: 100%;
  border: 3px solid #dd742d;
  background-color: gray;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hp-bigbottomright {
  display: flex;
  flex-direction: row;
}

.hpe {
  color: #98bddf;
  font-size: 24px;
}

.hp-circlecon {
  width: 100%;
  max-width: 1200px;
  height: auto;
  display: flex;
  position: relative;
  align-items: center;
  justify-content: center;
  margin-bottom: 50px;
}
.hp-circle {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1;
}

.hp-circle > img {
  width: 300px;
  height: 300px;
}

.hp-4items {
  width: 100%;
  height: 400px;
  display: grid;
  gap: 18%;
  grid-template-columns: 1fr 1fr;
  z-index: 2;
  justify-content: space-around;
  justify-items: stretch;
}
.hp-4item {
  width: 100%;
  height: 100%;
  padding: 1%;
  background-color: white;
  color: black;
}

.hp-4itemtop {
  background-color: #0d5264;
  color: white;
  padding: 2%;
  width: 100%;
  height: 22%;
  font-size: 22px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hp-4itembottom {
  font-size: 14px;
  height: 78%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  line-height: 30px;
}

.hp-gridcon {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.hp-grid6 {
  width: 100%;
  height: 400px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 3% 1%;
}

.hp-griditem {
  background-color: #0d5264;
  color: white;
  border: 1px solid white;
}
.hp-griditemtop {
  height: 40%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.hp-gridico {
  width: 90px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hp-gridtitle {
  font-size: 20px;
}
.hp-griditembot {
  height: 60%;
  width: 100%;
  display: flex;
  font-size: 14px;
  padding: 3%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.hp-gridbot {
  margin-top: 15px;
  margin-bottom: 50px;
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: row;
  background-color: #d7d7d7;
  color: #4868a0;
  font-size: 16px;
  align-items: center;
  text-align: center;
  justify-content: center;
}

.hp-gridbot > .hp-gridico {
  height: 60px;
  width: 75px;
}

.hp-grid6-2 {
  width: 100%;
  height: 500px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 4% 2%;
  margin-bottom: 50px;
}

.hp-griditem2 {
  background-color: white;
  color: black;
  border: 1px solid #d7d7d7;
  padding: 1%;
}
.hp-griditem2top {
  background-color: #0d5264;
  color: white;
  font-size: 18px;
  text-align: center;
  display: flex;
  height: 15%;
  align-items: center;
  justify-content: center;
}

.hp-griditem2bot {
  font-size: 14px;
  text-align: center;
  padding: 2%;
}

.hpe-table {
  width: 100%;
  height: auto;
  color: black;
  margin-bottom: 50px;
}
.hpe-table > thead > tr > th:nth-of-type(1) {
  width: 32%;
  font-style: oblique;
}
.hpe-table > thead > tr > th:nth-of-type(2) {
  width: 36%;
}
.hpe-table > thead > tr > th:nth-of-type(3) {
  width: 32%;
}

.hpe-table > thead > tr > th {
  background-color: #bebebe;
  border: 1px solid #939393;
  font-size: 24px;
  text-align: center;
  padding: 10px;
}

.hpe-table > tbody > tr > td {
  background-color: #f1f1f1;
  border: 1px solid #939393;
  padding: 10px;
  font-size: 18px;
  text-align: center;
}

.hpe-table > tbody > tr > td:nth-of-type(1) {
  font-weight: bold;
}
.hpe-orange {
  color: #e57418;
  font-weight: bold;
}

.hpe-2item {
  width: 100%;
  display: flex;
  flex-direction: row;
  height: auto;
  gap: 2%;
  justify-content: space-around;
}

.hpe-2item > img {
  width: 49%;
  height: auto;
}

.enter-con {
  width: 100%;
  height: 500px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
}
.enter-circle {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 130px;
  height: 130px;
  border-radius: 100%;
  background-color: #c00000;
  line-height: 35px;
  z-index: 2;
}

.enter-circle::before {
  content: "";
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 200px;
  height: 200px;
  z-index: 1;
  background: none;
  border-radius: 100%;
  border: 5px solid #5d5d5d;
}
.enter-grid4 {
  display: grid;
  width: 100%;
  height: 100%;
  grid-template-columns: 1fr 1fr;
  justify-items: center;
  justify-content: space-around;
  align-content: space-around;
}

.enter-item {
  width: 75%;
  height: 200px;
  border: 1px solid #5d5d5d;
  display: flex;
  flex-direction: column;
}

.enter-title {
  width: 100%;
  height: 20%;
  font-size: 18px;
  background-color: #5d5d5d;
  color: white;
  font-weight: bold;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

.enter-body {
  width: 100%;
  height: 80%;
  color: #5d5d5d;
  font-size: 16px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 3%;
  background-color: white;
  z-index: 3;
  list-style-position: inside;
}
.enter-body > li {
  line-height: 30px;
  display: flex;
}
.enter-body > li > span {
  margin-right: 15px;
  font-size: 10px;
  font-weight: 100;
  color: #a01926;
}

.ops-con {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ops-img {
  width: 60%;
  margin-right: 10px;
  height: 100%;
}
.ops-img > img {
  height: 100%;
  width: 100%;
}
.ops-textcon {
  width: 40%;
  height: 100%;
  font-size: 16px;
  padding: 1%;
  line-height: 24px;
}
.ops-text {
  display: flex;
  width: 90%;
}
.ops-dot {
  font-size: 24px;
  font-weight: bold;
  width: 10%;
}

.kubercon {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kuberleft {
  height: 100%;
  width: 40%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.kuberright {
  width: 60%;
  height: 100%;
}

.kuberright > div > ul {
  font-size: 20px;
  font-weight: bold;
  line-height: 30px;
}
.kuberright > div > ul li {
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  margin: 2%;
}

.kubertop {
  height: 30%;
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
.kuberbox {
  width: 90%;
  font-size: 18px;
  text-align: center;
  height: 40%;
  display: flex;
  background-color: #897f75;
  align-items: center;
  justify-content: center;
}
.kuberbot {
  height: 70%;
  width: 100%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 5%;
}
.kuberbot > img {
  height: 50%;
  width: auto;
}

.sol-h {
  color: #18604a;
  font-weight: bold;
  white-space: nowrap;
}
.kong-h {
  color: #003459;
  font-size: 18px;
  font-weight: bold;
  white-space: nowrap;
}
.gl-sub {
  width: 100%;
  height: auto;
  padding: 40px 0;
}

.gl-maintext {
  font-size: 40px;
  font-weight: bold;
  width: 100%;
  height: auto;
  margin: auto;
  padding: 30px 0;
  text-align: center;
}

.gl-subtextcon {
  padding-bottom: 60px;
  max-width: 1000px;
}

.gl-subtext {
  width: 80%;
  height: auto;
  font-size: 30px;
  text-align: left;
  margin: auto;
  padding: 20px 0;
}
.gl-gtitle {
  font-weight: bold;
  font-size: 24px;
}

.gl-title {
  margin: auto;
  color: #4e2da1;
  font-size: 40px;
  height: auto;
  width: 100%;
  text-align: center;
  padding: 60px 0;
  font-weight: bold;
  line-height: 50px;
}
.kong-title {
  margin: auto;
  color: #003459;
  font-size: 40px;
  height: auto;
  width: 100%;
  text-align: center;
  padding: 60px 0;
  font-weight: bold;
  line-height: 50px;
}
.gl-2item {
  width: 86%;
  margin: auto;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: auto;
}
.gl-2item > div:nth-of-type(1) {
  width: 55%;
}
.gl-2item > div:nth-of-type(2) {
  width: 45%;
}

.gl-2item > div:nth-of-type(2) > img {
  width: 100%;
  height: 100%;
}

.gl-3grid {
  display: grid;
  height: 100%;
  grid-template-columns: 1fr;
  justify-items: center;
  justify-content: center;
  align-content: center;
  gap: 25%;
}

.gl-griditem {
  display: flex;
  height: 100%;
}

.gl-gimg {
  width: 20%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gl-gline {
  width: 15%;
  text-align: center;
}
.gl-gdot {
  width: 15%;
  text-align: center;
  font-size: 10px;
}
.gl-gsub {
  width: 85%;
}

.gl-gtcon {
  width: 80%;
  font-size: 20px;
}
.gl-gtext {
  display: flex;
}
.gl-tiertext {
  display: flex;
}
.gl-tiert {
  width: 100%;
  font-size: 14px;
  font-weight: bold;
}
.gl-tiertitle {
  font-size: 30px;
  width: 100%;
  height: 50px;
  text-align: center;
  display: flex;
  font-size: 20px;
  justify-content: center;
  align-items: center;
}

.gl-tieritem > .gl-tier1 {
  background: #fcb260;
}
.gl-tieritem > .gl-tier2 {
  background: #ffc381;
}
.gl-tieritem > .gl-tier3 {
  background: #fdd5a7;
}

.gl-tier {
  width: 86%;
  margin: auto;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
.gl-tiersub {
  padding: 3%;
}
.gl-tieritem {
  width: 32%;
}

.sol-last {
  font-size: 15px;
  width: 100%;
  margin: auto;
  padding: 100px 0 30px 0;
  line-height: 30px;
  color: black;
  text-align: center;
}

.q-title {
  width: 86%;
  max-width: 1000px;
  margin: auto;
  padding: 30px 7% 10px 0;
  line-height: 50px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.hpe-title {
  width: 90%;
  max-width: 1200px;
  margin: auto;
  padding: 30px 5% 10px 0;
  line-height: 50px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.imp-title {
  width: 90%;
  max-width: 1200px;
  margin: auto;
  padding: 30px 5% 10px 0;
  line-height: 50px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.sf-title {
  width: 90%;
  max-width: 1200px;
  margin: 50px auto 10px auto;
  padding: 0px 0px 5px 5px;
  line-height: 50px;
  font-size: 30px;
  display: flex;
  flex-direction: row;
  font-weight: bold;
  background-color: #99c0e7;
  justify-content: flex-start;
}
.sf-2con {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 2%;
}
.sf-con {
  width: 50%;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.sf-con > img {
  width: 100%;
  height: auto;
  display: flex;
}
.sf-orange {
  color: white;
  background-color: #e6751e;
  line-height: 40px;
  font-size: 22px;
  font-weight: bold;
  padding-left: 10px;
}

.sf-textcon {
  background-color: #e6f5fa;
  width: 100%;
  height: 100%;
  color: black;
  font-size: 16px;
  padding: 2%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  gap: 30px;
}

.sf-text {
  background-color: #e6f5fa;
  width: 100%;
  height: auto;
  color: black;
  font-size: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.sf-4con {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 2%;
  flex-direction: row;
}
.sf-6con {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 2%;
  flex-direction: column;
}

.sf-textb {
  font-weight: bold;
  font-size: 18px;
}
.sf-textb2 {
  font-weight: bold;
  font-size: 14px;
}

.sf-4text {
  background-color: #e6f5fa;
  width: 100%;
  height: 100%;
  color: black;
  font-size: 16px;
  padding: 2%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.sf-6text {
  background-color: #e6f5fa;
  width: 100%;
  height: 100%;
  color: black;
  font-size: 12px;
  line-height: 16px;
  padding: 1%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.ark-title {
  width: 86%;
  max-width: 1000px;
  margin: auto;
  padding: 30px 0% 10px 0;
  line-height: 50px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.q-sub {
  width: 86%;
  max-width: 1000px;
  margin: auto;
  padding: 0 7% 10px 0;
  line-height: 30px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.hp-sub {
  width: 90%;
  max-width: 1200px;
  margin: auto;
  padding: 0 0 30px 0;
  line-height: 30px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.hp-bigsub {
  width: 90%;
  max-width: 1200px;
  margin: auto;
  padding: 0 0 30px 0;
  line-height: 40px;
  font-size: 24px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.ark-sub {
  width: 86%;
  max-width: 1000px;
  margin: auto;
  padding: 0 3% 10px 0;
  line-height: 30px;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
}
.q-dot {
  width: 7%;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.ark-num {
  width: 3%;
  font-size: 15px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
.k-dot {
  width: 7%;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}
.q-mdot {
  width: 7%;
  font-size: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.q-titletext {
  width: 100%;
  font-size: 26px;
  font-weight: bold;
  text-decoration: underline;
}

.ark-titletext {
  width: 100%;
  font-size: 36px;
  font-weight: bold;
  text-decoration: none;
  margin-bottom: 30px;
}
.imp-titletext {
  width: 100%;
  font-size: 36px;
  font-weight: bold;
  text-decoration: none;
  color: #008adc;
  margin-bottom: 30px;
}
.hpe-titletext {
  width: 100%;
  font-size: 26px;
  font-weight: bold;
  text-decoration: none;
  margin-bottom: 30px;
}
.hpe-titletext::after {
  content: "";
  width: 85px;
  height: 4px;
  background-color: #06b688;
  display: flex;
  align-items: start;
}

.q-h {
}
.q-text {
  font-size: 18px;
  width: 100%;
}
.ark-text {
  font-size: 15px;
  width: 100%;
}
.ark-subtext {
  font-size: 15px;
  width: 100%;
  color: gray;
  padding-bottom: 20px;
}

.q-item {
  background: #27b6e2;
  z-index: 1;
  width: 32%;
  height: auto;
}
.q-icon {
  height: 30%;
  padding: 5% 36%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.q-icon > img {
  width: auto;
  height: 100%;
}
.q-itemtitle {
  text-align: center;
  font-weight: bold;
  font-size: 24px;
  color: black;
}
.q-itemcon {
  margin: 3%;
  padding: 3%;
  background: white;
  height: 59%;
}
.q-itemsub {
  display: flex;
  color: black;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 30px;
}

.q-itemdot {
  width: 10%;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.xlog-sub {
  width: 100%;
  text-align: center;
  font-size: 12px;
  line-height: 18px;
}

.xlog-image {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  padding: 10px 0;
}

.cdc-grid-text {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  padding: 20px 40px;
}
.cdc-grid-text > span {
  text-align: left;
  font-size: 0.85rem;
}

.htitems {
  width: 1200px;
  height: auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 0;
}

.htitems > .htitem {
  width: 585px;
  height: auto;
}

.htitem > .htimg {
  width: 585px;
  height: 100%;
  display: flex;
  justify-content: center;
}

.htitem > .htimg > img {
  width: 440px;
  height: 270px;
  margin: auto;
  display: flex;
}

/* .htitem:nth-child(1)::before {
  content: "";
  display: block;
  height: 100%;
  border-right: 4px solid #18604A;
} */

/* .htright {
  border-left: 10px solid #1d9a8c;
  border-block-start: orange;
  border-left-style:dotted;
  margin-right:2px;
} */

.htleft > .htyear {
  font-size: 40px;
  margin-bottom: 30px;
  text-align: end;
  padding: 0 50px;
}

.htright > .htyear {
  font-size: 40px;
  margin-bottom: 30px;
  text-align: start;
  padding: 0 50px;
}

.htmid {
  text-align: center;
  width: 30px;
  height: auto;
}

.httext {
  display: block;
  width: 450px;
  margin: auto;
}

.htmt {
  padding: 5px;
}

.htm {
  display: inline-block;
  width: 40px;
  height: auto;
}

.htt {
  display: inline-flex;
  font-size: 14px;
}

.bigdot {
  width: 30px;
  height: 30px;
  border: 3px solid orange;
  background: white;
  border-radius: 50%;
}

.smdot {
  width: 8px;
  height: auto;
  margin: auto;
  border-left: 8px solid #1d9a8c;
  border-left-style: dotted;
  margin-top: 7px;
  margin-bottom: 7px;
}

.contact-searchbar {
  margin-bottom: 20px;
}

.contact-post-top {
  font-size: 20px;
  display: flex;
  flex-direction: row;
  height: 40px;
  width: 100%;
}

.contact-post-top > .category {
  padding: 8px;
  display: inline-block;
  cursor: pointer;
}

.contact-post-top > .category > span:nth-child(2) {
  display: none;
}

.contact-post-top > .active2 > span:nth-child(2) {
  display: inline-block;
}

.contact-post-top > .active2 {
  color: #18604a;
}

.con-container {
  width: 1200px;
  height: auto;
  display: grid;
  align-content: center;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}

.table-header {
  width: 1200px;
  height: 40px;
  text-align: center;
  display: flex;
  align-items: center;
}

.table-body {
  width: 1200px;
  display: flex;
}

.search-box {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

#select-box {
  width: 95px;
  height: 40px;
  text-align: center;
  border-radius: 5px;
  display: none;
}

.submit-box {
  width: 240px;
  height: 40px;
  display: flex;
  border: 1px solid #626262;
  border-radius: 5px;
}

#search-submit {
  width: 40px;
  height: 38px;
  border: none;
  border-radius: 5px 0 0 5px;
  padding: 0;
  background: lightgray;
}

#search-submit > span > img {
  width: 100%;
  height: 100%;
  padding: 0;
}

#search-keyword {
  height: 38px;
  width: 200px;
  border: none;
  border-radius: 5px;
}
#search-keyword:focus {
  outline: none;
}

.table-header {
  display: flex;
}

.contact-post-middle {
  color: #333;
}

.contact-post-middle:first-child {
  border-top: 1px solid #dedede;
}

.contact-post-middle .table-header {
  background-color: #ececec;
  border-bottom: 1px solid #dedede;
  border-top: 1px solid #dedede;
}

.contact-post-middle .table-body {
  width: 100%;
  border-bottom: 1px solid #dedede;
}

.table-body > div > span {
  display: inline-block;
  text-align: center;
}

.contact-post-middle .table-body.answer {
  background-color: #f7f8f9;
}

.contact-post-middle .table-header .th,
.contact-post-middle .table-body .td {
  margin: 7px 0;
  width: 100%;
  max-width: 130px;
  font-size: 14px;
}

.contact-post-middle .table-header .th {
  text-align: center;
}

.contact-post-middle .table-header .th:last-child {
  border-right: 0;
}

.contact-post-middle .table-header span.small,
.contact-post-middle .table-body span.small {
  max-width: 100px;
}

.contact-post-middle .table-header span.big,
.contact-post-middle .table-body span.big {
  max-width: 760px;
}

.contact-post-middle .table-header span.medium,
.contact-post-middle .table-body span.medium {
  max-width: 140px;
}

.contact-post-middle .table-body > div {
  display: flex;
}

.contact-post-middle .table-body > div:first-child {
  width: 800px;
}

.contact-post-middle .table-body > div:last-child {
  width: 400px;
}

.contact-post-middle .table-body .td.center {
  padding-left: 0 !important;
  text-align: center !important;
}

.contact-post-middle a {
  color: #333;
}

.contact-post-bottom {
  margin-top: 45px;
  width: 100%;
  position: relative;
}
.contact-post-bottom .page-buttons {
  display: flex;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
}

.contact-form-bottom {
  height: 47px;
  margin: 30px 0;
  display: flex;
  position: relative;
  justify-content: center;
}

.form-buttons {
  width: 800px;
  height: 47px;
  display: flex;
  position: absolute;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  margin: auto;
  font-weight: bold;
}

.contact-post-bottom .page-buttons span {
  margin-right: 20px;
  cursor: pointer;
}

.contact-post-bottom .page-buttons a:last-child {
  margin-right: 0;
}

.page {
  width: 42px;
  height: 42px;
  display: flex;
  border-radius: 5px;
  color: black;
  background: #e7e7e7;
}

.page-buttons > .active2 {
  background: #2806b8;
  color: white;
}

.contact-post-bottom .page-buttons .page span {
  display: flex;
  margin: auto;
}

.apb {
  width: 100%;
  height: auto;
  border-radius: 5px;
  display: flex;
  right: 0;
  position: absolute;
}
.afb {
  /* width:100px; */
  height: 47px;
  overflow: hidden;
  border-radius: 5px;
  display: flex;
  right: 0;
  position: absolute;
  cursor: pointer;
}

.afbb {
  height: 47px;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}

/* .afbb:nth-of-type(1) {
  width: 60px;
} */

.afbb:nth-of-type(1) {
  margin-left: 10px;
  width: 100px;
}

.afbb > #cancel {
  width: 60px;
  height: 42px;
  border-radius: 5px;
  display: flex;
  position: absolute;
  background: #bc1f1f;
  color: white;
  box-shadow: 0px 5px 0px 0px #811616;
  transition: all 0.2s;
  left: 0;
}

.afbb > #submit {
  width: 100px;
  height: 42px;
  border-radius: 5px;
  display: flex;
  position: absolute;
  background: #2806b8;
  color: white;
  box-shadow: 0px 5px 0px 0px #0d3529;
  transition: all 0.2s;
  right: 0;
}

.form-button > span {
  display: inline-block;
  margin: auto;
}

.form-button:hover {
  margin-top: 5px;
}

a.add-post-button {
  width: 140px;
  height: 36px;
  border-radius: 5px;
  display: flex;
  position: absolute;
  background: #2806b8;
  color: white;
  right: 0;
}

.contact-post-bottom a.add-post-button > span {
  display: flex;
  margin: auto;
  font-size: 16px;
}

/* #page-prev, #page-next {
  width:42px;
  height:42px;
	display: flex;
  border-radius: 5px;
	color: black;
  background: #e7e7e7;
  align-items: center;
    justify-content: center;

} */

#page-prev,
#page-next {
  width: 42px;
  height: 42px;
  display: none;
  border-radius: 5px;
  color: black;
  background: #e7e7e7;
  align-items: center;
  justify-content: center;
}

.search-ico > .fa-search {
  width: 40px;
  height: 40px;
}

.fa-search::before {
  height: 100%;
  width: 100%;
  margin: auto;
  display: block;
  padding: 6px;
}

.contact-form-container {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contact-form {
  width: 800px;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
}

.contact-form {
  width: 800px;
  height: auto;
  padding: 50px 60px 50px 58px;
  font-size: 14px;
  border: 1px solid #cecece;
}

#category1,
#category2,
#name,
#email,
#phone,
#companyInfo {
  width: 260px;
  height: 42px;
}

.withico {
  display: flex;
  flex-flow: column;
}
.label > span > img {
  width: 16px;
  height: 16px;
}
.line {
  display: flex;
  margin-bottom: 16px;
  width: 600px;
  justify-content: space-around;
}

.size-1 #title,
#content {
  width: 560px;
}

#title {
  height: 42px;
}

.size-1 > #content {
  height: 200px;
}

.password {
  width: 560px;
  align-items: center;
}
.password > span {
  margin-left: 20px;
}

#password {
  width: 260px;
  height: 42px;
}

.tgt {
  width: 100%;
  display: block;
  text-align: center;
  margin: auto;
}

.toggletext > .aitoggle {
  display: block;
}

.toggletext > .bigtoggle {
  display: block;
}
.toggletext > .uwbtoggle {
  display: block;
}
.toggletext > .ecmtoggle {
  display: block;
}

.bigtoggle:first-child {
  margin-bottom: 100px;
}

.is-teal {
  color: #01867e !important;
}

.is-orange {
  color: #f6a438 !important;
}

.is-bold {
  font-weight: bold;
}

.is-aqua {
  color: #44afbe !important;
  font-weight: 700 !important;
}

.is-turq {
  color: #176a75 !important;
  font-weight: 700 !important;
  font-size: 24px !important;
}

.is-gray {
  color: #4a4a4a;
  font-weight: 700;
}

/*dfai 상세*/

.dfai-content {
  width: 100%;
  height: auto;
}
.dfai-headcon {
  width: 100%;
  background-color: whitesmoke;
  overflow: hidden;
}

.dfai-head {
  width: 1000px;
  margin: 0 auto;
  position: relative;
  display: flex;
  padding-top: 50px;
  align-items: center;
}

.dfai-head > .facetext {
  display: flex;
  width: 500px;
  font-size: 20px;
  flex-flow: column;
}

.dfai-title {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  width: 100%;
}

.dfai-title::after {
  content: "";
  display: block;
  border-bottom: 1px solid;
  border-image: linear-gradient(0deg, lightgray 0%, gray 100%);
  border-image-slice: 1;
  width: 80%;
  margin: 15px auto;
}

.dfai-sub {
  width: 100%;
  text-align: center;
  font-size: 13px;
  padding-bottom: 20px;
  line-height: 15px;
}

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

.dfai-body {
  width: 900px;
  padding: 24px;
}

.dfai-image {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
}

.dfai-image > img {
  width: 800px;
  height: auto;
  box-shadow: 0 0 15px lightgrey;
}

.dfai-head > .visiontext {
  display: flex;
  width: 500px;
  font-size: 20px;
  flex-flow: column;
}

.faceico {
  display: flex;
  width: 300px;
  margin: 0 auto;
}

.faceico > img {
  width: 60px;
  height: 50px;
}

.facetitle {
  display: flex;
  width: 300px;
  margin-bottom: 20px;
  margin: 10px auto 20px auto;
}

.facesub {
  display: block;
  width: 300px;
  margin: 0 auto;
  text-align: left;
  line-height: 28px;
}

.faceimgcon {
  width: 500px;
  height: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.faceimg {
  width: 350px;
  height: 200px;
  overflow: hidden;
}

.faceimg > img {
  width: 350px;
  height: 350px;
  margin: auto;
}

.visionico {
  display: flex;
  width: 400px;
  margin: 0 auto;
}

.visionico > img {
  width: 60px;
  height: 50px;
}

.visiontitle {
  display: flex;
  width: 400px;
  margin-bottom: 20px;
  margin: 10px auto 20px auto;
}

.visionsub {
  display: block;
  width: 400px;
  margin: 0 auto;
  text-align: left;
  line-height: 28px;
}

.dfuwb-head > .visiontext {
  display: flex;
  width: 500px;
  font-size: 20px;
  flex-flow: column;
}

/*dfai 상세 끝*/

/*dfbig 상세*/

.is-cele {
  color: #18604a;
}

.bs-headcon {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  flex-direction: column;
  margin-top: 50px;
}

.bs-head {
  display: block;
  width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.bs-title {
  font-size: 40px;
  margin-bottom: 50px;
  line-height: 50px;
}

.bs-sub {
  width: 900px;
  padding: 40px 0;
  border: 3px solid lightgray;
  box-shadow: 15px 15px 10px grey;
  margin: 0 auto;
}

.bs-sub > .bs-text {
  font-size: 20px;
}

.bs-text > span {
  display: contents;
}

.bigtoggle > .new-container {
  flex-flow: column;
}

.bs-bodycon {
  max-width: 1300px;
  flex-flow: column;
  padding: 70px 0;
}
#bs-bodycon-id{
  margin: 0 auto;
  width: 1200px;
}

.body-content {
  width: 100%;
  padding: 70px 100px;
  margin: 0 auto;
  max-width: 1300px;
}

.tap-content {
  width: 100%;
  max-width: 1300px;
  margin: 0 auto;
  padding: 30px;
}

.content-text {
  font-size: 20px;
  line-height: 30px;
  margin-bottom: 50px;
  text-align: center;
}

.bs-bodycon > .bs-subtitle {
  font-size: 30px;
  position: relative;
  text-align: left;
  width: 100%;
  line-height: 50px;
  margin-left: 40px;
  margin-bottom: 70px;
  font-weight: 600;
  color: #000;
}

.bs-subtitle::before {
  content: "";
  display: block;
  position: absolute;
  top: 10px;
  left: -20px;
  width: 10px;
  height: 30px;
  background-color: #2806b8;
  margin-right: 10px;
}

.bs-bodycon>p {
  font-size: 22px;
  color: #000;
  margin-bottom: 60px;
}

.bs-bodycon > .bs-body {
  display: grid;
  max-width: 1200px;
  /* box-shadow:0 0 10px lightgray; */
  margin-bottom: 30px;
  grid-template-columns: repeat(3, 1fr);
}

.bs-body.full-img {
  grid-template-columns: 1fr;
}

.bs-body.left-grid {
  grid-template-columns: 2fr 1fr;
}

.bs-body.right-grid {
  grid-template-columns: 1fr 2fr;
}

/* .bs-body > img.with_text {
  flex: 1;
} */

.bs-body > p {
  font-size: 18px;
  padding: 10px;
  text-align: left;
  line-height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bs-grid {
  width: 1200px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding-top: 100px;
  margin: auto;
  align-items: center;
  justify-items: center;
}

.bs-item {
  display: flex;
  align-items: center;
  justify-items: center;
  height: 550px;
}

.bs-item > img {
  box-shadow: 0 0 15px gray;
  width: 600px;
}

.bs-itext {
  font-size: 36px;
  line-height: 50px;
  flex-flow: column;
}

.bs-bodycon > .bs-subtitle2 {
  font-size: 30px;
  position: relative;
  text-align: left;
  width: 1200px;
  line-height: 50px;
  margin-bottom: 70px;
}
.bs-subtitle2::before {
  content: "";
  display: block;
  border-left: 8px solid #18604a;
  margin-right: 10px;
}

.bs-antext {
  font-size: 36px;
  line-height: 50px;
  flex-flow: column;
  margin-bottom: 50px;
}

.bs-ancon {
  flex-flow: column;
}

.bs-an {
  font-size: 20px;
  width: 100%;
  text-align: left;
  padding: 30px 0;
}
.bs-ancon > img {
  box-shadow: 0 0 7px 2px gray;
}

.bs-2-item {
  width: 1300px;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.bs-2-item > .bs-ancon {
  width: 625px;
  height: 420px;
}

.bs-2-item > .bs-ancon > img {
  height: 320px;
}

.bs-third {
  margin-top: 100px;
  position: relative;
  width: 1300px;
  height: 440px;
}

.bs-two {
  width: 1300px;
  display: flex;
  justify-content: space-around;
}

.bs-two > img {
  margin: 0 25px;
}

.bs-third img {
  width: 600px;
  box-shadow: 12px 12px 3px gray;
  height: 330px;
}

.bs-third > img {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0px;
}

.bs-htext {
  font-size: 22px;
  line-height: 34px;
  flex-flow: column;
}

/*dfbig 상세 끝*/

/*dfuwb 상세*/

.dfuwb-content {
  width: 100%;
  height: auto;
}
.dfuwb-headcon {
  width: 100%;
  height: auto;
}

.dfuwb-headcon > img {
  width: 1200px;
  height: auto;
  padding: 60px 0;
}

.dfuwb-head {
  width: 1200px;
  margin: 0 auto;
  position: relative;
  display: flex;
  padding-top: 50px;
  margin-left: auto;
  margin-right: auto;
}

.dfuwb-head > .dfuwb-text {
  display: flex;
  width: 1200px;
  flex-direction: column;
}

.dfuwb-text > .dfuwb-ico {
  width: 1200px;
  height: auto;
}

.dfuwb-ico > img {
  width: 250px;
  height: auto;
  padding: 30px 0;
}

.dfuwb-titlecon {
  width: 100%;
  background-color: whitesmoke;
  display: flex;
  flex-direction: column;
  padding-top: 50px;
  margin-bottom: 100px;
}

.dfuwb-maintitle {
  font-weight: 900;
  color: #4a4a4a;
  font-size: 32px;
  text-align: center;
}

.dfuwb-maintitle::after {
  content: "";
  display: block;
  border-bottom: 1px solid;
  border-image: linear-gradient(0deg, lightgray 0%, gray 100%);
  border-image-slice: 1;
  width: 80%;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}

.dfuwb-title {
  font-size: 32px;
  font-weight: bold;
  text-align: center;
}

.dfuwb-title::after {
  content: "";
  display: block;
  border-bottom: 1px solid;
  border-image: linear-gradient(0deg, lightgray 0%, gray 100%);
  border-image-slice: 1;
  width: 80%;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto;
}

.dfuwb-sub {
  width: 100%;
  text-align: center;
  font-size: 16px;
  padding: 40px 0;
}

.dfuwb-subtitle {
  text-align: center;
  font-size: 20px;
  padding-top: 50px;
  margin: 0 auto;
}

.dfuwb-sub-title {
  text-align: left;
  font-size: 20px;
  margin: 0 120px 10px;
  font-weight: 500;
}

.dfuwb-sub p {
  text-align: left;
  margin: 0 140px 30px;
  line-height: 24px;
}

.dfuwb-sub p:last-child {
  margin-bottom: 0;
}

.dfuwb-subtitle > .is-aqua {
  font-size: 24px;
}

.dfuwb-subcon {
  display: flex;
  width: 1200px;
  height: 215px;
  justify-content: space-between;
  align-items: center;
}

.dfuwb-subitem {
  width: 380px;
  height: 170px;
  background: #44afbe;
  border-radius: 30px;
  padding: 15px;
  box-sizing: border-box;
}

.dfuwb-subbox {
  width: 350px;
  height: 140px;
  background: white;
  border-radius: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dfuwb-items {
  display: grid;
  width: 80%;
  grid-row-gap: 50px;
  margin: 0 auto;
}

.dfuwb-item {
  padding: 22px 0;
  background: #ffffff;
  box-shadow: 0px 3px 6px #00000029;
  justify-content: center;
}

.dfuwb-rtls {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
  flex-flow: row;
  padding-top: 70px;
}

.dfuwb-rtls > div {
  position: relative;
  width: 280px;
  height: 164px;
}
.rtls-item > .number-img {
  position: absolute;
  width: 28px;
  height: 28px;
  object-fit: contain;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0);
}

.rtls-item > .text-box {
  width: 100%;
  height: 144px;
  background: #ffffff;
  box-shadow: 0px 3px 6px #00000029;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

.rtls-item > .text-box > .dfuwb-subtitle {
  padding: 0;
}

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

.dfuwb-body {
  width: 1200px;
}

.border-list {
  display: grid;
  width: 540px;
  grid-row-gap: 15px;
  margin: 0 auto;
  background: none;
  box-shadow: none;
  max-width: 100%;
  padding: 60px 0;
}

.border-list .item {
  display: flex;
  width: 100%;
  min-height: 54px;
  justify-content: center;
  align-items: center;
  background: #f8f8f8;
  box-sizing: border-box;
  border-radius: 10px;
  border: 3px solid #176a75;
  position: relative;
  flex-direction: column;
  padding: 12px;
}
.border-list .item + .item::before {
  content: "";
  display: block;
  position: absolute;
  width: 3px;
  height: 17px;
  background: #176a75;
  left: 50%;
  top: -19px;
  transform: translateX(-50%);
}

.dist-grid {
  width: 1140px;
  height: 362px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  background: #ffffff;
  margin-top: 50px;
}
.dist-grid > div {
  padding: 40px 30px;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: center;
}
.dist-grid > div + div {
  border-left: 1px dashed #707070;
}

.dist-grid .item-title {
  width: 225px;
  height: 48px;
  background: #176a75;
  font-size: 16px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #ffffff;
  font-family: "Noto Sans KR";
}

.grid-5-items {
  display: grid;
  grid-row-gap: 20px;
  width: 750px;
  align-content: center;
  grid-template-columns: 85%;
  flex-flow: column;
  padding: 50px 0;
  box-shadow: 0 0 15px lightgray;
  margin: 50px auto;
}
.grid-5-items > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 530px;
  text-align: center;
}
.grid-5-items .check-img {
  margin-right: 15px;
}

.connected-list {
  display: flex;
  flex-flow: column;
  margin: 50px auto;
}

.connected-list .line {
  width: 720px;
  height: 3px;
  background: #176a75;
  margin: 0 auto;
}

.connected-list .flex-3-items {
  display: flex;
  justify-content: space-between;
  width: 1050px;
  height: auto;
  margin: 0 auto;
  padding-top: 40px;
  flex-flow: row;
}

.connected-list .flex-3-items > div {
  width: 330px;
  height: 210px;
  border: 2px solid #176a75;
  border-radius: 10px;
  box-sizing: border-box;
  background: #ffffff;
  position: relative;
  display: block;
  margin: 0;
}

.connected-list .flex-3-items > div::before {
  content: "";
  display: block;
  position: absolute;
  width: 3px;
  height: 46px;
  left: 50%;
  top: -45px;
  transform: translateX(-50%);
  background: #176a75;
  z-index: 5;
}

.connected-list .flex-3-items .item-title {
  width: 100%;
  height: 50px;
  background: #176a75;
  color: #ffffff;
  font-family: "Noto Sans KR";
  font-size: 20px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px 5px 0 0;
}

.connected-list .flex-3-items .sub-title {
  word-break: keep-all;
  width: 100%;
  height: calc(100% - 50px);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 20px;
}

.img-background {
  padding: 25px;
  background: #ffffff;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 800px;
}

.checkimg {
  box-shadow: 0 0 15px lightgray;
}

.checkimg > img {
  width: 750px;
}

.check-img > img {
  width: 24px;
  height: 19px;
}

.grid-5-items .sub-title {
  text-align: left;
  width: 465px;
  max-width: 90%;
  font-size: 20px;
  line-height: 29px;
}

.item-text-box {
  width: 100%;
  min-height: 214px;
  background: #f2f2f2;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-direction: column;
  padding: 0 22px;
  box-sizing: border-box;
}

.item-text-box > .sub-title {
  font-size: 16px;
  text-align: left;
  word-break: keep-all;
}

#RTLS .flex-3-items {
  width: 1150px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 70px;
}

#RTLS .flex-2-items {
  width: 860px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 70px;
}

.bold {
  font-weight: bold;
}

#RTLS .item {
  width: 364px;
  height: 450px;
  flex-direction: column;
}
#RTLS .item .sub-title {
  font-size: 16px;
  line-height: 24px;
  text-align: left;
  padding: 0 26px;
  word-break: keep-all;
}

#RTLS .item-title {
  font-family: "Noto Sans KR";
  font-weight: 700;
  font-size: 20px;
  line-height: 29px;
  color: #44afbe;
  padding: 20px 0 16px;
}

#RTLS .item .text-box {
  background: #ffffff;
  box-shadow: 0px 3px 6px #0000004f;
  flex-direction: column;
  width: 100%;
  height: 190px;
  margin-top: 15px;
}

.image {
  display: block;
  position: relative;
}

.image img {
  display: block;
  height: auto;
  width: 100%;
}

.dfuwb-video {
  width: 1200px;
  display: flex;
  justify-content: center;
  margin-bottom: 100px;
  margin-top: 30px;
}

.dfuwb-video > iframe {
  background-image: url(https://i.ytimg.com/vi/4AB4l4YMPww/maxresdefault.jpg?sqp=-oaymwEmCIAKENAF8quKqQMa8AEB-AHUBoAC4AOKAgwIABABGGUgZShlMA8=&rs=AOn4CLAE4tzOS1pPr_ZydW0ymvTJ-T8zsw);
  height: 500px;
}

.dfuwb-grid {
  width: 1200px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 100px;
}
.dfuwb-gitem {
  width: 600px;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: left;
}

.dfuwb-gimg {
  width: 550px;
  height: 300px;
}

.dfuwb-gbox {
  width: 550px;
}

.gboxtitle {
  font-size: 25px;
  font-weight: bold;
}

.gboxsub::after {
  content: "";
  display: block;
  width: 100%;
  border-bottom: 3px solid #44afbe;
  padding-bottom: 30px;
}

.gboxcontent {
  padding-top: 30px;
}

.dfuwb-image {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
}

.dfuwb-image > img {
  width: 800px;
  height: auto;
  box-shadow: 0 0 15px lightgrey;
}

.imgbox {
  margin: 0 auto;
  padding-top: 40px;
}

.dfecm-title {
  margin-top: 60px;
  font-size: 30px;
  font-weight: 600;
  line-height: 30px;
}

.dfecm-subtitle {
  font-size: 20px;
  font-weight: 500;
  line-height: 40px;
}

.imgbox.dfecm-img > img {
  width: 80%;
  margin: 0 auto 30px;
}

.dftpam-img span::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  background-color: #165f49;
  vertical-align: middle;
  margin-right: 12px;
}

.pc-br {
  display: block;
}

.add-list {
  width: 800px;
  margin: 0 auto;
  display: block;
  max-width: 90%;
  padding-top: 60px;
  flex-flow: column;
}

h3 {
  font-size: 20px;
}

.add-list > .item {
  width: 100%;
  padding: 30px 15px;
  border-radius: 20px;
  background: #44afbe;
  box-shadow: 0px 3px 6px #00000029;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-flow: column;
}
.add-list > .item > .sub-title {
  color: #ffffff;
  font-size: 20px;
  line-height: 29px;
}

.add-list > .icon {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 15px 0;
  width: 100%;
  height: 26px;
  box-sizing: unset;
}

.icon img {
  width: 26px;
  height: 26px;
}

/*dfuwb 끝*/

/*dfecm 시작*/
.dfecm-container {
  width: 100%;
  max-width: 1400px;
  flex-flow: column;
  text-align: center;
  align-items: center;
  justify-content: center;
  height: auto;
}

.dfecm-title {
  font-size: 40px;
  line-height: 60px;
  margin-bottom: 60px;
  font-weight: bold;
}
.dfecm-titleimg {
  margin-bottom: 60px;
}

.dfecm-titleimg > img {
  max-width: 320px;
}

.dfecm-con {
  display: block;
  margin: 70 auto;
  width: 1200px;
  justify-content: space-around;
}

.dfecm-item {
  height: 700px;
  box-shadow: 0 0 15px gray;
}

.dfecm-pf {
  width: 1400px;
  display: flex;
  align-items: center;
  position: relative;
  padding: 30px 0;
}

.dfecm-pf > .dfecm-one {
  background: white;
  box-shadow: 0 0 15px gray;
  width: 300px;
  height: 300px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 2;
}

.dfecm-one > .dfecm-one-text {
  font-size: 36px;
  line-height: 50px;
  position: absolute;
}

/* .dfecm-one::before{
  content: "";
  display: block;
  border-bottom:1px solid black;
  position: absolute;
  width:400px;
  left:50%;
} */

.dfecm-pf > .dfecm-line1 {
  display: block;
  height: 500px;
  border-left: 1px solid black;
  z-index: 1;
  position: absolute;
  left: 325px;
  transform: rotate(50deg);
  top: 75px;
}

.dfecm-pf > .dfecm-line2 {
  display: block;
  width: 300px;
  border-bottom: 1px solid black;
  z-index: 1;
  position: absolute;
  left: 325px;
  top: 475px;
}

.dfecm-pf > .dfecm-line3 {
  display: block;
  height: 500px;
  border-left: 1px solid black;
  z-index: 1;
  position: absolute;
  left: 325px;
  transform: rotate(130deg);
  top: 390px;
}

.dfecm-columns {
  width: 900px;
  flex-flow: column;
}

.dfecm-column {
  height: 250px;
  margin: 25px 0;
  background: white;
  box-shadow: 0 0 15px gray;
  display: flex;
  width: 800px;
  z-index: 2;
  align-items: center;
}

.is-flured {
  color: #ff5a5a;
}

.is-green {
  color: #1ec800;
}

.dfecm-column > .item-title {
  font-size: 40px;
  color: #ff5a5a;
  line-height: 60px;
  margin: 25px;
}

.dfecm-column > .item-sub {
  font-size: 20px;
  line-height: 36px;
  text-align: left;
  width: 600px;
  flex-flow: column;
}

.item-sub > span {
  display: inline-flex;
  padding: 10px 0;
}

.dfecm-container > .dfecm-midtitle {
  font-size: 50px;
  margin-top: 100px;
  margin-bottom: 50px;
  line-height: 120px;
}

.dfecm-container > .dfecm-midcon {
  width: 1100px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.dfecm-midcon > .dfecm-midtext {
  text-align: left;
  display: block;
  font-size: 38px;
  line-height: 40px;
}

.dfecm-logocon {
  flex-flow: column;
}

.dfecm-logocon > .dfecm-naver {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 300px;
  position: relative;
}
.dfecm-naver > img {
  box-shadow: 15px 15px 12px grey;
  border-radius: 20px;
  width: 200px;
  height: 200px;
  position: relative;
}

.dfecm-logocon > .dfecm-coupang {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 300px;
  position: relative;
}

.dfecm-coupang > img {
  height: 200px;
  position: relative;
}

.dfecm-naver > .dfecm-arrow > img {
  width: 70px;
  z-index: 3;
  position: absolute;
  left: 90px;
  top: 60px;
}

.dfecm-coupang > .dfecm-arrow2 > img {
  width: 70px;
  z-index: 3;
  position: absolute;
  left: 240px;
  top: 20px;
}

.dfecm-naver > .dfecm-arrow {
  width: 70px;
  z-index: 3;
  position: absolute;
}

.dfecm-coupang > .dfecm-arrow2 {
  width: 70px;
  z-index: 3;
  position: absolute;
}

.pg-grid-con {
  flex-flow: column;
  width: 1400px;
  height: 700px;
  position: relative;
}

.pg-grid-con > .pg-grid-top {
  position: absolute;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-row-gap: 25px;
  z-index: 1;
}

.pg-grid-con > .pg-grid-bottom {
  position: absolute;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  bottom: 20px;
  z-index: 2;
}

.pg-grid-con .pg-item {
  width: 275px;
  margin: 0 25px;
  box-shadow: 15px 15px 12px grey;
}

.pg-white {
  width: 100px;
}

/*dfecm 끝*/

.mr-container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-family: "Noto Sans KR";
  margin-left: auto;
  margin-right: auto;
  flex-flow: column;
}

.mr-content {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.mr-title {
  font-size: 28px;
  margin: 70px auto;
}

.mr-subcon {
  display: flex;
  flex-flow: row;
  border-top: 1px solid gray;
  justify-content: center;
  align-items: center;
  position: relative;
}

.mr-subcon > #title {
  height: 50px;
  width: 600px;
  border: 1px solid lightgray;
  border-radius: 5px;
  margin: 25px 0;
  padding: 20px;
}

.mr-subcon > #content {
  height: 450px;
  width: 600px;
  border: 1px solid lightgray;
  border-radius: 5px;
  margin: 25px 0;
  padding: 20px;
  z-index: 2;
  resize: none;
}

.mr-sub {
  width: 110px;
  position: absolute;
  text-align: center;
  left: 50px;
  color: #18604a;
  font-size: 20px;
  z-index: 1;
}

.notice-form {
  width: 1000px;
}

.mr-buttons {
  width: 1000px;
  height: auto;
  display: flex;
  position: relative;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  margin: auto;
  font-size: 22px;
}

.mr-button {
  cursor: pointer;
  width: 130px;
  height: 50px;
  border: 3px solid #1d9a8c;
  border-radius: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 0;
}

.mr-button:nth-child(1) {
  color: #1d9a8c;
  right: 150px;
}

.mr-button:nth-child(2) {
  background: #1d9a8c;
  color: white;
}

.con-wrap {
  width: 100%;
  margin-bottom: 20px;
  align-content: center;
  display: grid;
  position: relative;
  padding: 0 60px;
  grid-template-columns: 1fr 1fr 1fr;
}

.con-box {
  width: auto;
  /* height: 220px; */
  padding: 25px;
  text-align: left;
  font-size: 18px;
  border-bottom: 1px solid #e1e1e1;
}

.con-box h4 {
  display: block;
  width: 100%;
  font-size: 22px;
  text-align: left;
  font-weight: 600;
  margin-bottom: 30px;
}

.con-box span {
  font-size: 14px;
  font-weight: 500;
  font-style: italic;
}

.con-box p {
  /* word-wrap: break-word; */
  word-break: break-all;
}

/* .con-wrap::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: block;
  height: 1px;
  width: inherit;
  background-color: #d6d6d6;
} */

/* .con-wrap:last-child::after {
  content: none;
} */

.con-wrap > .imgbox {
  max-width: 1300px;
}

.con-wrap.img-wrap {
  grid-template-columns: 1fr;
}

.con-wrap.dfdev-list {
  grid-template-columns: 1fr;
}

.list-title {
  margin: 40px auto;
  font-size: 20px;
  font-weight: 600;
  background-color: #ededed;
  padding: 15px 0px;
  border-radius: 25px;
}

.con-wrap ul {
  text-align: left;
}

.con-wrap ul li::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 3px;
  background-color: #222;
  /* border-radius: 50%; */
  margin-right: 10px;
}

.con-wrap table {
  width: 100%;
}

.con-wrap tr {
  border-bottom: 1px solid #ededed;
}

.con-wrap th {
  padding: 10px 20px;
  width: 30%;
  font-size: 22px;
  font-weight: 500;
  vertical-align: top;
}

.con-wrap td {
  width: 70%;
  font-size: 18px;
  vertical-align: top;
  padding: 10px 0px 40px 0px;
}

.dfecm-new-container {
  width: 100%;
  margin: 80px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.dfecm-new-contain {
  width: 100%;
  /* max-width: 1200px; */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.dfecm-new-content {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.dfecm-new-title-box {
  max-width: 1200px;
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}
.dfecm-new-title-box .title-box {
  flex: 1;
  background: #f2f2f2;
  color: #165f49;
  font-weight: 600;
  font-size: 30px;
  line-height: 40px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
  text-align: start;
  padding: 30px 20px 30px 40px;
}
.dfecm-new-title-box .image-box {
  width: 550px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
}
.dfecm-new-title-box .image-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.dfecm-new-title-logo {
  display: flex;
  max-width: 1200px;
  width: 100%;
  padding: 30px 50px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 50px;
}
.dfecm-new-title-logo img {
  height: 50px;
  object-fit: contain;
}
.dfecm-new-logo-title {
  color: #165f49;
  font-weight: 600;
  font-size: 45px;
  line-height: 45px;
  word-wrap: normal;
}
.dfecm-new-center-title {
  display: inline-block;
  padding: 10px 100px;
  background: #d9d9d9;
  border-radius: 100px;
  margin-bottom: 30px;
  font-weight: 600;
  font-size: 24px;
}
.dfecm-new-center-title img {
  height: 50px;
}
.dfecm-new-flex-list {
  display: flex;
  gap: 20px;
  width: 100%;
  max-width: 1200px;
}
.dfecm-new-flex-list .dfecm-new-list-item {
  display: grid;
  grid-template-rows: 40px 1fr;
  flex: 1;
}
.dfecm-new-flex-list .dfecm-new-item-header {
  width: 100%;
  color: #fff;
  background: #2806b8;
  border-radius: 5px;
  font-size: 20px;
  font-weight: 600;
  line-height: 40px;
}
.dfecm-new-flex-list .dfecm-new-item-body {
  padding: 10px;
  background: #f2f2f2;
  border-radius: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dfecm-new-flex-list .dfecm-new-item-body.dotted {
  background: transparent;
  border: 3px solid #2806b8;
  border-style: dotted;
}
.dfecm-new-flex-list .dfecm-new-item-contents {
  width: 100%;
  background: #d9d9d9;
  padding: 10px 20px;
}
.dfecm-new-midtitle {
  color: #2806b8;
  font-size: 30px;
  line-height: 30px;
  font-weight: 600;
  padding-top: 70px;
  margin-bottom: 50px;
}
.dfecm-new-circle-list {
  display: grid;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 50px 100px 30px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
}
.dfecm-new-circle-list .dfecm-new-item {
  width: 140px;
  height: 140px;
  border-radius: 140px;
  background: #fff;
  border: 4px solid #eee;
  padding: 4px;
  margin: 0 auto;
}
.dfecm-new-circle-list .dfecm-new-item-contents {
  width: 100%;
  height: 100%;
  border: 4px solid #7f7f7f;
  border-radius: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
  font-weight: 500;
  flex-direction: column;
}
.dfecm-new-circle-list .dfecm-new-item-contents .small-font-size {
  font-size: 20px;
}
.dfecm-new-sub-midtitle {
  font-size: 20px;
  padding: 0 0 30px;
}
.dfecm-new-flex-list.list-column {
  flex-direction: column;
  width: 80%;
}
.dfecm-new-flex-list.list-column .dfecm-new-item-body {
  padding-left: 30px;
}
.dfecm-new-flex-list.list-column .dfecm-new-list-item {
  grid-template-columns: 210px 1fr;
  grid-template-rows: 1fr;
}
.dfecm-new-flex-list.list-column .dfecm-new-item-header {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.dfecm-new-flex-list.list-column .dfecm-new-check-item {
  display: flex;
  flex-direction: column;
  text-align: start;
}
.dfecm-new-flex-list.list-column .dfecm-new-check-icon {
  width: 20px;
  height: 20px;
  display: inline-flex;
  border: 1px solid #aaa;
  color: #57aeff;
  justify-content: center;
  align-items: center;
  border-radius: 20px;
  font-size: 20px;
  font-weight: 600;
  margin-right: 5px;
  font-weight: 600;
}
.dfecm-new-flex-list.list-column .dfecm-new-check-title {
  font-size: 20px;
  font-weight: 500;
}
.dfecm-new-check-item-list {
  padding: 5px 0 10px 50px;
}
.dfecm-new-check-sub-item {
  position: relative;
}
.dfecm-new-check-sub-item::before {
  position: absolute;
  display: block;
  content: "";
  width: 8px;
  height: 1px;
  background: #888;
  left: -15px;
  top: 50%;
}
.dfecm-new-image {
  width: 100%;
  max-width: 1200px;
}

.dfcon-body {
  width: 100%;
  max-width: 1200px;
  flex-flow: column;
  padding: 70px 0;
  display: flex;
}

.dfcon-body > .dfcon-subtitle {
  font-size: 30px;
  position: relative;
  text-align: left;
  width: 100%;
  line-height: 50px;
  margin-bottom: 70px;
  display: flex;
}
.dfcon-subtitle::before {
  content: "";
  display: block;
  border-left: 8px solid #18604a;
  margin-right: 10px;
}

.dfcon-body > .dfcon-image {
  max-width: 1200px;
  width: 100%;
  box-shadow: 0 0 15px gray;
  display: flex;
}

@media (max-width: 1260px) {
  .dfecm-new-container {
    width: 100%;
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
  .dfecm-new-flex-list.list-column {
    width: 100%;
    padding-left: 30px;
    padding-right: 30px;
  }
}

.list-wrap ul {
  /* float: left; */
  text-align: left;
  /* position: relative; */
  font-size: 18px;
  margin-bottom: 20px;
  color: #111;
}

.list-wrap > ul:first-child::before {
  content: none;
}

.list-wrap > ul > li::before {
  content: "";
  width: 4px;
  height: 4px;
  display: inline-block;
  vertical-align: middle;
  background-color: #01236b;
  margin-left: 20px;
  margin-right: 12px;
}

.list-wrap li {
  margin: 10px 0;
}

.dfecm-new-item-footer {
  font-size: 22px;
  font-weight: 500;
}

.dfecm-new-item-footer::before {
  content: "";
  width: 10px;
  display: block;
  margin: 0 auto;
  border: 30px solid transparent;
  border-top-color: #2806b8;
}

.body-content > ol {
  margin-top: 40px;
  text-align: left;
  font-size: 18px;
  line-height: 30px;
}

.bottom-contact {
  width: 100%;
  height: 200px;
  display: flex;
  align-items: center;
  /* background: url("/images/contact_bottom.png") no-repeat center / cover; */
  /* background: url("/images/main/main_bigdata.png") no-repeat center / cover;
  background-attachment: fixed; */
  justify-content: space-around;
  /* filter: grayscale(100%); */
  /* flex-direction: column; */
  position: relative;
}
.bottom-contact-img {
  width: 100%;
  height: 200px;
  background: url("/images/solution_top.png") no-repeat center / cover;
  background-attachment: fixed;
  filter: brightness(0.5);
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.bottom-contact-title {
  font-size: 30px;
  font-weight: 700;
  color: #fff;
}
.bottom-contact-button {
  font-size: 20px;
  color: #fff;
  border: 1px solid #fff;
  padding: 10px 60px;
  border-radius: 100px;
  transition: 0.2s;
  font-weight: 600;
  text-align: center;
}

.bottom-contact-button:hover {
  background-color: #fff;
  color: #01236b;
  transition: 0.5s;
}
/* .bottom-contact-button:hover {
  background: #fff;
  color: #01236b;
  transition: 0.6s;
} */
.item-center {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.bottom-contact-button.color {
  margin-top: 30px;
  display: block;
  width: 100%;
  border-color: #01236b;
  color: #01236b;
}
.bottom-contact-button.color:hover {
  background: #01236b;
  color: #fff;
  transition: 0.6s;
}

.main-container {
  width: 100%;
  height: calc(100vh - 80px);
  position: relative;
}
/* .main-image {
  width: 100%;
  height: 100%;
  background: no-repeat center center url(/images/main/main.png);
  background-size: cover;
  background-attachment: fixed;
  /* opacity: 0.7; 
} */

.main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* opacity: 0.7; */
}
.main-contents {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  width: 100%;
  overflow: hidden;
  z-index: 3;
}
.main-contents h2 {
  font-size: 64px;
  line-height: 70px;
  font-weight: 600;
  text-align: center;
  word-spacing: -12px;
}
.main-contents h2>span {
  font-size: 80px;
  background: linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -moz-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -o-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-box-decoration-break: clone;
  clip-path: inset(1px);
}
.main-video {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #333;
}
.main-video video {
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  /* height: calc(100vh - 80px); */
}

.main-list {
  font-size: 30px;
  font-weight: 700;
  display: flex;
  justify-content: space-evenly;
  gap: 100px;
  margin: 50px 0;
  text-wrap: nowrap;
  flex-wrap: wrap;
  width: 100%;
}
.main-button-wrap {
  display: flex;
  gap: 20px;
  margin-top: 100px;
}
.main-button {
  width: 240px;
  box-sizing: border-box;
  padding: 12px 80px;
  color: #2806b8;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid #2806b8;
  background-color: rgba(256, 256, 256, 0.3);
  border-radius: 10px;
  box-sizing: border-box;
  text-wrap: nowrap;
  text-align: center;
}
.main-button:hover {
  background: #2806b8;
  color: #fff;
  transition: 0.5s;
  border: 0;
}

.main-contents img {
  display: inline-block;
  height: 80px;
  vertical-align: middle;
  filter: brightness(0) invert(1);
}

.main-contents div {
  font-size: 26px;
  font-weight: 500;
}

.main-contents p {
  font-size: 20px;
  font-weight: 500;
  margin: 30px 0;
  text-align: center;
}


.main-gitlab-title {
  text-align: center;
}

.main-gitlab-title img {
  width: 18%;
  max-width: 240px;
  display: block;
  margin: 0 auto;
}

.main-gitlab-title h3 {
  display: inline-block;
  font-size: 30px;
  font-weight: 600;
  text-align: center;
  line-height: 40px;
}

.main-gitlab-icon-wrap {
  max-width: 1000px;
  margin: 20px auto 10px;
  height: auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-around;
}

.main-gitlab-icon {
  width: 60px;
  margin: 10px;
}

.main-gitlab-icon h4 {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  color: #423175;
}

.main-gitlab-content-wrap {
  display: grid;
  max-width: 1300px;
  grid-template-columns: 1fr 1fr 1fr;
  margin: 10px auto;
}

.main-gitlab-content {
  /* margin: 20px; */
  padding: 10px;
  color: #000000;
  text-align: center;
}

.main-gitlab-content h4 {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 20px;
  height: 50px;
}

.main-gitlab-content p {
  font-size: 18px;
}

.main-gitlab-contact {
  text-align: center;
}

.main-gitlab-button {
  display: inline-block;
  max-width: 320px;
  border: 1px solid #124ece;
  padding: 10px 80px;
  border-radius: 160px;
  font-size: 18px;
  font-weight: 500;
  color: #124ece;
  margin-top: 20px;
}

.main-gitlab-button:hover {
  background-color: #124ece;
  color: #fff;
}

.main-contact-container {
  width: 100%;
  background-color: #ededed;
  padding: 30px 0 40px;
}

.tpam-grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 50px;
  margin-top: 80px;
}

.tpam-grid .item {
  display: grid;
  grid-template-columns: 400px 150px 80px;
  font-size: 25px;
  color: #897f75;
  align-items: flex-end;
  text-align: start;
  gap: 40px;
}
.tpam-grid .b {
  font-weight: 600;
  text-align: end;
}
.tpam-grid .word {
  font-size: 27px;
  color: #262626;
  font-weight: 500;
}
.tpam-grid .word span {
  font-size: 35px;
  color: #01867e;
  font-weight: 700;
}

.grid-4-items {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
}
.gap50 {
  gap: 50px;
}

.gap20 {
  gap: 20px;
}

.grid-4-items .item {
  display: grid;
  grid-template-rows: 35px 110px 1fr;
  gap: 20px;
}
.grid-4-items .item-title {
  font-size: 20px;
  font-weight: 600;
}
.grid-4-items .b {
  font-weight: 600;
}

.none {
  display: none;
}
.grid-tab {
  max-width: 1200px;
  width: 100%;
  height: 60px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  font-size: 20px;
  font-weight: 600;
  margin: 50px auto 0;
}
.grid-tab .item {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #e7e7e7;
  cursor: pointer;
}

#portal:checked ~ .dfuwb-headcon .portal {
  background: #fff;
  border: 1px solid #262626;
}
#AI:checked ~ .dfuwb-headcon .AI {
  background: #fff;
  border: 1px solid #262626;
}
#IoT:checked ~ .dfuwb-headcon .IoT {
  background: #fff;
  border: 1px solid #262626;
}
#RTLS:checked ~ .dfuwb-headcon .RTLS {
  background: #fff;
  border: 1px solid #262626;
}

.tpam-tab {
  display: none;
}

#portal:checked ~ .portal-tab {
  display: block;
}
#AI:checked ~ .AI-tab {
  display: block;
}
#IoT:checked ~ .IoT-tab {
  display: block;
}
#RTLS:checked ~ .RTLS-tab {
  display: block;
}

.box-container {
  width: 100%;
  display: flex;
  gap: 20px;
  padding: 0 70px;
}

.border-box {
  flex: 1;
  padding: 60px 20px;
  border: 3px solid #ddd;
  border-radius: 20px;
}

.body-content > p {
  font-size: 18px;
  text-align: left;
  line-height: 30px;
}

/* .body-content > p::before {
  content: '';
  width: 4px;
  height: 4px;
  background-color: #18604a;
  display: inline-block;
  vertical-align: middle;
  margin-right: 20px;
} */

.body-content > p > .br {
  display: block;
}

.body-content > p > .br::before {
  content: "→";
  display: inline-block;
  margin: 0 12px;
}

.blog-wrap {
  max-width: 1400px;
  width: 100%;
  margin: 50px auto 30px;
  padding: 60px 80px;
}

.blog-title {
  font-size: 52px;
  color: #000;
  margin-bottom: 80px;
}

.blog-title b {
  padding-right: 25px;
}

.blog-content-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-column-gap: 30px;
  grid-row-gap: 60px;
}

.blog-content {
  display: block;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 3px #ddd, 0 0 3px #ddd;
  transition: 0.2s;
}

.blog-content img {
  width: 100%;
  height: 210px;
  object-fit: cover;
}

.blog-content div {
  background-color: #fff;
  padding: 15px;
}

.blog-content div b {
  color: #999;
}

.blog-content div h3 {
  font-size: 18px;
  font-weight: 500;
}

.blog-content:hover {
  box-shadow: 1px 1px 20px #ddd;
}

.check-icon {
  color: #124ece;
  font-size: 22px;
}

.content-box-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  gap: 80px;
}

.content-box {
  min-width: 240px;
  font-size: 20px;
  font-weight: 500;
  text-align: center;
  padding: 40px;
  border-radius: 15px;
  background-color: #01236b;
  color: #fff;
  flex: 1;
  /* min-width: 280px; */
}

.list-wrap {
  margin-bottom: 60px;
}

.contact-button {
  display: inline-block;
  padding: 15px 20px;
  border-radius: 30px;
  font-size: 18px;
  border: 1px solid #124ece;
  color: #124ece;
  font-weight: 500;
}

.contact-button:hover {
  background-color: #124ece;
  color: #fff;
  transition: 0.3s;
}

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

.button-wrap .contact-button {
  padding: 15px 50px;
}

.blog-content .top,
.blog-content .bottom {
  margin: 0;
  padding: 0;
}

.blog-content .top p {
  display: -webkit-box;
  display: -ms-flexbox;
  text-overflow: ellipsis;
  word-break: break-all;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  overflow: hidden;
  height: 170px;
  padding: 20px 0;
}

.blog-content .tags,
.blog-post-info .tags {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding: 0;
  gap: 5px;
  padding-top: 3px;
}
.blog-content .tag,
.blog-post-info .tag {
  padding: 3px 5px;
  background: #f5f5f5;
  border-radius: 3px;
  color: #124ece;
}

.blog-post-wrap {
  padding: 20px;
  color: #444;
  display: grid;
  grid-template-columns: 1fr 250px;
  gap: 20px;
}

.blog-post-info {
  margin: 80px 0 20px;
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: flex-end;
}
.blog-post-info .date {
  color: #999;
}

.blog-post-wrap .image {
  width: 80%;
  padding: 20px 0;
}
.blog-post-wrap .title {
  font-size: 30px;
  text-align: start;
  padding: 60px 0 10px;
}
.blog-post-wrap .highlight {
  color: #124ece;
}

.blog-post-title {
  font-size: 40px;
  font-weight: 600;
  padding: 20px 0 30px;
}

.blog-post-wrap .source {
  padding: 40px 0 20px;
  font-size: 14px;
  color: #888;
}

.post-nav {
  position: relative;
}

.post-nav-menu {
  position: fixed;
  width: 270px;
  height: calc(100% - 80px);
  right: 0;
  top: 80px;
  border-left: 1px solid #124ece;
  padding: 70px 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  font-size: 15px;
}
.post-nav-menu .sub {
  padding-left: 16px;
}
.post-nav-menu a:hover {
  color: #124ece;
}

.info-content-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  padding: 20px;
}
.info-content {
  padding: 20px;
  margin-bottom: 10px;
  box-shadow: 1px 1px 2px #ddd;
}
.info-content .date {
  font-weight: 600;
  color: #999;
}
.info-content .title {
  font-size: 18px;
  font-weight: 400;
  text-align: start;
  padding-bottom: 20px;
}
.info-content .more {
  color: #124ece;
  font-weight: 600;
}

.info-paging {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 40px;
  font-size: 18px;
  padding: 80px 0 0;
}
.info-paging p {
  cursor: pointer;
}
.info-paging .selected {
  font-weight: 600;
  color: #124ece;
}


.contact-form input {
  padding: 10px;
}

.contact-form textarea {
  padding: 10px;
}

.code-block {
  padding: 15px;
  background-color: #ededed;
  font-family: 'Nanum Gothic Coding', monospace;
  color: #222;
  display: flex;
  margin-bottom: 5px;
  word-break: break-all;
  white-space: normal;
}

.mall-wrap {
  display: flex;
  width: 100%;
  height: 80px;
  padding: 20px 160px;
  background-color: #f9f9f9;
  gap: 30px;
  justify-content: space-around;
}

.mall-wrap img {
  width: 120px;
  height: auto;
  object-fit: contain;
}

.price-table-wrap {
  width: 100%;
  padding: 10px;
  /* display: flex;
  justify-content: space-around;
  gap: 20px;
  flex-wrap: wrap; */
}

.price-step {
  display: flex;
  flex-grow: 1;
  min-width: 180px;
  flex-direction: column;
  border-radius: 20px;
  box-shadow: 0px 0px 10px 0px #ddd;
}

.price-step h3 {
  display: block;
  width: 100%;
  padding: 30px 10px 20px;
  font-size: 20px;
  font-weight: 500;
  background-color: #2806b8;
  color: #fff;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.price-step h3 > span {
  color: #fff;
  font-size: 16px;
  display: inline-block;
}

.price-step p {
  display: block;
  padding: 20px 10px 30px;
  font-weight: 600;
  margin-bottom: 0;
}

.price-step p > span {
  display: block;
  font-size: 16px;
  font-weight: 500;
  background: linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -webkit-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -moz-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  background: -o-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  -webkit-box-decoration-break: clone;
  clip-path: inset(1px);
}

.mall-list {
  padding: 0 40px;
  display: flex;
  flex-wrap: wrap; 
  width: 100%;
  height: auto; 
}

.mall {
  padding: 30px;
  border-radius: 20px;
  box-shadow: 0px 0px 10px 0px #ddd;
  margin: 15px; 
  text-align: center;
  flex: 1 1 calc(33.333% - 30px); 
  box-sizing: border-box;
  height: 300px;
}
.mall:hover{
  transform: scale(1.1);
  transition: 1.1s;
}
.mall img {
  max-width: 100%; 
  max-height: 100px;
  margin-top: 70px; 
}
.mall h3 {
  font-size: 24px; 
  font-weight: 500;
}

@media (max-width: 1200px) {
  .mall {
    flex: 1 1 calc(50% - 30px); 
  }
}

@media (max-width: 768px) {
  .mall {
    flex: 1 1 100%; 
  }
}

.page-wrap {
  margin-top: 60px;
  width: 100%;
}


.swiper {
  margin-bottom: 20px;
}

.swiper-wrapper {
  transition-timing-function: linear;
}

.swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  /* background-color: #fff; */
  padding: 15px 0;
  font-size: 18px;
  font-weight: bold;
  /* margin-left: 90px; */
}

.swiper-slide img {
  max-width: 150px;
  max-height: 100px;
  display: block;
}
#ere{
  width: 100%;
  height: 100%;
  margin-left: 40px;
  background-color: white;
  box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
.arrow_fu_two>img{
  width: 20px;
  height: 20px;
}


.content-title {
  width: 100%;
  margin: 100px 0;
  /* font-family: 'GmarketSans'; */
  font-size: 36px;
  line-height: 50px;
  text-align: center;
  color: #000;
  font-weight: 600;
}
.content-color-title {
  width: 100%;
  font-size: 16px;
  text-align: center;
  color: #006b3d;
}

.content-title-p{
  text-align: center;
  width: 100%;
  line-height: 50px;
  margin-bottom: 30px;
  font-size: small;
}
.wicircle{
  width: 50px;
  height: 6px;
  background-color: #006b3d;
  margin: 0 auto;
  margin-bottom: 30px;
  margin-top: 80px;
}
.content-title-h5 > h5{
  text-align: center;
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 100px;
}

.content-box-function{
  margin: 0 auto;
  width: 800px;
  height: 300px;
  text-align: center;
  display: flex;
  justify-content: space-around;
  
}
.content-box-function-one{
  background-color: #f2f2f2;
  color: #a6a6a6;
  width: 200px;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: 40px;
}
.content-box-function-two{
  background-color: #f2f2f2;
  color: #a6a6a6;
  width: 200px;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: 40px;
}
.content-box-function-three{
  background-color: #f2f2f2;
  color: #a6a6a6;
  width: 200px;
  height: 100%;
  justify-content: center;
  align-items: center;
  display: flex;
  border-radius: 40px;
}

.long-content-box{
  width: 800px;
  height: 100px;
  margin: 0 auto;
  background-color: #006b3d;
  text-align: center;
  color: white;
  line-height:100px;
  margin-top: 50px;
  margin-bottom: 80px;
  border-radius: 20px;
}
.speciality-management{
  text-align: center;
  font-size:40px;
  margin-top: 30px;
  margin-bottom: 40px;
}
.speciality-management-p>p{
  text-align: center;
  font-size: 20px;
}

.management-hu {
  display: flex;
  justify-content: space-between;
  padding: 20px;
  width: 600px;
  margin: 0 auto;
}
.normal-management {
  border-radius: 8px;
  width: 200px;
  padding: 20px;
  text-align: center;
  position: relative;
}
.normal-management h2 {
  margin: 0;
  font-size: 15px;
  color: #ffffff;
  background-color: #006b3d;
  border-radius: 20px;
  width: 200px;
  line-height: 40px;
  height: 40px;
}
.normal-management_img {
  margin: 20px 0;
  width: 200px;
  height: 300px;
  display: flex;
  align-items: center;
  background-color: #006b3d;
  justify-content: center;
}
.normal-management_img img {
  width: 200px;
  height: 300px;
}
.normal-management p {
  font-size: 14px;
  line-height: 1.7;
  color: #333;
  width: 220px;
  text-align: center;
}
.fuqu {
  position: absolute;
  top: 30px;
  right: -15px;
  width: 20px;
  height: 20px;
  background-color:rgba(196, 223, 169, 1);
  border-radius: 50%;
  color: #fff;
  text-align: center;
  line-height: 20px;
  font-size: 12px;
}
.content-display-flex{
  display: flex;
  margin: 0 auto;
  width: 1000px;
  height: 300px;
  border: 5px solid green;
  position: relative;
}
.arrow{
  margin-top: 80px;
  width: 50px;
  height: 30px;
  font-size: 20px;
  position: absolute;
  left: 200px;
}
.content-box-flex{
  width: 700px;
  height: 100px;
  background-color: #444;
  color: white;
  margin-top: 70px;
  
}
.function_tab_menu {
  display: flex;
  margin-bottom: 20px;
  background-color: #fff;
}

.function_tab_menu .function_list {
  list-style: none;
  padding: 0;
  display: flex;
  margin: 0;
  width: 100%;
  justify-content: center;
}

.function_tab_menu .function_list li {
  margin: 0 10px;
  width: 200px;
  height: 40px;
  text-align: center;
}

.function_tab_menu .function_list li a {
  text-decoration: none;
  color: #FFF;
  padding: 10px 20px;
  display: block;
  border-bottom: none;
  transition: background-color 0.3s, color 0.3s;
}

.function_tab_menu .function_list li.function_is_on a {
  background-color: #064d23;
  border: 1px solid #92c461;
  color: #fff;
}
.function_tab_menu .function_list li:not(.function_is_on) a {
  background-color: #f2f2f2;
  color: #c3c3c3;
  cursor: pointer;
}


.function_cont_area {
  display: none;
  padding: 20px;
  background-color: #fff;
  border-radius: 0 5px 5px 5px;
}

.function_cont_area.active {
  display: block;
}

.function_content-display-flex{
  width: 1000px;
  height: 200px;
  background-color: rgb(255, 255, 255);
  color: white;
  margin: 0 auto;
  border-radius: 20px;
  border: 3px solid green;
  display: flex;
  margin-bottom: 150px;
}
.function_raidus-profile{
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #c2e1fe;
  margin-top: 40px;
  margin-left: 50px;
  border: 3px solid #006b3d ;
}
.fuction_content-box-or{
  background-color: #595959;
  width: 700px;
  height: 140px;
  margin-top: 30px;
  border-radius: 20px;
  position: relative;
}
.function_content-box-flex>h2{
  font-size: 20px;
  font-weight: 700;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 30px;
}
.function_content-box-flex>hr{
  width: 94%;
  color: #000;
  margin: 0 auto;
}
.function_content-box-flex>p{
  position: absolute;
  left: 20px;
  bottom: 20px;
}
/* .content-grid {
  max-width: 1200px;
  margin: 0 auto 100px;
  display: grid;
  grid-template-columns: 1fr 1fr;
} */

/* .content-grid .grid {
  display: flex;
  align-items: center;
  width: 100%;
  padding: 30px;
}

.grid h4 {
  width: 100%;
  font-size: 24px;
  line-height: 28px;
  font-weight: 500;
  color: #000;
  text-align: left;
  margin-bottom: 30px;
}

.grid p {
  font-size: 18px;
  line-height: 30px;
  font-weight: 500;
  color: #111;
  text-align: left;
  
} */

/* .corner-img {
  width: 100%;
  height: 240px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0px 0px 5px 3px #f2f2f2;
} */
.content-grid {
  display: flex;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto 20px;
}

.left-grid, .right-grid {
  flex: 1;
  padding: 10px;
}

.left-grid img, .right-grid img {
  max-width: 100%;
  height: auto;
  border-radius: 5px;
}

.right-grid h4, .right-grid p, .left-grid h4, .left-grid p {
  text-align: left;
}

.left-grid h4, .right-grid h4{
  font-size: 30px;
  font-weight: bold;
}
.left-grid p, .right-grid p{
  font-size: 15px;
  margin-top: 50px;
}

.corner-img {
  width: 100%;
  text-align: center;
}
@media (max-width: 768px) {
  .content-grid {
    flex-direction: column;
    max-width: auto;
  }

  .left-grid, .right-grid {
      text-align: center;
  }
}
.table-wrap {
  padding: 30px 40px;
  width: 1350px;
  white-space: nowrap;
}

.mall-list-table {
  width: 100%;
  border-top: 4px solid #444;
  border-bottom: 4px solid #444;
  border-left: 2px solid white;
  border-right: 2px solid white;
}

.mall-list-table tr {
  border-bottom: 1px solid #ccc;
}

.mall-list-table th {
  border-right: 1px solid #ccc;
  padding: 4px 3px;
  text-align: center;
  background-color: #ededed;
}

.mall-list-table th:last-of-type {
  border-right: none;
}

.mall-list-table td {
  padding: 5px;
  max-width: 80px;
  min-width: 60px;
  text-align: center;
  border-right: 1px solid #ccc;
  
}

.mall-list-table td img {
  max-height: 23px;
  margin: 0 auto;
  display: block;
  vertical-align: middle;
}

.mall-list-table td:last-of-type {
  border-right: none;
}

.mall-list-table tr:nth-of-type(4) td {
  border-top: 2px solid #444;
}

.price-table {
  width: 100%;
  text-align: center;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  overflow: hidden;
}

.price-table thead {
  /* border: 2px solid #222; */
  background: -webkit-linear-gradient(180deg, rgba(40,6,184,1) 0%, rgba(207,0,145,1) 100%);
  color: #fff;
}

.price-table th {
  padding: 10px 0;
  text-align: center;
  border: 1px solid #ddd;
  border-left: none;
  color: #000;
}

.price-table tbody th {
  background-color: #f4f4f4;
}

.price-table td {
  padding: 5px 0;
  text-align: center;
  border: 1px solid #ddd;
  color: #222;
}

.price-table thead th {
  border-right: 2px dashed #eee;
  border-bottom: none;
  border-top: none;
  color: #fff;
  /* border: 1px solid #ddd; */
}

.price-table thead td {
  border: none;
  border-right: 2px dashed #eee;
  color: #fff;
  padding: 10px;
}

.price-table thead td a {
  margin-top: 8px;
  margin-bottom: 3px;
  height: 34px;
  display: block;
  padding: 5px;
  border-radius: 20px;
  background-color: #fff;
  color: rgba(40,6,184,1);
  font-weight: 600;
  box-sizing: border-box;
}

.price-table thead td a:hover {
  background-color: rgba(255, 255, 255, 0.2);
  transition: 0.2s;
  color: #fff;
  border: 1px solid #fff;
}

.management-content {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: auto;
  display: grid;
  align-content: center;
  justify-items: center;
  background: #006b3dab;
  color: #ffffff;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
}
.management-content > .main-title {
  font-size: 50px;
  font-weight: bold;
  line-height: 60px;
  text-align: center;
}
.management-content .sub-title {
  font-size: 18px;
  padding-bottom: 50px;
}

.management-grid-items {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  width: 100%;
}
.management-grid-items .grid-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 50px;
}
.management-grid-items .grid-item .item-title {
  width: 230px;
  align-items: center;
  height: 40px;
  border-radius: 40px;
  background: #fff;
  color: #333;
  display: flex;
  align-items: center;
  justify-content: center;
}
.management-grid-items .grid-item img {
  width: 250px;
  height: 250px;
}
.mainimg:hover .management-grid-items .grid-item img {
  transform: scale(1);
}
.management-grid-items .item-content {
  font-size: 60px;
  color: #FFC000;
  font-weight: bold;
}

.title-dialog {
  background: #92C461;
  margin-top: 50px;
  width: 450px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  border-radius: 50px;
  position: relative;
}
.title-dialog::after {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 8px;
  left: 50%;
  top: 0;
  transform: translate(-50%, -50%) rotate(45deg);
  background: #92C461;
}

.dialog-group {
  position: relative;
  height: 700px;
  margin-bottom: 100px;
  padding: 100px 0;
}
.dialog-group img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.dialog-group .maintext {
  background: transparent;
  position: absolute;
  top: 0;
  left: 0;
}
.dialog-group .dialog-item {
  position: absolute;
  width: 320px;
  height: 120px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 0 10px #2228;
}
/* .dialog-group .dialog-item::after {
  content: "";
  display: block;
  position: absolute;
  width: 10px;
  height: 10px;
  background: #fff;
} */
.dialog-group .title {
  font-size: 20px;
  background: #006b3d;
  color: #fff;
  width: 130px;
  height: 40px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 30px;
  top: -20px;
}
.dialog-group .content {
  color: #333;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  word-break: keep-all;
  text-align: center;
  font-size: 18px;
}

.dialog-group .dialog-item:nth-child(1) {
  right: 150px;
  top: 80px;
  border-bottom-left-radius: 0;
}
/* .dialog-group .dialog-item:nth-child(1)::after {
  left: 2px;
  bottom: 2px;
} */
.dialog-group .dialog-item:nth-child(2) {
  left: 150px;
  top: 180px;
  border-bottom-right-radius: 0;
}
.dialog-group .dialog-item:nth-child(3) {
  right: 150px;
  top: 430px;
  border-top-left-radius: 0;
}
.dialog-group .dialog-item:nth-child(4) {
  left: 150px;
  top: 530px;
  border-top-right-radius: 0;
}

.union_circle {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  width: 800px;
}
.arrow_fu_two>img{
  margin: 0 auto;
  display: flex;
}
.circle1 {
  position: relative;
  width: 200px;
  height: 200px;
  border-radius: 50%;
  background-color: green;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  margin: 0 auto;
  text-align: center;
  font-size: 30px;
}

.circle1::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle, #92C461, #4D8F37 75%);
  border-radius: 50%;
  color: #5c9b40;
}

.circle1>h2 {
  z-index: 99;
}

.union_circle_under {
  text-align: center;
  height: 200px;
  margin-top: 100px;
  font-weight: 800;
  font-size: 35px;
  line-height: 45px;
}

.i2sell_text_p {
  text-align: center;
  font-size: 20px;
  margin-bottom: 50px;
}

.flex_image_is {
  width: 100%;
  height: auto;
}
.flex_image_is_background {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #fffa;
}
.flex_image_is_item {
  width: 100%;
  height: 400px;
  text-align: center;
  position: relative;
}
.flex_image_is img{
  width: 100%;
  height: 400px;
  object-fit: cover;
}
.flex_image_is_item h2 {
  font-size: 50px;
  position: absolute;
  top: 80px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  line-height: 55px;
}

.flex_image_is_item p {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 70%);
}

.green {
  color: green;
}
.green_s{
  color: green;
  font-size: 25px;
  margin-bottom: 30px;
}

.hurry {
  width: 100%;
  height: 200px;
  text-align: center;
  margin-top: 80px;
  font-size: 50px;
  line-height: 50px;
}


@media (max-width: 1023px) {
  .bottom-contact-title {
    font-size: 30px;
  }
  .bottom-contact-button {
    min-width: 180px;
    padding: 6px 50px;
    font-size: 20px;
  }
  .main-list {
    font-size: 25px;
    gap: 20px;
  }
  .grid-4-items {
    grid-template-columns: 1fr 1fr;
  }
  .grid-tab {
    font-size: 18px;
  }
  .dfecm-new-circle-list {
    padding: 50px 5px 30px;
  }
}
@media (max-width: 756px) {
  .tpam-grid .item {
    font-size: 16px;
    grid-template-columns: 250px 110px 50px;
    gap: 20px;
  }
  .tpam-grid .word {
    font-size: 20px;
  }
  .tpam-grid .word span {
    font-size: 23px;
  }
  .dfecm-new-circle-list .dfecm-new-item {
    width: 120px;
    height: 120px;
  }
  .dfecm-new-circle-list .dfecm-new-item-contents {
    font-size: 20px;
  }
  .dfecm-new-circle-list .dfecm-new-item-contents .small-font-size {
    font-size: 18px;
  }
}
@media (max-width: 605px) {
  .dfecm-new-circle-list {
    flex-wrap: wrap;
  }
  .dfecm-new-circle-list .dfecm-new-item {
    margin: 10px 20px;
  }
}