@charset "UTF-8";
/*-------------------------------------------------
title       : 설정
Author      : 플랜아이 광주
Create date : 2025-06-17
Last revision : 
-------------------------------------------------*/
@import url("contents.css");
@import url("contents2.css");
/*-------------------------------------------------
title       : 서브
Author      : 플랜아이 moni
Create date : 2025-10-02
Last revision : 
-------------------------------------------------*/
#snb {
  padding-bottom: 8.8rem;
  position: relative;
  border-top: 1px solid #D1D9E9;
}
#snb .stitle {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  bottom: 0;
  width: 140rem;
  max-width: calc(100% - 6rem);
  text-align: center;
  font-size: 2rem;
  font-weight: 700;
}
#snb .stitle span {
  background: linear-gradient(92deg, #3474D2 18.45%, #48C1DC 62.15%, #3796D0 88.91%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#snb .nav {
  width: 176rem;
  max-width: calc(100% - 16rem);
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 1.2rem 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 1600px) {
  #snb .nav {
    max-width: calc(100% - 8rem);
  }
}
@media screen and (max-width: 900px) {
  #snb .nav {
    max-width: calc(100% - 5rem);
  }
}
#snb .nav .home {
  width: 2rem;
  position: relative;
  font-size: 1.8rem;
  line-height: 4.8rem;
  height: 4.8rem;
  text-align: center;
  margin-right: 3.6rem;
}
#snb .nav .home::before {
  content: "";
  width: 4px;
  height: 4px;
  background: #D9D9D9;
  position: absolute;
  right: -1.6rem;
  top: 2.2rem;
  border-radius: 50%;
}
#snb .submenu {
  position: relative;
}
#snb .submenu .stats {
  padding: 1.5rem 3rem 1.5rem 0;
  font-size: 1.4rem;
  width: 100%;
  text-align: left;
  position: relative;
  line-height: 1.8rem;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#snb .submenu .stats::before {
  content: "\ea4e";
  font-family: "remixicon";
  width: 1.8rem;
  height: 1.8rem;
  line-height: 1.8rem;
  text-align: center;
  -moz-tab-size: 1.8rem;
    -o-tab-size: 1.8rem;
       tab-size: 1.8rem;
  position: absolute;
  right: 0;
  top: 1.5rem;
  display: block;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
#snb .submenu .stats:hover, #snb .submenu .stats:focus {
  color: #3474D2;
  font-weight: 600;
}
#snb .submenu .stats:hover::before, #snb .submenu .stats:focus::before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
#snb .submenu .depth {
  visibility: hidden;
  overflow: hidden;
  width: 0;
  height: 0;
  opacity: 0;
  font-size: 1.4rem;
  position: absolute;
  z-index: 1;
  border-radius: 0.8rem;
  font-size: 1.4rem;
  background: #fff;
}
#snb .submenu .depth li + li {
  margin-top: 1rem;
}
#snb .submenu .depth a {
  word-break: keep-all;
}
#snb .submenu .depth a:hover, #snb .submenu .depth a:focus {
  color: #222;
}
#snb .submenu.active .stats {
  color: #3474D2;
  font-weight: 600;
}
#snb .submenu.active .stats::before {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
#snb .submenu.active .depth {
  visibility: visible;
  overflow: visible;
  width: auto;
  height: auto;
  opacity: 1;
  border: 1px solid #D1D9E9;
  padding: 1.5rem;
  min-width: 15rem;
}
#snb #depth_2,
#snb #depth_3,
#snb #depth_4 {
  margin-left: 3.2rem;
}

#content {
  width: 140rem;
  max-width: calc(100% - 8rem);
  margin: 0 auto;
  padding-bottom: 12rem;
}
#content .stitle {
  font-size: 6rem;
  text-align: center;
  font-weight: 700;
  margin-bottom: 6.4rem;
  color: #222;
}

.subTabMenu_wrap {
  overflow-y: auto;
  margin-bottom: 6rem;
}

