/* ******************* 서브페이지 헤더 */
header.header nav .gnb > li > a.top-menu{color: var(--color-point);}
header.header .logo{background: url(/theme/basic/img/cmn/logo_c.svg);background-repeat: no-repeat;background-size: contain;background-position: center;}

/* ******************* 서브페이지용 공통 */
.section{padding: 18.8rem 0 14rem}
.tit-wr{padding-bottom: 5.5rem;}

@media all and (max-width:768px) {
  #sub{padding-top: 6rem}
  .section{padding: 7.5rem 0 10rem}
  .tit-wr{padding-bottom: 3rem}
}


/* ******************* 준비중 페이지 */
.preparing-bx{
  background-color: #C8DFD6;
  border-radius: 1rem;
  width: 100%;
  height: 25.4rem;
  font-size: 3.7rem;
  font-weight: 600;
  color: #323232;
  display: flex;
  flex-direction: column;
  align-self: center;
  justify-content: center;
  text-align: center;
}
@media all and (max-width:768px) {
  .preparing-bx{font-size: 1.6rem;height: 17.5rem}
}

.section_bg{position: relative;z-index: 2;}
.section_bg::after{
  position: absolute;
  content: '';
  background: url(/theme/basic/img/sub/section_bg.jpg) no-repeat center / cover;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 96.1rem;
  z-index: -1;
}

/* ******************* 모바일용 메뉴 셀렉트 영역 */
.link-wr{width: 100%;height: 2.5rem; display: flex;align-items: center;margin-bottom: 1.3rem;}
.link-wr ul.select_bx{display: flex;align-items: center;justify-content: flex-start;}
.link-wr ul.select_bx span.topMenu{font-size: 1.4rem;color: #959595;line-height: 14px;;}
.link-wr ul.select_bx > li{height: 100%;position: relative;}
.link-wr ul.select_bx > li:last-child::after{display: none;}
.link-wr ul.select_bx > li.home{display: flex;align-items: center;}
.link-wr ul.select_bx > li.home img.ico{margin: auto 0;}
.link-wr ul.select_bx > li.mid{margin: 0 1rem;width: auto;}
.link-wr ul.select_bx > li.current button{color: var(--color-point);}
.cont-sct {position: relative;width: 13.5rem;height: 100%;}
.cont-sct.active {z-index: 10;}
.cont-sct.active .optionList {max-height: 50rem;}
.cont-sct.active .hr-select{font-weight: bold;}
.hr-select {
    font-family: 'Pretendard';
    width: 100%;
    height: 100%;
    font-size: 1.4rem;
    line-height: 14px;
    cursor: pointer;
    text-align: left;
    background: url('/theme/basic/img/sub/ico_sub_down.svg') no-repeat 88% 50%;
    color: var(--color-txt);
    font-weight: 500;
}
.list-menu {
    position: absolute;
    width: 100%;
    top: 3rem;
    left: 0;
    background-color: #fff;
    box-sizing: border-box;
    box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    transition: all .6s;
    position: absolute;
    list-style-type: none;
    overflow: hidden;
    max-height: 0;
    transition: .3s ease-in;
}
.list-menu li {box-sizing: border-box;border-bottom: 1px solid #D2D2D2;}
.list-menu li:last-child{border-bottom: 0;}
.list-menu li.current a{color: var(--color-point);font-weight: bold;}
.list-menu li a, .list-menu li button {
    width: 100%;
    height: 100%;
    display: block;
    padding: 1rem 1.2rem;
    border: none;
    cursor: pointer;
    text-align: left;
    background-color: #fff;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 1.4rem;
    line-height: 14px;
    color: #000;
    font-family: 'Pretendard';
}
.list-menu li a:hover, .list-menu li button:hover
.list-menu li a:focus,.list-menu li button:focus {background-color: var(--color-point);color: #fff;}

@media all and (max-width:640px) {
  .link-wr{display: block;}
}
@media all and (max-width:400px) {
  .link-wr ul.select_bx > li.mid{margin: 0 .5rem}
}



/* ******************* flex 영역 */
.flex-wr ul.flex-bx{display: flex;align-items: center;}
.flex-wr ul.flex-bx:not(:first-child){padding-top: 6rem;}
.flex-wr ul.flex-bx > li{width: 50%;}
.flex-wr ul.flex-bx > li.fx-imgBx{height: 48rem; }
.flex-wr ul.flex-bx > li.fx-imgBx img.fx-img{width: 100%;height: 100%;object-fit: cover;object-position: center;}
.flex-wr ul.flex-bx > li.fx-txtBx{margin-left: 7.7rem;}
.flex-wr ul.flex-bx > li.fx-txtBx strong{font-size: 2.5rem;line-height: 38px;}
.flex-wr ul.flex-bx > li.fx-txtBx p{font-size: 2rem;line-height: 32px;margin-top: 2rem;}
.flex-wr ul.flex-bx > li.fx-txtBx .more-btn{display: inline-block; margin-top: 2rem;}

.flex-wr ul.flex-bx:nth-child(2n){flex-direction: row-reverse;}
.flex-wr ul.flex-bx:nth-child(2n) > li.fx-txtBx{margin-right: 7.7rem;text-align: right;}