/* ==============================================
   PAGES.CSS
   SeeChart Homepage 페이지별 고유 스타일
   ============================================== */


/* ======================================================================
   INDEX (메인 홈) — common.css 기반
   ====================================================================== */

/* 메인 히어로 슬라이드 래퍼 (서비스 페이지 .slide 와 충돌 방지) */
body.page-index .slide {
  position: absolute;
  z-index: -1;
}

.swiper-container { height: 590px; }

.news_letter_title {
  width: 100%;
  height: 30px;
  background: url(../img/news_letter.png) no-repeat 0 0;
  margin-bottom: 30px;
}

.swiper-container2 { margin-bottom: 50px !important; }
.swiper-container2 > .swiper-wrapper { transform: translate() !important; }
.swiper-container2 > .swiper-wrapper > .swiper-slide { position: relative; }

.swiper-container2 > .swiper-wrapper > .swiper-slide > div {
  width: 100%;
  height: 300px !important;
  background-size: cover;
  cursor: pointer;
}

.swiper-container2 > .swiper-wrapper > .swiper-slide .slide01 { background: url(../img/news04.png) no-repeat 50% 0; background-size: cover; }
.swiper-container2 > .swiper-wrapper > .swiper-slide .slide02 { background: url(../img/news05.png) no-repeat 50% 0; background-size: cover; }
.swiper-container2 > .swiper-wrapper > .swiper-slide .slide03 { background: url(../img/news06.png) no-repeat 50% 0; background-size: cover; }
.swiper-container2 > .swiper-wrapper > .swiper-slide .slide04 { background: url(../img/news01.png) no-repeat 50% 0; background-size: cover; }
.swiper-container2 > .swiper-wrapper > .swiper-slide .slide05 { background: url(../img/news02.png) no-repeat 50% 0; background-size: cover; }
.swiper-container2 > .swiper-wrapper > .swiper-slide .slide06 { background: url(../img/news03.png) no-repeat 50% 0; background-size: cover; }

.swiper-container2 > .swiper-wrapper > .swiper-slide > span {
  font-family: 'NotoSansKR-Regular';
  position: absolute;
  left: 16%;
  bottom: 0;
}

.gray_bg {
  width: 100%;
  height: 230px;
  position: absolute;
  bottom: -50px;
  background: #f8f8f8;
  z-index: -1;
}

.swiper-container .swiper-slide .text_inner {
  width: 1400px;
  margin: 0 auto;
}

.swiper-container .swiper-slide .text_inner #text_box01,
.swiper-container .swiper-slide .text_inner #text_box02,
.swiper-container .swiper-slide .text_inner #text_box03,
.swiper-container .swiper-slide .text_inner #text_box04 {
  position: absolute;
  transform: translate(0%, 140%);
  text-align: left;
}

.swiper-container .swiper-slide .text_inner #text_box01 p,
.swiper-container .swiper-slide .text_inner #text_box02 p,
.swiper-container .swiper-slide .text_inner #text_box03 p,
.swiper-container .swiper-slide .text_inner #text_box04 p {
  font-size: 42px;
  font-weight: 600;
  color: #fff;
  line-height: 1.3em;
  text-shadow: 0.5px 1px 1px #555;
}

.swiper-container .swiper-slide .text_inner #text_box01 span,
.swiper-container .swiper-slide .text_inner #text_box02 span,
.swiper-container .swiper-slide .text_inner #text_box03 span,
.swiper-container .swiper-slide .text_inner #text_box04 span {
  display: block;
  font-size: 20px;
  color: #fff;
  margin-top: 20px;
}

/* 슬라이드 텍스트 애니메이션 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box01 p,
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box01 span {
    animation: text 1.2s 0.2s both;
  }
  @keyframes text {
    0% { opacity: 0; transform: translateY(50px); }
    100% { opacity: 1; transform: translateY(0); }
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box02 p,
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box02 span {
    animation: text2 1.2s 0.2s both;
  }
  @keyframes text2 {
    0% { opacity: 0; transform: translateY(50px); }
    100% { opacity: 1; transform: translateY(0); }
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box03 p,
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box03 span {
    animation: text3 1.2s 0.2s both;
  }
  @keyframes text3 {
    0% { opacity: 0; transform: translateY(50px); }
    100% { opacity: 1; transform: translateY(0); }
  }
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box04 p,
  .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box04 span {
    animation: text4 1.2s 0.2s both;
  }
  @keyframes text4 {
    0% { opacity: 0; transform: translateY(50px); }
    100% { opacity: 1; transform: translateY(0); }
  }
}

/* 페이지네이션 */
.swiper-container .swiper-pagination .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  background: #ffffff;
  position: relative;
  opacity: 1;
}

.swiper-container .swiper-pagination {
  text-align: left;
  position: relative;
  margin: 0 auto;
  top: -60px;
}

.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 1400px !important;
  margin: 0 auto;
}

.swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  top: 5px;
  width: 18px;
  height: 20px;
  background: url(../img/haxagon.png) no-repeat 0px 3px;
  opacity: 1;
}

/* content01_area (메인 3단 배너) — index 전용 */
body.page-index .container .content01_area {
  width: 100%;
  height: 100px;
  margin-top: 30px;
  background-color: #bc1225;
  border-radius: 15px;
  overflow: hidden;
}

body.page-index .container .content01_area dl {
  float: left;
  width: 33.33%;
  margin-top: 1.5em;
  color: #fff;
  background: url(../img/bar.png) no-repeat 0 50%;
  cursor: pointer;
}

body.page-index .container .content01_area dl dt {
  float: left;
  margin-top: 10px;
  margin-left: 25%;
}

body.page-index .container .content01_area dl dt img { transition: all 0.3s linear; }

body.page-index .container .content01_area dl dd {
  float: left;
  display: contents;
  text-align: left;
}

body.page-index .container .content01_area dl dd p { font-size: 20px; margin-left: 35%; }
body.page-index .container .content01_area dl dd .small_p { font-size: 15px; }
body.page-index .container .content01_area dl:hover dd .small_p { text-decoration: underline; }
body.page-index .container .content01_area dl:hover dt img { transform: rotateY(180deg); }

/* content02_area (메인 카드 그리드) */
.container .content02_area {
  grid-template-columns: repeat(auto-fill, minmax(32%, 1fr));
  grid-gap: 20px;
  display: grid;
  margin-top: 30px;
  margin-bottom: 80px;
}

.container .content02_area .t-content {
  display: block;
  width: 450px;
  height: 320px;
  border-radius: 15px;
  box-shadow: 0px 0px 8px #ddd;
}

.container .content02_area .t-content table { width: 100%; height: 100%; }