#subTabMenu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 2rem;
}
#subTabMenu li {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 100%;
          flex: 1 1 100%;
}
#subTabMenu li:first-child a::before {
  display: none;
}
#subTabMenu li.on a {
  background: url(../../images/rdh/contents/tab_bg.png) lightgray 50%/cover no-repeat;
  color: #fff;
  text-decoration: none;
}
#subTabMenu li.on a::before {
  display: none;
}
#subTabMenu li.on + li a:before {
  display: none;
}
#subTabMenu a {
  color: #616161;
  background: #F0F3F9;
  font-size: 1.8rem;
  font-weight: 600;
  position: relative;
  padding: 1rem 2rem;
  display: block;
  text-align: center;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  word-break: keep-all;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: 1.2;
  height: 8rem;
}
#subTabMenu a::before {
  content: "";
  width: 1px;
  height: 2.7rem;
  background: #C1CBDE;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
#subTabMenu a:hover, #subTabMenu a:focus {
  text-decoration: none;
  background: #042B80;
  color: #fff;
}
#subTabMenu a:hover::before, #subTabMenu a:focus::before {
  display: none;
}
#subTabMenu::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
#subTabMenu::-webkit-scrollbar-thumb {
  background-color: #94B2C4;
  border-radius: 5px;
}
#subTabMenu::-webkit-scrollbar-track {
  background-color: #D1D9E9;
  border-radius: 5px;
}

#contents_title {
  width: 140rem;
  max-width: calc(100% - 16rem);
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 8rem 0;
  text-align: center;
}
@media screen and (max-width: 1600px) {
  #contents_title {
    max-width: calc(100% - 8rem);
  }
}
@media screen and (max-width: 900px) {
  #contents_title {
    max-width: calc(100% - 5rem);
  }
}

/*.main_wrap.is2d {
    #contents_title {padding:12.2rem 2rem 12rem;}
}*/
.contents_wrap {
  width: 140rem;
  max-width: calc(100% - 16rem);
  margin-left: auto !important;
  margin-right: auto !important;
}
@media screen and (max-width: 1600px) {
  .contents_wrap {
    max-width: calc(100% - 8rem);
  }
}
@media screen and (max-width: 900px) {
  .contents_wrap {
    max-width: calc(100% - 5rem);
  }
}

.contents_wrap2 {
  width: 128.6rem;
  max-width: calc(100% - 16rem);
  margin-left: auto !important;
  margin-right: auto !important;
}
@media screen and (max-width: 1600px) {
  .contents_wrap2 {
    max-width: calc(100% - 8rem);
  }
}
@media screen and (max-width: 900px) {
  .contents_wrap2 {
    max-width: calc(100% - 5rem);
  }
}

.contents_wrap3 {
  width: 70rem;
  max-width: calc(100% - 16rem);
  margin-left: auto !important;
  margin-right: auto !important;
}
@media screen and (max-width: 1600px) {
  .contents_wrap3 {
    max-width: calc(100% - 8rem);
  }
}
@media screen and (max-width: 900px) {
  .contents_wrap3 {
    max-width: calc(100% - 5rem);
  }
}

.location {
  width: 100%;
  padding: 1.2rem 0;
}
.location .path {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.location .path li {
  display: inline-block;
  vertical-align: top;
  color: #7A7A7A;
  font-size: 1.3rem;
  line-height: 1.5rem;
  position: relative;
}
.location .path li + li {
  padding-left: 2.8rem;
}
.location .path li + li::before {
  content: "\ea6e";
  font-family: "remixicon";
  width: 2.8rem;
  height: 1.5rem;
  text-align: center;
  color: #aaa;
  position: absolute;
  left: 0;
  top: 0;
}
.location a:hover, .location a:focus {
  color: #111;
  text-decoration: underline;
}
.location .list {
  display: inline-block;
  width: calc(100% - 7rem);
}
.location .list > li {
  float: left;
  position: relative;
  width: 20rem;
  max-width: 20%;
  height: 6.9rem;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  line-height: 6.8rem;
}
.location .list > li button {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  padding: 0 4rem 0 2rem;
  background-color: #303b50;
  text-align: left;
  color: #fff;
  line-height: inherit;
}
.location .list > li button::after {
  position: absolute;
  top: auto;
  left: auto;
  right: auto;
  font-family: "remixicon";
  right: 2rem;
  top: 0;
  content: "\e942";
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.location .list > li ul {
  visibility: hidden;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 0;
  padding: 0 1rem;
  border: 1px solid #303b50;
  background-color: #fff;
  line-height: 1.5;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.location .list > li.active button::after {
  -webkit-transform: rotate(180deg);
          transform: rotate(180deg);
}
.location .list > li.active ul {
  visibility: visible;
  height: auto;
  padding: 1rem;
}

.contents_util {
  background-image: url(../img/sub/sub_ti_bg.png);
  background-size: cover;
  background-position: center;
  margin-bottom: 6rem;
}
.contents_util .contents_title {
  color: #222;
  text-align: center;
  font-size: 4rem;
  font-weight: 700;
  line-height: 100%;
  padding: 10rem 0;
}

.depth3_tab ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 12rem;
  margin-top: -7.5rem;
}
.depth3_tab ul li + li {
  margin-left: 0.8rem;
}
.depth3_tab ul li a {
  display: inline-block;
  line-height: 4.3rem;
  border: 1px solid #333;
  border-radius: 5rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.depth3_tab ul li a:hover, .depth3_tab ul li a:focus {
  background: rgba(17, 17, 17, 0.0509803922);
}
.depth3_tab ul li.active a {
  background: #111;
  color: #fff;
}
.depth3_tab ul a {
  display: block;
  padding: 0 2rem;
  text-align: center;
}

#depth5_menu_ul {
  overflow: hidden;
  overflow-x: auto;
  margin: -3rem 0 5rem;
  padding-left: 1rem;
  border-bottom: 1px solid #ddd;
  white-space: nowrap;
}
#depth5_menu_ul li {
  display: inline;
  margin-right: 1rem;
}
#depth5_menu_ul li.active a {
  font-weight: 400;
  color: #484c58;
}
#depth5_menu_ul li.active a::before {
  width: 100%;
}
#depth5_menu_ul a {
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding: 0 1rem 1.5rem;
  vertical-align: top;
}
#depth5_menu_ul a::before {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 0.3rem;
  background-color: #484c58;
  content: "";
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
#depth5_menu_ul a:hover::before, #depth5_menu_ul a:focus::before {
  width: 100%;
}

.form_textbox {
  width: 100%;
  height: 4rem;
  max-height: 100%;
  padding: 0 1rem;
  border: 1px solid #ddd;
  text-align: left;
  vertical-align: top;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.form_textbox:focus {
  border-color: #000;
}

.form_radio {
  display: inline-block;
  position: relative;
  z-index: 0;
  margin-right: 2rem;
  padding-left: 2rem;
  vertical-align: top;
}
.form_radio input {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.form_radio input:focus + label::before {
  outline: 1px dotted #000;
}
.form_radio input:checked + label::after {
  background-color: #484c58;
}
.form_radio label {
  cursor: pointer;
}
.form_radio label::before {
  position: absolute;
  left: 0;
  top: 0.5rem;
  z-index: -2;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 100%;
  border: 1px solid #ddd;
  background-color: #fff;
  content: "";
}
.form_radio label::after {
  position: absolute;
  left: 0.5rem;
  top: 1rem;
  z-index: -1;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 100%;
  content: "";
}
.form_radio:last-child {
  margin-right: 0;
}

.contact {
  min-height: 50rem;
}

.layer_wrap {
  visibility: hidden;
  overflow: hidden;
  width: 0;
  height: 0;
  opacity: 0;
  position: fixed;
  left: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
}
.layer_wrap .close {
  font-size: 2.6rem;
  width: 6.4rem;
  height: 6.4rem;
  line-height: 6.4rem;
  text-align: center;
  border-radius: 0 0 0 2rem;
  background: #424242;
  color: #fff;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  position: absolute;
  right: 0rem;
  top: 0rem;
  z-index: 2;
}
.layer_wrap .close i {
  display: inline-block;
  font-size: 3rem;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.layer_wrap .close:hover i, .layer_wrap .close:focus i {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
.layer_wrap .inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: 100%;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.layer_wrap .hospital_cont_wrap {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(100% - 36.8rem);
          flex: 1 1 calc(100% - 36.8rem);
  max-width: calc(100% - 36.8rem);
  height: 100%;
  background-image: url(../../images/rdh/main/modal_bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
.layer_wrap.active {
  visibility: visible;
  overflow: visible;
  width: auto;
  height: auto;
  opacity: 1;
  width: 100%;
  height: 100%;
  z-index: 10;
  -webkit-transition: opacity 0.2s;
  transition: opacity 0.2s;
}