.container .content02_area .t-content table tbody tr td {
  vertical-align: middle;
  cursor: pointer;
}

.container .content02_area .t-content table tbody tr td span {
  display: block;
  font-size: 21px;
  margin-top: 10%;
  color: #111111;
}

.container .content02_area .t-content:hover table tbody tr td span { color: #bc1225; }

.container .content02_area .t-content .t-content_span {
  font-family: 'NotoSansKR-Regular';
  font-size: 22px;
  font-weight: 600;
  color: #bc1225;
  margin: 3% 0 2% 0;
}

.container .content02_area .t-content .t-content_p {
  font-family: 'NotoSansKR-Regular';
  font-size: 17px;
  font-weight: 600;
  color: #111;
}

.container .content02_area .t-content table tbody tr td img { transition: all 0.2s ease-in-out; }
.container .content02_area .t-content:hover table tbody tr td img { transform: scale(1.05); }

.container .content02_area .t-content table tbody tr td em {
  font-size: 12px;
  color: #666;
  line-height: 1.2rem;
  display: block;
  margin: 10px 0;
}


/* ======================================================================
   SUB01 — 회사 소개 (sub01_01.html)
   ====================================================================== */

.bg_content .bg_area.sub01_bg,
body.page-sub01 .bg_content .bg_area {
  background: url(../img/company/sub_bg.png) no-repeat 0 0;
  background-size: cover;
}

.container .content01_area.about_area,
body.page-sub01 .container .content01_area {
  padding: 70px 0 200px 0;
  text-align: left;
  width: auto;
  height: auto;
  margin-top: 0;
  background-color: transparent;
  border-radius: 0;
}

.container .content01_area.about_area b,
body.page-sub01 .container .content01_area b {
  display: block;
  font-size: 35px;
  font-weight: 600;
  margin-bottom: 40px;
}

.container .content01_area.about_area p,
body.page-sub01 .container .content01_area p {
  font-size: 17px;
  text-align: justify;
  letter-spacing: -0.1px;
  color: #666;
}


/* ======================================================================
   SUB02 — 서비스 소개 (sub02_XX.html)
   ====================================================================== */

.bg_content .bg_area.sub02_bg,
body.page-sub02 .bg_content .bg_area {
  background: url(../img/service/sub_bg.png) no-repeat 0 0;
  background-size: cover;
}

/* 앵커 메뉴 */
.ank_menu {
  color: #fff;
  background: rgba(51, 51, 51, 0.5);
  position: absolute;
  width: 100%;
  height: 50px;
  bottom: 0;
  z-index: 9;
}

.ank_menu .ank_inner {
  width: 1400px;
  margin: 0 auto;
}

.ank_menu .ank_inner .ank_inner_content {
  width: 385px;
  overflow: hidden;
  cursor: pointer;
}

.ank_menu .ank_inner .ank_inner_content p {
  font-size: 15px;
  width: 308px;
  height: 50px;
  border-left: 1px solid #777;
  border-right: 1px solid #777;
  padding-left: 20px;
  line-height: 3.2em;
  text-align: left;
  display: inline-block;
  float: left;
}

.ank_menu .ank_inner .ank_inner_content img {
  border-right: 1px solid #777;
  float: left;
  padding: 22px 20px;
}

.ank_sub {
  position: absolute;
  z-index: 0;
  width: 100%;
  top: 600px;
}

.ank_sub .ank_sub_inner {
  width: 1400px;
  margin: 0 auto;
}

.ank_sub .ank_sub_inner ul {
  width: 363px;
  height: 100%;
}

.ank_sub .ank_sub_inner ul li {
  border: 1px solid #ccc;
  background: #fff;
  color: #666;
  border-bottom: none;
  width: 100%;
  height: 50px;
  line-height: 3.2em;
  padding-left: 20px;
  text-align: left;
  cursor: pointer;
}

.ank_sub .ank_sub_inner ul li:hover { background: #eeeeee; }
.ank_sub .ank_sub_inner ul li:first-child { border-top: none; }
.ank_sub .ank_sub_inner ul li:last-child { border-bottom: 1px solid #ccc; }

/* 서비스 콘텐츠 영역 */
.container .content01_area.service_area,
body.page-sub02 .container .content01_area {
  padding: 100px 0;
  text-align: left;
  display: inline-block;
  width: auto;
  height: auto;
  margin-top: 0;
  background-color: transparent;
  border-radius: 0;
}

.container .service_text_area {
  float: left;
  width: 700px;
}

.container .content01_area.service_area b,
body.page-sub02 .container .content01_area b {
  display: block;
  font-size: 35px;
  font-weight: 600;
  color: #bc1225;
}

.container .content01_area.service_area span,
body.page-sub02 .container .content01_area span {
  font-size: 15px;
  margin-bottom: 40px;
  color: #aaa;
  display: block;
}

.container .content01_area.service_area p,
body.page-sub02 .container .content01_area p {
  font-size: 17px;
  text-align: justify;
  letter-spacing: -0.1px;
  color: #666;
}

.container .content01_area .service_img_area {
  float: right;
  margin-top: -80px;
}

.container .content01_area .service_img_area img {
  display: block;
  margin: 10px auto 70px 0;
}

.container .content01_area .service_content_area {
  width: -webkit-fill-available;
  display: flex;
  float: left;
  overflow: hidden;
}

.container .content01_area .service_content_area .s-inner01 {
  width: 100%;
  border: 1px solid #ddd;
  border-right: none;
  padding: 50px;
}

.container .content01_area .service_content_area .s-inner01 span {
  display: block;
  font-size: 20px;
  font-weight: 600;
  color: #333;
  margin-bottom: 20px;
}

.container .content01_area .service_content_area .s-inner01 ul li {
  color: #666;
  line-height: 1.2em;
  background: url(../img/service/dot.png) no-repeat 0 50%;
  padding-left: 10px;
  margin: 10px 0;
}

.container .content01_area .service_content_area .s-inner02 {
  width: 100%;
  border: 1px solid #ddd;
  padding: 50px;
}

.container .content01_area .service_content_area .s-inner02 span {
  display: block;
  font-size: 20px;
  font-weight: 600;
  color: #333;
  margin-bottom: 20px;
}

.container .content01_area .service_content_area .s-inner02 ul li {
  color: #666;
  line-height: 1.8em;
  background: url(../img/service/dot.png) no-repeat 0 50%;
  padding-left: 10px;
}

/* 서비스 슬라이드 (모니터 이미지) */
body.page-sub02 .slide,
.slide.service_slide {
  position: relative;
  overflow: hidden;
  width: 580px;
  height: 410px;
  margin-top: -30px;
  margin-bottom: 50px;
  float: right;
  right: -60px;
  z-index: 1;
}

body.page-sub02 .slide .panel,
.slide.service_slide .panel {
  position: relative;
  width: 100%;
  height: 100%;
}

body.page-sub02 .slide .panel > li,
.panel > li {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

.panel li p {
  position: absolute;
  color: #fff;
  top: 200px;
  left: 10%;
  animation-name: banner_txt1;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-direction: alternate;
  animation-fill-mode: forwards;
}

.panel li .banner_text.on {
  position: absolute;
  left: 0;
  color: #fff;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-direction: alternate;
  animation-fill-mode: forwards;
}

.panel .banner1  { background: url(../img/service/s01.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner2  { background: url(../img/service/s01_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner3  { background: url(../img/service/s02.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner4  { background: url(../img/service/s02_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner5  { background: url(../img/service/s03.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner6  { background: url(../img/service/s03_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner7  { background: url(../img/service/s04.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner8  { background: url(../img/service/s04_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner9  { background: url(../img/service/s04_02.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner10 { background: url(../img/service/s05.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner11 { background: url(../img/service/s05_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner12 { background: url(../img/service/s06.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner13 { background: url(../img/service/s06_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner14 { background: url(../img/service/s09.png)    no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner15 { background: url(../img/service/s09_01.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner16 { background: url(../img/service/s09_02.png) no-repeat 50% 0; height: -webkit-fill-available; }
.panel .banner17 { background: url(../img/service/s08.png)    no-repeat 50% 30%; background-size: auto; height: -webkit-fill-available; }
.panel .banner18 { background: url(../img/service/s08_01.png) no-repeat 50% 30%; background-size: auto; height: -webkit-fill-available; }
.panel .banner19 { background: url(../img/dingdong/01.png)    no-repeat 50% 0%; background-size: contain; height: -webkit-fill-available; }
.panel .banner20 { background: url(../img/dingdong/02.png)    no-repeat 50% 0%; background-size: contain; height: -webkit-fill-available; }
.panel .banner21 { background: url(../img/dingdong/03.png)    no-repeat 50% 0%; background-size: contain; height: -webkit-fill-available; }
.panel .banner22 { background: url(../img/dingdong/04.png)    no-repeat 50% 0%; background-size: contain; height: -webkit-fill-available; }
.panel .banner23 { background: url(../img/dingdong/05.png)    no-repeat 50% 0%; background-size: contain; height: -webkit-fill-available; }

.dot {
  position: absolute;
  right: 47%;
  bottom: 0;
  transform: translateX(-10%);
}

.dot > li {
  float: left;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background-color: #aaa;
  margin-left: 5px;
  text-indent: -9999px;
  cursor: pointer;
}

.dot > li.on { background-color: #000; }

.prev1 img { position: absolute; top: 35%; left: 0; cursor: pointer; }
.next1 img { position: absolute; top: 35%; right: 0; cursor: pointer; }

.store_bt { margin-top: 30px; }
.store_bt > .google_bt { width: 165px; margin-right: 10px; cursor: pointer; }
.store_bt > .app_bt { width: 165px; cursor: pointer; }


/* ======================================================================
   SUB03 — 온라인 신청 (sub03_01.html)
   ====================================================================== */

.bg_content .bg_area.sub03_bg,
body.page-sub03 .bg_content .bg_area {
  background: url(../img/online/sub_bg.png) no-repeat center center;
  background-size: cover;
}

/* sub03은 폼 페이지라 배너를 더 compact하게 */
body.page-sub03 .bg_content {
  height: 340px;
}
body.page-sub03 .bg_content .bg_area {
  height: 340px;
}

/* step box */
.container .step_box {
  text-align: center;
  margin-top: 40px;
  display: inline-flex;
  overflow: hidden;
}

.container .step_box .step {
  width: 150px;
  margin: 0 5px;
  float: left;
  padding: 12px 35px;
  border: 1px solid #ddd;
}

.container .step_box .step.active,
.container .step_box .step.on {
  border: 1px solid #bc1225;
  background: #bc1225;
  border-radius: 30px;
}

.container .step_box .step.on span,
.container .step_box .active > span { color: #fff; }

.container .step_box > div > span {
  font-size: 15px;
  color: #a0a0a0;
  cursor: default;
}

/* 공통 step area */
.container .step01_area,
.container .step02_area,
.container .step03_area,
.container .step04_area,
.container .step05_area {
  padding: 90px 0;
  text-align: left;
}

/* plus_text */
.container .step01_area .plus_text,
.container .step02_area .plus_text,
.container .step03_area .plus_text {
  margin-bottom: 20px;
  text-align: center;
  background: #f8f8f8;
  overflow: hidden;
}

.container .step01_area .plus_text p,
.container .step02_area .plus_text p,
.container .step03_area .plus_text p {
  font-size: 15px;
  color: #888888;
  margin: 20px auto;
}

/* hospital_kind (step01 선택) */
.container .step01_area .hospital_kind {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(15%, 1fr));
  gap: 10px;
  align-items: stretch;
}

.container .step01_area .hospital_kind .t-hospital {
  position: relative;
  display: block;
  text-align: center;
  overflow: hidden;
  opacity: 1;
}

.container .step01_area .hospital_kind .t-hospital img {
  display: block;
  margin: 16px auto 8px;
  position: static;
  transform: none;
}

.container .step01_area .hospital_kind .t-hospital span {
  display: block;
  font-size: 14px;
  margin-top: 6px;
  color: #333333;
}

/* hospital_checkbox */
.hospital_checkbox[type='checkbox'] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.hospital_checkbox[type='checkbox'] + label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  color: #666;
  width: 100%;
  height: 130px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 12px 8px;
}

.hospital_checkbox[type='checkbox'] + label:hover { border: 1px solid #bc1225; }

.hospital_checkbox[type='checkbox'] + label:before {
  content: ' ';
  display: none;
  width: 16px;
  height: 16px;
  line-height: 21px;
  margin: -2px 5px 0 0;
  vertical-align: middle;
  border: 1px solid #666;
  border-radius: 3px;
}

/* 버튼 공통 */
.container .step01_area .hospital_next,
.container .step02_area .hospital_next,
.container .step03_area .hospital_next,
.container .step04_area .hospital_next,
.container .step05_area .hospital_next {
  text-align: center;
  margin-top: 50px;
}

.next_bt, .next_bt2, .next_bt3, .next_bt4, .next_bt5, .next_bt6,
.prev_bt, .prev_bt2, .prev_bt3 {
  font-family: 'NotoSansKR-Regular';
  display: inline-block;
  font-size: 17px;
  padding: 10px 80px;
  cursor: pointer;
}

.next_bt { border: 1px solid #ccc; background-color: #ccc; color: #fff; cursor: default; }
.next_bt2, .next_bt3, .next_bt4, .next_bt5, .next_bt6 {
  border: 1px solid #bc1225;
  background-color: #bc1225;
  color: #fff;
  cursor: pointer;
}

.prev_bt, .prev_bt2, .prev_bt3 {
  border: 1px solid #bbb;
  background-color: #fff;
  font-weight: 500;
  color: #bbb;
}

.next_bt3, .next_bt4 { margin-left: 5px; }
.next_bt5 { padding: 10px 60px; margin-left: 5px; }

/* step02 room */
.container .step02_area .hospital_room {
  border: 1px solid #ddd;
  height: 480px;
  padding: 50px;
}

.container .step02_area .hospital_room table tr td ul {
  width: 320px;
  background: url(../img/online/bar.png) no-repeat 100% 50%;
  overflow: hidden;
}

.container .step02_area .hospital_room table tr td .last_ul { background: none; }
.container .step02_area .hospital_room table tr td ul li { margin: 30px 0; }

.container .step02_area .hospital_room table tr td ul li div .allcount {
  width: 75px;
  height: 41px;
  border: 1px solid #ddd;
  color: #333;
  font-size: 16px;
  text-align: center;
  margin: -4.5px;
  vertical-align: middle;
}

.container .step02_area .hospital_room table tr td ul li div .m_bt {
  width: 45px;
  height: 45px;
  border: 1px solid #ddd;
  background: url(../img/online/m_bt.png) no-repeat 50% 50%;
  cursor: pointer;
  vertical-align: middle;
}

.container .step02_area .hospital_room table tr td ul li div .p_bt {
  width: 46px;
  height: 45px;
  border: 1px solid #ddd;
  background: url(../img/online/p_bt.png) no-repeat 50% 50%;
  cursor: pointer;
  vertical-align: middle;
  border-left: none;
}

.container .step02_area .hospital_room .room_inner01 table { width: 100%; height: 80px; }
.container .step02_area .hospital_room .room_inner01 table tr th { font-size: 17px; font-weight: 600; color: #333; }
.container .step02_area .hospital_room .room_inner01 table tr td { font-size: 16px; color: #666; }

.container .step02_area .hospital_room .room_inner02 table {
  width: 100%;
  height: 290px;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding-top: 50px;
}

.container .step02_area .hospital_room .room_inner02 table tr th {
  width: 200px;
  font-size: 17px;
  font-weight: 600;
  color: #333;
  padding-top: 50px;
}

.container .step02_area .hospital_room .room_inner02 table tr td { font-size: 16px; color: #666; }
.container .step02_area .hospital_room .room_inner02 table tr td .count_box { display: inline; }

.container .step02_area .hospital_room .room_inner02 table tr td span {
  width: 100px;
  font-size: 16px;
  color: #666;
  vertical-align: middle;
  display: inline-block;
}

.container .step02_area .hospital_room .room_inner03 table { width: 100%; height: 80px; }
.container .step02_area .hospital_room .room_inner03 table tr th { font-size: 17px; font-weight: 600; color: #333; padding-top: 50px; }
.container .step02_area .hospital_room .room_inner03 table tr td { font-size: 16px; color: #666; }
.container .step02_area .hospital_room .room_inner03 table tr td b { display: block; }
.container .step02_area .hospital_room .room_inner03 table tr td .allplus { text-decoration: underline; }

.room_all { float: right; font-weight: 600; color: #bc1225; margin-right: 100px; }

/* step03 item */
.container .step03_area .hospital_item {
  border: 1px solid #ddd;
  height: 360px;
  padding: 50px;
}

.container .step03_area .hospital_item ul { overflow: hidden; }
.container .step03_area .hospital_item ul li { margin: 10px 0; font-size: 16px; }

.container .step03_area .hospital_item .room_inner01 table { width: 100%; height: 150px; }
.container .step03_area .hospital_item .room_inner01 table tr th { font-size: 17px; font-weight: 600; color: #333; }
.container .step03_area .hospital_item .room_inner01 table tr td { font-size: 16px; color: #666; }

.container .step03_area .hospital_item .room_inner02 table {
  width: 100%;
  height: 130px;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  padding-top: 50px;
}

.container .step03_area .hospital_item .room_inner02 table tr th {
  width: 200px;
  font-size: 17px;
  font-weight: 600;
  color: #333;
  padding-top: 50px;
}

.container .step03_area .hospital_item .room_inner02 table tr td { font-size: 16px; color: #666; }
.container .step03_area .hospital_item .room_inner02 table tr td span { font-size: 16px; color: #666; display: inline-block; }
.container .step03_area .hospital_item .room_inner03 table { width: 100%; height: 100px; }
.container .step03_area .hospital_item .room_inner03 table tr th { font-size: 17px; font-weight: 600; color: #333; padding-top: 50px; }
.container .step03_area .hospital_item .room_inner03 table tr td { font-size: 16px; color: #666; }
.container .step03_area .hospital_item .room_inner03 table tr td b { display: block; }

/* item_checkbox */
.container .step03_area table tbody tr td .item_checkbox[type='checkbox'] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

.container .step03_area table tbody tr td .item_checkbox[type='checkbox'] + label {
  display: inline-block;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  color: #666;
  margin-bottom: 5px;
}

.container .step03_area table tbody tr td .item_checkbox[type='checkbox'] + label:before {
  content: ' ';
  display: inline-block;
  width: 16px;
  height: 16px;
  line-height: 21px;
  margin: -3px 5px 0 0;
  text-align: center;
  vertical-align: middle;
  border: 1px solid #666;
  border-radius: 3px;
}

.container .step03_area table tbody tr td .item_checkbox[type='checkbox']:checked + label:before {
  content: "\2713";
  font-size: 14px;
  font-weight: 800;
  color: #bc1225;
  text-align: center;
  line-height: 15px;
  border: 1px solid #bc1225;
}

.container .step03_area table tbody tr td .item_checkbox[type='checkbox']:checked + label span { color: #bc1225; }

/* step04 information */
.container .step04_area .hospital_imformation {
  border: 1px solid #ddd;
  padding: 50px;
  overflow: hidden;
}

.container .step04_area .hospital_imformation .room_inner01 {
  float: left;
  width: 50%;
  height: 300px;
  margin-bottom: 40px;
  background: url(../img/online/bar2.png) no-repeat 100% 0;
}

.container .step04_area .hospital_imformation .room_inner01 table { width: 100%; height: 300px; }
.container .step04_area .hospital_imformation .room_inner01 table tbody tr th { font-size: 17px; }

.container .step04_area .hospital_imformation .room_inner01 table tbody tr td select {
  font-size: 14px;
  width: 200px;
  height: 49px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: url("../img/online/arrow.png") no-repeat 90% center;
}

.container .step04_area .hospital_imformation .room_inner01 table tbody tr td span { font-size: 14px; color: #666; display: block; }

.container .step04_area .hospital_imformation .room_inner01 table tbody tr td input,
.container .step04_area .hospital_imformation .room_inner02 table tbody tr td input {
  font-size: 14px;
  width: 250px;
  height: 45px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.container .step04_area .hospital_imformation .room_inner01 table tbody tr td #datepicker {
  background: url(../img/online/date.png) no-repeat 95% center;
}

#ui-datepicker-div { width: 260px !important; }

.container .step04_area .hospital_imformation .room_inner01 table tbody tr td input::placeholder,
.container .step04_area .hospital_imformation .room_inner02 table tbody tr td input::placeholder { color: #999; }

.container .step04_area .hospital_imformation .room_inner02 {
  float: left;
  width: 50%;
  height: 300px;
}

.container .step04_area .hospital_imformation .room_inner02 table { width: 100%; height: 300px; }
.container .step04_area .hospital_imformation .room_inner02 table tbody tr th { font-size: 17px; padding-left: 40px; }

.container .step04_area .hospital_imformation .room_inner02 table tbody tr td select {
  font-size: 14px;
  width: 80px;
  height: 49px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: url("../img/online/arrow.png") no-repeat 85% center;
}

.container .step04_area .hospital_imformation .room_inner02 table tbody tr td span { font-size: 14px; color: #666; display: block; }

.container .step04_area .hospital_imformation .room_inner03 { width: 100%; float: left; }
.container .step04_area .hospital_imformation .room_inner03 table { width: 100%; }
.container .step04_area .hospital_imformation .room_inner03 table tbody tr th { font-size: 17px; vertical-align: middle; }

.container .step04_area .hospital_imformation .room_inner03 table tbody tr td textarea {
  font-family: 'NotoSansKR-Regular';
  width: 98%;
  height: 130px;
  text-align: left;
  color: #999;
  padding: 10px 15px;
}

.container .step04_area .hospital_imformation .room_inner03 table tbody tr td textarea::placeholder { color: #aaa; }
.container .step04_area .hospital_imformation .room_inner03 table tbody tr td textarea:focus { outline: none; }

.container .step04_area .hospital_imformation .info_box {
  width: 100%;
  float: left;
  text-align: center;
  margin: 30px auto -10px auto;
}

/* step05 finish */
.container .step05_area .hospital_finish {
  border: 1px solid #ccc;
  width: 100%;
  height: 550px;
  background: #fafafa;
  text-align: center;
  padding-bottom: 30px;
}

.container .step05_area .hospital_finish img { text-align: center; margin: 100px auto; }
.container .step05_area .hospital_finish p { font-size: 22px; font-weight: 600; margin-bottom: 20px; color: #333; }
.container .step05_area .hospital_finish span { font-size: 15px; display: block; color: #666; }
.next_bt6 { padding: 10px 80px; }


/* ======================================================================
   SUB04 — 고객 지원 / 상담 (sub04_XX.html)
   ====================================================================== */

.bg_content .bg_area.sub04_bg,
body.page-sub04 .bg_content .bg_area {
  background: url(../img/help/sub_bg.png) no-repeat 0 0;
  background-size: cover;
}

.container .help_area {
  padding: 40px 0 100px 0;
  text-align: left;
}

.container .help_area .hospital_imformation {
  border: 1px solid #ddd;
  padding: 50px;
  overflow: hidden;
}

.container .help_area .hospital_imformation .room_inner01 {
  float: left;
  width: 50%;
  height: 135px;
  margin-bottom: 40px;
  background: url(../img/online/bar2.png) no-repeat 100% 0;
}

.container .help_area .hospital_imformation .room_inner01 table { width: 100%; height: 100px; }
.container .help_area .hospital_imformation .room_inner01 table tbody tr th { font-size: 17px; }

.container .help_area .hospital_imformation .room_inner01 table tbody tr td select {
  font-family: 'NotoSansKR-Regular';
  font-size: 14px;
  width: 93.5%;
  height: 49px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: url("../img/online/arrow.png") no-repeat 95% center;
}

.container .help_area .hospital_imformation .room_inner01 table tbody tr td span { font-size: 14px; color: #666; display: block; }

.container .help_area .hospital_imformation .room_inner01 table tbody tr td input {
  font-size: 14px;
  width: 250px;
  height: 45px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.container .help_area .hospital_imformation .room_inner01 table tbody tr td input::placeholder { color: #999; }

.container .help_area .hospital_imformation .room_inner02 {
  float: left;
  width: 50%;
  height: 175px;
}

.container .help_area .hospital_imformation .room_inner02 table { width: 100%; }
.container .help_area .hospital_imformation .room_inner02 table tbody tr th { font-size: 17px; padding-left: 40px; }

.container .help_area .hospital_imformation .room_inner02 table tbody tr td select {
  font-family: 'NotoSansKR-Regular';
  font-size: 14px;
  width: 80px;
  height: 49px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
  background: url("../img/online/arrow.png") no-repeat 85% center;
}

.container .help_area .hospital_imformation .room_inner02 table tbody tr td span { font-size: 14px; color: #666; display: block; }

.container .help_area .hospital_imformation .room_inner02 table tbody tr td input {
  font-size: 14px;
  width: 250px;
  height: 45px;
  margin-bottom: 5px;
  padding-left: 15px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.container .help_area .hospital_imformation .room_inner02 table tbody tr td input::placeholder { color: #999; }

.container .help_area .hospital_imformation .room_inner03 { width: 100%; float: left; }
.container .help_area .hospital_imformation .room_inner03 table { width: 100%; }
.container .help_area .hospital_imformation .room_inner03 table tbody tr th { font-size: 17px; vertical-align: middle; }

.container .help_area .hospital_imformation .room_inner03 table tbody tr td textarea {
  font-family: 'NotoSansKR-Regular';
  width: 98%;
  height: 130px;
  text-align: left;
  color: #999;
  padding: 10px 15px;
}

.container .help_area .hospital_imformation .room_inner03 table tbody tr td textarea::placeholder { color: #aaa; }
.container .help_area .hospital_imformation .room_inner03 table tbody tr td textarea:focus { outline: none; }

.container .help_area .hospital_imformation .info_box { width: 100%; float: left; text-align: center; margin: 30px auto -10px auto; }
.container .help_area .hospital_next { margin-top: 50px; text-align: center; }
.container .help_area .hospital_next .next_bt { padding: 10px 60px; margin-left: 5px; }


/* ======================================================================
   SUB05 — 컨설팅 선택 (sub05_01.html)
   ====================================================================== */

.bg_content .bg_area.sub05_bg,
body.page-sub05 .bg_content .bg_area {
  background: url(../img/help/sub_bg2.png) no-repeat 0 0;
  background-size: cover;
}

.container .consulting_area {
  font-family: 'NotoSansKR-Regular';
  padding: 100px 0;
  text-align: left;
  overflow: hidden;
}

.container .consulting_area .consulting_imformation {
  width: 1315px;
  text-align: center;
  margin: 0 auto;
}

.container .consulting_area .consulting_imformation .room_inner01 { width: 100%; float: left; padding-top: 10px; }

.container .consulting_area .consulting_imformation .room_inner01 .ico_box01,
.container .consulting_area .consulting_imformation .room_inner01 .ico_box02 {
  width: 630px;
  height: 450px;
  border: none;
  border-radius: 25px;
  box-shadow: 0px 10px 50px #ddd;
  line-height: 1.8em;
}

.container .consulting_area .consulting_imformation .room_inner01 .ico_box01 {
  margin-left: 10px;
  float: left;
}

.container .consulting_area .consulting_imformation .room_inner01 .ico_box02 {
  margin-right: 10px;
  float: right;
  box-shadow: 0px 5px 30px #ddd;
}

.container .consulting_area .consulting_imformation .room_inner01 .ico_box01 img,
.container .consulting_area .consulting_imformation .room_inner01 .ico_box02 img { margin: 100px 0 70px 0; }

.container .consulting_area .consulting_imformation .room_inner01 .ico_box01 p,
.container .consulting_area .consulting_imformation .room_inner01 .ico_box02 p { font-size: 22px; font-weight: 600; }

.container .consulting_area .consulting_imformation .room_inner01 .ico_box01 span,
.container .consulting_area .consulting_imformation .room_inner01 .ico_box02 span { font-size: 22px; font-weight: 600; color: #bc1225; }

.container .consulting_area .consulting_imformation .room_inner02 { width: 100%; margin-top: 30px; float: left; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box04,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 {
  font-family: 'NotoSansKR-Regular';
  width: 411px;
  height: 330px;
  border: none;
  border-radius: 25px;
  box-shadow: 0px 10px 50px #ddd;
  line-height: 1.8em;
}

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 { margin-left: 10px; float: left; }
.container .consulting_area .consulting_imformation .room_inner02 .ico_box04,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 { margin-left: 30px; float: left; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 .ico_img { margin: 40px 0 20px 0; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 i {
  font-size: 28px;
  font-weight: 600;
  color: #bc1225;
  display: block;
  margin-bottom: 20px;
}

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 span { font-size: 15px; color: #666; display: block; }
.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 span b { font-size: 15px; font-style: normal; color: #a7a7a7; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box03 em {
  font-size: 12px;
  color: #666;
  line-height: 1.2rem;
  display: block;
  margin: 10px 0;
}

.container .consulting_area .consulting_imformation .room_inner02 .ico_box04 img,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 img { margin: 50px 0 30px 0; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box04 p,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 p { font-size: 19px; font-weight: 600; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box04 span,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 span { font-size: 15px; color: #a7a7a7; }

.container .consulting_area .consulting_imformation .room_inner02 .ico_box04 b,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 b {
  font-size: 15px;
  width: 170px;
  color: #333;
  background: #f5f5f5;
  border-radius: 25px;
  padding: 10px;
  font-weight: 600;
  display: block;
  text-align: center;
  margin: 25px auto 0 auto;
  cursor: pointer;
}

.container .consulting_area .consulting_imformation .room_inner02 .ico_box04 b:hover,
.container .consulting_area .consulting_imformation .room_inner02 .ico_box05 b:hover { color: #fff; background: #bc1225; }


/* ======================================================================
   SUB06 — 고객사 레퍼런스 / 공지사항 (sub06_XX.html)
   ====================================================================== */

.bg_content .bg_area.sub06_bg,
body.page-sub06 .bg_content .bg_area {
  background: url(../img/reference/sub_bg.png) no-repeat 0 0;
  background-size: cover;
}

/* reference */
.container .reference_area {
  padding: 40px 0 100px 0;
  margin-bottom: 100px;
}

.container .reference_area .reference_imformation { text-align: center; margin: 0 auto; }

.container .reference_area .reference_imformation .room_title {
  border-top: 2px solid #bc1225;
  border-bottom: 1px solid #ccc;
  padding: 40px 0;
  text-align: left;
}

.container .reference_area .reference_imformation .room_title p {
  font-size: 24px;
  font-weight: 600;
  color: #333;
  display: inline-block;
}

.container .reference_area .reference_imformation .room_title span { font-size: 16px; color: #ccc; }

#category { float: left; margin: 5px 10px 5px 0; }
#regDate { display: block; text-align: right; }

.container .reference_area .reference_imformation .room_inner01 {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 30px;
  overflow: auto;
}

.room_inner01::-webkit-scrollbar { width: 6px; height: 5px; }
.room_inner01::-webkit-scrollbar-thumb { height: 17%; background-color: rgba(180, 180, 180, 1); border-radius: 10px; }
.room_inner01::-webkit-scrollbar-track { background-color: rgba(0, 0, 0, 0); }

.container .reference_area .reference_imformation .room_inner01 img { margin: 50px 0 40px 0; }
.container .reference_area .reference_imformation .room_inner01 pre { color: #888; font-size: 15px; text-align: left; }

.container .reference_area .reference_imformation .room_inner02 {
  width: 100%;
  margin-top: 30px;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 40px 0;
}

.container .reference_area .reference_imformation .room_inner02 .next_bt { width: 100%; }
.container .reference_area .reference_imformation .room_inner02 .next_bt ul { overflow: hidden; }

.container .reference_area .reference_imformation .room_inner02 .next_bt ul li {
  float: left;
  width: 50%;
  cursor: pointer;
}

.container .reference_area .reference_imformation .room_inner02 .next_bt ul li p:hover { color: #333; }
.container .reference_area .reference_imformation .room_inner02 .next_bt ul li p.null_txt { color: #888; }
.container .reference_area .reference_imformation .room_inner02 .next_bt ul li p.null_txt:hover { color: #999; }

.container .reference_area .reference_imformation .room_inner02 .next_bt ul li:nth-child(1) {
  text-align: left;
  background: url(../img/reference/bar.png) no-repeat 100% 0;
}

.container .reference_area .reference_imformation .room_inner02 .next_bt ul li:nth-child(2) { text-align: right; }

.container .reference_area .back {
  padding: 10px 30px;
  color: #333;
  background: #fff;
  border: 1px solid #333;
  border-radius: 5px;
  display: inline-block;
  margin-top: 30px;
  float: right;
  cursor: pointer;
}

/* notice */
.container .notice_area {
  width: 100%;
  margin: 40px auto 100px auto;
}

.container .notice_area .notice_title {
  width: auto;
  background: #f8f8f8;
  overflow: hidden;
  padding: 10px 30px;
}

.container .notice_area .notice_title p { float: left; color: #333; font-size: 16px; font-weight: 600; margin-top: 10px; }
.container .notice_area .notice_title .notice_search { float: right; }

.container .notice_area .notice_title .notice_search select {
  width: 90px;
  height: 45px;
  background: url(../img/arrow.png) no-repeat 90% 50%;
  background-color: #fff;
  padding-left: 15px;
  border: 1px solid #ccc;
  font-weight: 600;
  color: #333;
}

.container .notice_area .notice_title .notice_search option { font-size: 14px; color: #aaa; }

.container .notice_area .notice_title .notice_search input {
  width: 250px;
  height: 41px;
  color: #aaa;
  background: #fff;
  border: 1px solid #ccc;
  padding-left: 10px;
  margin-left: 2px;
}

.container .notice_area .notice_title .notice_search button {
  width: 80px;
  height: 44px;
  color: #fff;
  margin-top: 1px;
  background: #333333;
  font-weight: 600;
  border: 1px solid #333;
  vertical-align: bottom;
  cursor: pointer;
}

/* category_bt */
.category_bt { margin-top: 30px; text-align: left; }
.category_bt ul { overflow: hidden; }

.category_bt ul li { float: left; width: 280px; height: 50px; }

.category_bt button {
  font-family: 'NotoSansKR-Regular';
  font-size: 17px;
  border-radius: 25px;
  padding: 10px 25px;
  color: #888;
  margin-right: 5px;
  cursor: pointer;
  width: 100%;
  height: 50px;
  border: none;
  text-indent: -0.5em;
  background: url(../img/bar4.png) no-repeat 99% 50%;
}

.category_bt button.on {
  background-color: #bc1225;
  border-radius: 25px;
  color: #fff;
  background-image: none;
}

.category_bt button:hover { opacity: 0.8; }
.category_bt button:last-child { margin-right: 0; }

/* notice table */
.container .notice_area .notice_inner { width: 100%; margin-top: 40px; }
.container .notice_area .notice_inner2 { width: 100%; margin-top: 40px; overflow: hidden; }

.container .notice_area .notice_inner table {
  width: 100%;
  border-top: 2px solid #bc1225;
  border-bottom: 1px solid #ccc;
  margin-bottom: 40px;
}

.container .notice_area .notice_inner2 table {
  width: 48%;
  border-top: 2px solid #bc1225;
  border-bottom: 1px solid #ccc;
  margin-bottom: 40px;
}

.container .notice_area .notice_inner2 .t_01 { float: left; }
.container .notice_area .notice_inner2 .t_02 { float: right; }

.container .notice_area .notice_inner table tr th {
  height: 50px;
  font-size: 16px;
  font-weight: 600;
  color: #333;
  vertical-align: middle;
}

.container .notice_area .notice_inner table tr td {
  font-size: 15px;
  font-weight: 500;
  color: #888;
  vertical-align: middle;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
  text-align: center;
  cursor: pointer;
}

.container .notice_area .notice_inner2 table tr td {
  font-size: 15px;
  font-weight: 500;
  color: #888;
  vertical-align: middle;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
  text-align: left;
}

.container .notice_area .notice_inner table tr td:hover,
.container .notice_area .notice_inner2 table tr td:hover { color: #999; }

.container .notice_area .notice_inner2 table tr .t_img { width: 34%; padding-left: 2vh; cursor: pointer; }
.container .notice_area .notice_inner2 table tr img { cursor: pointer; }

.container .notice_area .notice_inner2 table tr td span { font-size: 18px; color: #888; }

.container .notice_area .notice_inner2 table tr td span .t_date {
  background: url(../img/bar4.png) no-repeat 85% 50%;
  width: 100px;
  display: inline-block;
}

.container .notice_area .notice_inner2 table tr td p {
  font-size: 20px;
  font-weight: 600;
  margin-top: 7px;
  cursor: pointer;
  color: #333;
}

.container .notice_area .notice_inner2 table tr td button {
  padding: 10px 20px;
  font-size: 17px;
  font-weight: 600;
  color: #666;
  border: none;
  border-radius: 25px;
  margin-top: 105px;
  cursor: pointer;
}

.container .notice_area .notice_inner2 table tr td button:hover { opacity: 0.8; }

.container .notice_area .notice_inner .more,
.container .notice_area .notice_inner2 .more {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  background: #bc1225;
  padding: 10px 40px;
  border-radius: 25px;
  display: inline-block;
  margin: 30px auto 0 auto;
  text-align: center;
  cursor: pointer;
}

/* download */
.download_area { margin-bottom: 40px; display: flex; }
.download_area ul { overflow: hidden; }

.download_area ul li {
  width: 264px;
  height: 265px;
  border: 1px solid #cccccc;
  border-radius: 15px;
  float: left;
  margin-right: 17px;
}

.download_area ul li:nth-child(1) { background: url(../img/download/ico01.png) no-repeat 85% 40px; background-color: #f8f8f8; }
.download_area ul li:nth-child(2) { background: url(../img/download/ico02.png) no-repeat 85% 40px; background-color: #f8f8f8; }
.download_area ul li:nth-child(3) { background: url(../img/download/ico03.png) no-repeat 85% 40px; background-color: #f8f8f8; }
.download_area ul li:nth-child(4) { background: url(../img/download/ico04.png) no-repeat 85% 40px; background-color: #f8f8f8; }
.download_area ul li:nth-child(5) { background: url(../img/download/ico05.png) no-repeat 85% 40px; background-color: #f8f8f8; margin-right: 0; }

.download_area ul li p { font-family: 'NotoSansKR-Regular'; font-size: 22px; font-weight: 600; color: #111; margin: 40px 30px; text-align: left; }

.download_area ul li span {
  font-family: 'NotoSansKR-Regular';
  font-size: 18px;
  font-weight: 500;
  color: #666;
  padding: 10px 25px;
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 25px;
  text-align: left;
  float: left;
  margin-left: 30px;
  margin-top: 70px;
  cursor: pointer;
}

.download_area ul li span:hover { text-decoration: underline; text-underline-position: under; }


/* ======================================================================
   SUB07 — 지점 찾기 (sub07_01.html)
   ====================================================================== */

.bg_content .bg_area.sub07_bg,
body.page-sub07 .bg_content .bg_area {
  background: url(../img/map/sub_bg.png) no-repeat 0 0;
  background-size: cover;
}

ul.tabs {
  margin: 40px 0;
  padding: 0;
  list-style: none;
}

ul.tabs > li {
  width: 100px;
  background: #fff;
  margin: 0 2.1px;
  color: #999999;
  border: 1px solid #ddd;
  border-radius: 25px;
  display: inline-block;
  padding: 10px 15px;
  cursor: pointer;
}

ul.tabs > li.current {
  background: #bc1225;
  color: #fff;
  border: 1px solid #bc1225;
}

.tab-content { display: none; }

.tab-content.current {
  margin-bottom: 100px;
  overflow: hidden;
  grid-template-columns: repeat(auto-fill, minmax(32%, 1fr));
  grid-gap: 0px 5px;
  display: grid;
}

.map_kard {
  width: 397px;
  height: 170px;
  border: 1px solid #ddd;
  float: left;
  margin: 5px 0;
  display: block;
  position: relative;
  padding: 30px;
}

.map_kard .area_name { border-bottom: 1px solid #ddd; padding-bottom: 30px; overflow: hidden; }
.map_kard .area_name p { width: 100%; text-align: left; font-size: 20px; font-weight: 600; margin-bottom: 3px; color: #bc1225; float: left; }
.map_kard .area_name span { display: block; font-size: 15px; color: #666; float: left; }

.map_kard .area_name b {
  width: 100px;
  display: block;
  padding: 10px;
  border-radius: 25px;
  font-size: 15px;
  color: #333;
  float: right;
  border: 1px solid #f5f5f5;
  background: #f5f5f5;
  margin-top: -28px;
  cursor: pointer;
}

.map_kard .area_name b:hover { color: #fff; background: #bc1225; }
.map_kard > div > ul { margin-top: 25px; text-align: left; }
.map_kard > div > ul > li { padding-left: 25px; color: #999; }
.map_kard > div > ul > li:nth-child(1) { background: url(../img/map/T.png) no-repeat 0 2px; }
.map_kard > div > ul > li:nth-child(2) { background: url(../img/map/E.png) no-repeat 1px 50%; }
.map_kard > div > ul > li:nth-child(3) { background: url(../img/map/A.png) no-repeat 0 50%; }
.map_kard > .address2 > ul > li:nth-child(1) { background: url(../img/map/E.png) no-repeat 1px 2px; }
.map_kard > .address2 > ul > li:nth-child(2) { background: url(../img/map/A.png) no-repeat 1px 2px; }


/* =============================================
   INDEX — 히어로 Swiper (메인 배너)
   ============================================= */

body.page-index .swiper-container {
  height: 590px;
  overflow: hidden;
}

body.page-index .swiper-container .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

body.page-index .swiper-container .swiper-slide .text_inner {
  width: 1400px;
  margin: 0 auto;
  position: relative;
}

body.page-index .swiper-container .swiper-slide .text_inner #text_box01,
body.page-index .swiper-container .swiper-slide .text_inner #text_box02,
body.page-index .swiper-container .swiper-slide .text_inner #text_box03,
body.page-index .swiper-container .swiper-slide .text_inner #text_box04 {
  position: absolute;
  transform: translate(0%, 140%);
  text-align: left;
}

body.page-index .swiper-container .swiper-slide .text_inner #text_box01 p,
body.page-index .swiper-container .swiper-slide .text_inner #text_box02 p,
body.page-index .swiper-container .swiper-slide .text_inner #text_box03 p,
body.page-index .swiper-container .swiper-slide .text_inner #text_box04 p {
  font-size: 42px;
  font-weight: 600;
  color: #fff;
  line-height: 1.3em;
  text-shadow: 0.5px 1px 1px #555;
}

body.page-index .swiper-container .swiper-slide .text_inner #text_box01 span,
body.page-index .swiper-container .swiper-slide .text_inner #text_box02 span,
body.page-index .swiper-container .swiper-slide .text_inner #text_box03 span,
body.page-index .swiper-container .swiper-slide .text_inner #text_box04 span {
  display: block;
  font-size: 20px;
  color: #fff;
  margin-top: 20px;
}

/* 슬라이드 애니메이션 */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box01 p,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box01 span,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box02 p,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box02 span,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box03 p,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box03 span,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box04 p,
  body.page-index .swiper-container .swiper-slide.swiper-slide-active .text_inner #text_box04 span {
    animation: hero-text 1.2s 0.2s both;
  }
  @keyframes hero-text {
    0% { opacity: 0; transform: translateY(50px); }
    100% { opacity: 1; transform: translateY(0); }
  }
}

/* 페이지네이션 */
body.page-index .swiper-container .swiper-pagination {
  text-align: left;
  position: relative;
  margin: 0 auto;
  top: -60px;
}
body.page-index .swiper-container .swiper-pagination .swiper-pagination-bullet {
  width: 7px;
  height: 7px;
  background: #ffffff;
  opacity: 1;
}
body.page-index .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  top: 5px;
  width: 18px;
  height: 20px;
  background: url(../img/haxagon.png) no-repeat 0px 3px;
  opacity: 1;
}
body.page-index .swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  left: 0;
  width: 1400px !important;
  margin: 0 auto;
}

/* gray background */
body.page-index .gray_bg {
  width: 100%;
  height: 230px;
  position: absolute;
  bottom: -50px;
  background: #f8f8f8;
  z-index: -1;
}

/* =============================================
   INDEX — 뉴스레터 Swiper 공통 스타일
   ============================================= */

/* 뉴스레터 섹션 타이틀 (NEWSLETTER 배경 이미지) */
.news_letter_title {
  width: 100%;
  height: 30px;
  background: url(../img/news_letter.png) no-repeat 0 0;
  margin-bottom: 30px;
}

/* Swiper 래퍼 */
.swiper-container2 {
  width: 100%;
  overflow: hidden;
}

/* 각 슬라이드 */
.swiper-container2 .swiper-slide {
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
}

/* 썸네일 영역 */
.swiper-container2 .slide01 {
  width: 100%;
  overflow: hidden;
  border-radius: 4px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* 썸네일 이미지 */
.swiper-container2 .slide01 img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.25s ease;
}

.swiper-container2 .slide01 img:hover {
  transform: scale(1.03);
}

/* 슬라이드 하단 제목 */
.swiper-container2 .swiper-slide > span {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  color: #555;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}