﻿@charset "UTF-8";
@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Thin.woff2) format("woff2");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Light.woff2) format("woff2");
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-DemiLight.woff2) format("woff2");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Regular.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Medium.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Black.woff2) format("woff2");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: "Noto Sans Korean";
    src: url(../font/NotoSans-Bold.woff2) format("woff2");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: "NanumSquareRound";
    src: url(../font/NanumSquareRoundR.woff2) format("woff2");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "NanumSquareRound";
    src: url(../font/NanumSquareRoundB.woff2) format("woff2");
    font-weight: 500;
    font-style: normal;
}

html {
    font-family: "NotoSans";
    font-size: 14px;
    color: #333;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    line-height: 1.5;
    letter-spacing: -.04em;
    /*word-break: keep-all;*/
    overflow-x: hidden;
}

.slide_wrap img{width:100%}

* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    outline: none;
}

a, a:hover {
    text-decoration: none;
    color: inherit;
}

input, button {
    cursor: pointer;
    border: 0;
    background: 0;
}

::placeholder {
    font-family: "NotoSans";
}

em, i {
    font-style: normal;
}

ol, ul {
    list-style: none;
}

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

caption {
    display: none;
}

input[type=text], textarea {
    resize: none;
    overflow-y: auto;
    width: 100%;
    font-family: "NotoSans";
}

textarea {
    border: 0;
}

input[type=file] {
    display: none;
}

i, label {
    display: inline-block;
}

img {
    max-width: 100%;
}

strong {
    font-weight: 700;
}

html.no_scroll {
    overflow: hidden;
}

h2 {
    color: #000;
    font-size: 20px;
}

@media (max-width: 767px) {
    h2 {
        font-size: 17px;
    }
}

h3 {
    color: #000;
    font-size: 18px;
}

@media (max-width: 767px) {
    h3 {
        font-size: 16px;
    }
}

h3 small {
    color: #f96742;
    font-size: 16px;
}

@media (max-width: 767px) {
    h3 small {
        font-size: 15px;
    }
}

input[type=text], textarea {
    font-size: 15px;
}

@media (max-width: 767px) {
    input[type=text], textarea {
        font-size: 14px;
    }
}

input[type=text]::placeholder, textarea::placeholder {
    color: #aaa;
}

.fc_orange {
    color: #f96742 !important;
}

.fc_rorange {
    color: #f30 !important;
}

.fc_gray9 {
    color: #999 !important;
}

.fc_blue {
  color: #3a4198 !important;
}

.fc_black {
  color: #000 !important;
}

.bk_orange {
    background: #f96742 !important;
    color: #fff !important;
    border: none !important;
}

.bk_rorange {
    background: #ff3300 !important;
    color: #fff !important;
    border: none !important;
}

.bk_blue {
    background: #3a4198 !important;
    color: #fff !important;
    border: none !important;
}

.bk_black {
    background: #000 !important;
    color: #fff !important;
    border: none !important;
}

.bk_forange {
    background: #fff1ee !important;
}

.bk_bgray {
    background: #edeef8 !important;
}

.bk_gray {
    background: #f7f7f7 !important;
}

.bk_white {
    background: #fff !important;
}

.bd_black {
    border: 1px solid #000 !important;
}

.bd_orange {
    border: 1px solid #f96742 !important;
    background: none !important;
    color: #f96742 !important;
}

.bd_white {
  border: 1px solid #fff !important;
  background: none !important;
  color: #fff !important;
}

.blt_xs {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    border-radius: 3px;
    padding: 0 7px;
    color: #666;
    background: #ebebeb;
    white-space: nowrap;
    font-size: 12px;
}

@media (max-width: 767px) {
    .blt_xs {
        font-size: 10px;
    }
}

@media (max-width: 767px) {
    .blt_xs {
        height: 18px;
        line-height: 18px;
    }
}

.blt_sm {
    display: inline-block;
    height: 36px;
    line-height: 36px;
    border-radius: 100px;
    padding: 0 15px;
    color: #666;
    font-size: 13px;
}

@media (max-width: 767px) {
    .blt_sm {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .blt_sm {
        height: 26px;
        line-height: 26px;
        padding: 0 10px;
    }
}

.blt_file {
    border: 1px solid #ebebeb;
    border-radius: 100px;
    padding-left: 22px;
    background: #fff;
    position: relative;
    color: #000;
}

.blt_file::before {
    content: "";
    position: absolute;
    left: 7px;
    top: 0;
    height: 100%;
    width: 10px;
    background: url(../../images/ic_file.svg) no-repeat center;
    background-size: contain;
}

.btn {
    font-family: "NotoSans";
    display: inline-block;
    border: 1px solid #ebebeb;
    border-radius: 100px;
    color: #000;
    cursor: pointer;
    text-align: center;
    background: #fff;
}

.btn.sm {
    height: 36px;
    line-height: 36px;
    padding: 0 20px;
    font-size: 13px;
}

@media (max-width: 767px) {
    .btn.sm {
        font-size: 12px;
    }
}

.btn.md {
    height: 46px;
    line-height: 46px;
    padding: 0 25px;
    font-size: 15px;
}

@media (max-width: 767px) {
    .btn.md {
        font-size: 14px;
    }
}

.btn.lg {
    height: 60px;
    line-height: 60px;
    min-width: 200px;
    padding: 0 30px;
    font-size: 16px;
}

@media (max-width: 767px) {
    .btn.lg {
        font-size: 15px;
    }
}

.btn.full {
    width: 100%;
}

.btn:disabled {
    background: #ebebeb !important;
    color: #999 !important;
    border: none !important;
    cursor: default;
}

@media (max-width: 767px) {
    .btn.sm {
        height: 28px;
        line-height: 28px;
        padding: 0 10px;
    }

    .btn.md {
        height: 40px;
        line-height: 40px;
        padding: 0 15px;
    }

    .btn.lg {
        min-width: auto;
        width: 100%;
        height: 50px;
        line-height: 50px;
        padding: 0 20px;
    }
}

p.btn {
  border: none;
  cursor: default;
  font-weight: bold;
}

.input {
    border: 1px solid #ebebeb;
    border-radius: 3px;
    height: 46px;
    line-height: 46px;
    padding: 0 15px;
}

.input:disabled {
    background: #f7f7f7;
    cursor: default;
}

.textarea {
    border: 1px solid #ebebeb;
    border-radius: 3px;
    padding: 15px;
}

.checkbox, .radio {
    position: relative;
    cursor: pointer;
}

.checkbox input, .radio input {
    border: 1px solid #ebebeb;
    width: 26px;
    height: 26px;
    appearance: none;
    margin-right: 10px;
    vertical-align: middle;
    cursor: pointer;
    background: #fff;
}

.checkbox input:disabled, .radio input:disabled {
  background: #f7f7f7;
  cursor: default;
}

.checkbox input {
    border-radius: 3px;
}

.checkbox input:checked {
    border: none;
    background: #f96742;
}

.checkbox input:checked::before {
    content: "";
    position: absolute;
    width: 11px;
    height: 5px;
    background: transparent;
    top: 7px;
    left: 6px;
    border: 2px solid #fff;
    border-top: none;
    border-right: none;
    transform: rotate(-45deg);
    outline: none;
}

.radio input {
    border-radius: 100px;
}

.radio input:checked {
    border-color: #f96742;
}

.radio input:checked::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 6px;
    width: 14px;
    height: 14px;
    background: #f96742;
    border-radius: 100px;
}

.select {
    border: 1px solid #ebebeb;
    border-radius: 3px;
    padding: 0 30px 0 15px;
    height: 46px;
    appearance: none;
    width: 100%;
    background: url(../../images/select.svg) no-repeat right 15px center;
    background-size: contain;
    background-size: 10px auto;
}
.select.sm {
  width: 150px;
}

@media (max-width: 767px) {
    .input {
        height: 40px;
        line-height: 40px;
        padding: 0 10px;
    }

    .select {
        height: 40px;
        padding: 0 25px 0 10px;
    }

    .select.sm {
        width: 100px;
    }

    .checkbox input, .radio input {
        width: 22px;
        height: 22px;
        margin-right: 5px;
    }

    .checkbox input:checked::before {
        width: 10px;
        height: 4px;
        top: 6px;
        left: 5px;
    }

    .radio input:checked::before {
        top: 5px;
        left: 5px;
        width: 12px;
        height: 12px;
    }

    .textarea {
        padding: 10px;
    }
}

.pd0 {
    padding: 0 !important;
}

.mg0 {
    margin: 0 !important;
}

.mt0 {
    margin-top: 0 !important;
}

.mb0 {
    margin-bottom: 0 !important;
}

.pt0 {
  padding-top: 0 !important;
}

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.underline, .underline:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.hidden {
    overflow: hidden !important;
}

body.menu_open {
    overflow: hidden;
    position: fixed;
    width: 100%;
}

@media (max-width: 767px) {
    .mo_hidden {
        display: none !important;
    }
}

.mo_block {
    display: none;
}

@media (max-width: 767px) {
    .mo_block {
        display: block;
    }
}

.bold {
    font-weight: bold !important;
}

.normal {
    font-weight: normal !important;
}

.nowrap {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block;
}

.inner {
    width: 1200px;
    padding: 0 10px;
    margin: 0 auto;
    position: relative;
}

@media (max-width: 767px) {
    .inner {
        width: 100%;
    }
}

.flex {
    display: flex;
    align-items: center;
}

.flexbox {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.thumb {
    display: block;
    position: relative;
    padding-bottom: 75.4%;
    overflow: hidden;
    border: 1px solid #ebebeb;
    border-radius: 10px;
}

.thumb img, .thumb iframe, .thumb video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all .3s ease;
}

.avatar {
    display: flex;
    align-items: center;
    gap: 5px;
}

.avatar .img {
    width: 24px;
    height: 24px;
    border: 1px solid #ebebeb;
    border-radius: 100px;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.avatar .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
}

.avatar .name {
    font-weight: 700;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media (max-width: 767px) {
  .avatar .img {
    width: 20px;
    height: 20px;
  }
}

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

.table_line {
  width: 100%;
}
.table_line.fixed {
  table-layout: fixed;
}
.table_line th, .table_line td {
  padding: 10px;
  text-align: center;
  border: 1px solid #ebebeb;
}
.table_line th {
  background: #f7f7f7;
}
.table_line input {
  margin: 0;
}
.table_line.text-left td {
  text-align: left;
}
.table_scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.table_scroll table th, .table_scroll table td {
  white-space: nowrap;
}

.board_list {
  border-top: 2px solid #333;
}
.board_list li {
  border-bottom: 1px solid #ebebeb;
}
.board_list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px;
  font-size: 15px;
}
@media (max-width: 767px) {
  .board_list a {
    font-size: 14px;
  }
}
.board_list a:hover {
  background: #f7f7f7;
}
.board_list .tit {
  display: flex;
  align-items: center;
  gap: 10px;
}
.board_list .tit.column {
  flex-direction: column;
  align-items: start;
}
.board_list .tit .cate {
  display: flex;
  position: relative;
}
.board_list .tit .cate span + span {
  margin-left: 10px;
  padding-left: 10px;
  position: relative;
}
.board_list .tit .cate span + span::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 1px;
  height: 10px;
  background: #d0d0d0;
}
.board_list a > p {
  flex-shrink: 0;
}
@media (max-width: 767px) {
  .board_list a {
    padding: 15px 10px;
  }
}

[data-tooltip] {
  position: relative;
}

[data-tooltip]::after {
  content: attr(data-tooltip);
  position: absolute;
  display: none;
  bottom: calc(100% + 5px);
  left: 50%;
  transform: translateX(-50%);
  padding: 5px;
  background: #fff;
  border: 1px solid #ebebeb;
  color: #999;
  border-radius: 3px;
  z-index: 100;
  max-width: 300px;
  width: max-content;
  white-space: normal;
  font-size: 12px;
}
@media (max-width: 767px) {
  [data-tooltip]::after {
    font-size: 10px;
  }
}

[data-tooltip]:hover::after {
  display: block !important;
}

[draggable=true] {
  cursor: grab;
}

[draggable=true]:active {
  cursor: grabbing;
}

.header_family {
    background: #fafafa;
    position: relative;
    border-bottom: 1px solid #d0d0d0;
}

.header_family * {
    font-family: "NanumSquareRound";
}

.header_family a {
    color: #777;
    font-weight: bold;
    font-size: 13px;
}

@media (max-width: 767px) {
    .header_family a {
        font-size: 12px;
    }
}

.header_family .top_site, .header_family .top_link {
    display: flex;
    align-items: center;
}

.header_family .top_site a, .header_family .top_link a {
    padding: 0 10px;
}

.header_family .top_site li {
    height: 35px;
    line-height: 35px;
    border-right: 1px solid #d0d0d0;
}

.header_family .top_link li {
    position: relative;
}

.header_family .top_link li + li::before {
    content: "";
    position: absolute;
    top: 5px;
    height: 11px;
    width: 1px;
    background: #ccc;
}

.header_family .all_menu {
    padding-right: 0;
}

.header_family .all_menu:hover {
    color: #f96742;
}

.header_family .all_menu:hover .all_btn .bar {
    background: #f96742;
}

.header_family .all_menu.active {
    color: #f96742;
}

.header_family .all_menu.active .all_btn .bar {
    background: #f96742;
}

.header_family .all_menu.active .all_btn .top {
    transform: translateY(5px) rotateZ(45deg);
}

.header_family .all_menu.active .all_btn .middle {
    width: 0;
}

.header_family .all_menu.active .all_btn .bottom {
    transform: translateY(-5px) rotateZ(-45deg);
}

.header_family .all_menu_box {
    position: absolute;
    top: 35px;
    left: 0;
    width: 100%;
    background: #fff;
    border: 1px solid #d0d0d0;
    padding: 40px 25px;
    z-index: 10;
    display: none;
}

.header_family .all_menu_box.active {
    display: block;
}

.header_family .all_menu_list {
    display: flex;
}

.header_family .all_menu_list div {
    width: 100%;
    padding-left: 20px;
}

.header_family .all_menu_list div + div {
    border-left: 1px solid #ebebeb;
}

.header_family .all_menu_list p {
    margin-bottom: 25px;
    font-weight: bold;
    font-size: 15px;
}

@media (max-width: 767px) {
    .header_family .all_menu_list p {
        font-size: 14px;
    }
}

.header_family .all_menu_list li + li {
    margin-top: 15px;
}

.header_family .all_menu_list a {
    display: block;
}

.header_family .all_menu_list a:hover {
    color: #f96742;
}

.header_family .close {
    position: absolute;
    bottom: 20px;
    right: 20px;
    width: 24px;
    height: 24px;
    border-radius: 3px;
    background: url("../../images/all_menu_close.svg") no-repeat center;
    background-size: 12px auto;
    background-color: #f96742;
    font-size: 0;
    z-index: 1;
}

.header_family .mo_menu {
    display: none;
}

@media (max-width: 767px) {
    .header_family {
        background: #f96742;
        border-bottom: 0;
    }
    .header_family a {
        font-weight: normal;
        color: #333;
    }
    .header_family .top_site, .header_family .top_link {
        display: none;
    }
    .header_family .all_menu_box {
        border: 0;
        padding: 0;
        position: fixed;
        top: 0;
        left: 0;
        height: 100%;
        overflow-y: auto;
    }
    .header_family .all_menu_list {
        display: block;
    }
    .header_family .all_menu_list div {
        padding: 0;
    }
    .header_family .all_menu_list div + div {
	    border-left: none;
	  }
	  .header_family .all_menu_list > div {
	    padding: 15px 10px;
	    border-top: 10px solid #ebebeb;
	  }
    .header_family .all_menu_list p {
        margin: -1px 0 0;
        padding: 0 15px;
        height: 40px;
        line-height: 40px;
        background: #ebebeb;
    }
    .header_family .all_menu_list p i {
        width: 30px;
        height: 40px;
        vertical-align: middle;
    }
    .header_family .all_menu_list p i.ic01 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -64px 5px;
    }
    .header_family .all_menu_list p i.ic02 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -234px 3px;
    }
    .header_family .all_menu_list p i.ic03 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -2px 4px;
    }
    .header_family .all_menu_list p i.ic04 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -131px 5px;
    }
    .header_family .all_menu_list p i.ic05 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -98px 5px;
    }
    .header_family .all_menu_list p i.ic06 {
        background: url("../../images/m_menu_icon_sprite.png") no-repeat center;
        background-size: auto 34px;
        background-position: -164px 5px;
    }
    .header_family .all_menu_list .service ul {
	    border-radius: 10px;
	  }
	  .header_family .all_menu_list .service a {
	    display: flex;
	    align-items: center;
	    gap: 10px;
	  }
	  .header_family .all_menu_list .service i {
	    width: 30px;
	    height: 30px;
	    border-radius: 10px;
	    background-color: #a38262;
	    background-size: 15px 15px !important;
	  }
	  .header_family .all_menu_list .menu_group {
	    display: flex;
	    flex-direction: column;
	    gap: 10px;
	  }
    .header_family .all_menu_list ul {
        display: grid;
        grid-template-columns:repeat(2, 1fr);
	    border: 1px solid #ebebeb;
	    border-radius: 0 0 10px 10px;
	    overflow: hidden;
    }
    .header_family .all_menu_list li {
        border: 1px solid #ebebeb;
        margin: -1px 0 0 -1px !important;
    }
    .header_family .all_menu_list li:nth-child(2n-1) {
	    border-right: 1px solid #ebebeb;
	  }
    .header_family .all_menu_list a {
        display: block;
        padding: 10px 15px;
    }
    .header_family .all_top {
        padding: 15px 45px 15px 15px;
        background: #a38262;
    }
    .header_family .all_top * {
        color: #fff;
    }
    .header_family .all_top .login_txt {
        font-size: 18px;
    }
    .header_family .all_top div {
        display: flex;
        gap: 5px;
    }
    .header_family .all_top div.name {
	    flex-direction: column;
	    gap: 0;
	  }
	  .header_family .all_top div.name .login_txt {
	    font-weight: bold;
	  }
    .header_family .ic_menu {
        display: flex;
        justify-content: center;
        padding: 20px 25px;
    }

    .header_family .ic_menu li {
        padding-top: 60px;
        width: 25%;
        text-align: center;
    }

    .header_family .ic_menu li:nth-child(1) {
        background: url("../../images/m_menu_top01.png") no-repeat top center;
        background-size: auto 55px;
    }

    .header_family .ic_menu li:nth-child(2) {
        background: url("../../images/m_menu_top02.png") no-repeat top center;
        background-size: auto 55px;
    }

    .header_family .ic_menu li:nth-child(3) {
        background: url("../../images/m_menu_top03.png") no-repeat top center;
        background-size: auto 55px;
    }

    .header_family .ic_menu li:nth-child(4) {
        background: url("../../images/m_menu_top04.png") no-repeat top center;
        background-size: auto 55px;
    }

    .header_family .close {
        bottom: auto;
        top: 15px;
        left: auto;
        right: 15px;
        height: 28px;
        background-color: transparent;
        width: 20px;
    }

    .header_family .mo_menu {
        display: block;
        width: 100%;
    }

    .header_family .mo_menu .flexbox {
        height: 47px;
    }

    .header_family .mo_menu ul {
        display: flex;
    }

    .header_family .mo_menu li + li {
        margin-left: 10px;
        padding-left: 10px;
        position: relative;
    }

    .header_family .mo_menu li + li::before {
        content: "";
        position: absolute;
        top: 5px;
        left: 0;
        width: 1px;
        height: 10px;
        background: #d0d0d0;
    }

    .header_family .mo_menu a {
        color: #fff;
    }

    .header_family .mo_menu .bar {
        background: #fff;
    }
}

.all_btn {
    display: inline-block;
    width: 13px;
    height: auto;
    position: relative;
    text-align: center;
    vertical-align: top;
    margin: 4px 0 0 3px;
}

.all_btn > div {
    width: auto;
    margin: 0 auto;
    transition: all .5s ease;
}

.all_btn .bar {
    display: block;
    height: 2px;
    width: 13px;
    background: #777;
    transition: transform .5s ease;
}

.all_btn .bar + .bar {
    margin-top: 3px;
}

@media (max-width: 767px) {
    .all_btn {
        width: 20px;
        margin: 0;
    }

    .all_btn .bar {
        width: 20px;
        border-radius: 10px;
    }

    .all_btn .bar + .bar {
        margin-top: 4px;
    }
}

.header_sch {
    padding: 20px 0;
    border-bottom: 1px solid #ebebeb;
    position: relative;
}

.header_sch .inner {
    display: grid;
    grid-template-columns:1fr auto;
    align-items: center;
}

.header_sch h1 img {
    height: 22px;
}

.header_sch .search_box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.header_sch .top_menu {
    display: flex;
    align-items: center;
    gap: 25px;
}

.header_sch .top_menu i {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background-color: #fff1ee !important;
    vertical-align: middle;
    margin-right: 7px;
}

.header_sch .top_menu i.top_menu01 {
    background: url(../../images/top_menu01.svg) no-repeat center;
    background-size: auto 18px;
}

.header_sch .top_menu i.top_menu02 {
    background: url(../../images/top_menu02.svg) no-repeat center;
    background-size: auto 18px;
}

.header_sch .top_menu .cart {
    position: relative;
}

.header_sch .top_menu .cart a {
    text-indent: -9999px;
    display: inline-block;
    width: 45px;
    height: 45px;
    border-radius: 10px;
    background: linear-gradient(145deg, #ff8668, #ff3300);
    position: relative;
}

.header_sch .top_menu .cart a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../../images/ssem_cart.svg) no-repeat center;
    background-size: auto 21px;
}

.header_sch .top_menu .cart span {
    position: absolute;
    top: -7px;
    right: 0;
    background: #000;
    min-widtH: 20px;
    height: 20px;
    line-height: 22px;
    text-align: center;
    padding: 0 5px;
    color: #fff;
    border-radius: 100px;
    font-size: 12px;
}

@media (max-width: 767px) {
    .header_sch .top_menu .cart span {
        font-size: 10px;
    }
}

@media (max-width: 767px) {
    .header_sch {
        padding: 15px 0;
    }
    .header_sch .inner {
        gap: 10px;
    }
    .header_sch h1 img {
        height: 16px;
    }
    .header_sch .top_menu {
        gap: 15px;
    }
    .header_sch .top_menu li:nth-child(2) {
        display: none;
    }
    .header_sch .top_menu i.top_menu01 {
        width: 25px;
        height: 25px;
        border-radius: 7px;
        background-size: auto 50%;
    }
    .header_sch .top_menu .cart a {
        width: 35px;
        height: 35px;
        border-radius: 7px;
    }
    .header_sch .top_menu .cart a::before {
        background-size: auto 40%;
        background-position: 45% center;
    }
    .header_sch .top_menu .cart span {
        min-width: 18px;
        height: 18px;
        line-height: 20px;
        right: -2px;
    }
    .header_sch .search_box {
        position: relative;
        top: auto;
        left: auto;
        transform: none;
        order: 3;
        grid-column: span 2;
        width: 100%;
        max-width: none;
    }
}

.header_gnb {
    border-bottom: 1px solid #ebebeb;
    background: #fff;
    transition: transform .3s ease, top .3s ease;
    position: relative;
}







.header_gnb.fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    box-shadow: 0 0 4px 2px rgba(0, 0, 0, .05);
    animation: opacity 0.3s;
}

.header_gnb.fixed .gnb_menu a {
    font-size: 16px;
}

@media (max-width: 767px) {
    .header_gnb.fixed .gnb_menu a {
        font-size: 15px;
    }
}

.header_gnb.fixed::before {
    top: 55px !important;
}

.header_gnb.hidden {
    transform: translateY(-100%);
}

.header_gnb .gnb_menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 70px;
    line-height: 1;
}

.header_gnb .gnb_menu > li {
    position: relative;
}

.header_gnb .gnb_menu > li > a {
    font-weight: 500;
    display: block;
    padding: 20px 0;
    position: relative;
    font-size: 18px;
}

@media (max-width: 767px) {
    .header_gnb .gnb_menu > li > a {
        font-size: 16px;
    }
}

.header_gnb .gnb_menu > li > a:hover, .header_gnb .gnb_menu > li > a.active {
    color: #f96742;
}

.header_gnb .gnb_menu > li > a:hover::before, .header_gnb .gnb_menu > li > a.active::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: #f96742;
}

.header_gnb .gnb_menu .my a {
    color: #f96742;
}

.header_gnb .gnb_menu .my a::after {
    content: "";
    position: absolute;
    top: 12px;
    right: -5px;
    width: 5px;
    height: 5px;
    border-radius: 100px;
    background: #f96742;
}

.header_gnb .gnb_mo {
    display: none;
}

.header_gnb .depth {
    position: absolute;
    top: 58px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    white-space: nowrap;
    padding-top: 30px;
    display: none;
    font-size: 15px;
}

@media (max-width: 767px) {
    .header_gnb .depth {
        font-size: 14px;
    }
}

.header_gnb .depth li + li {
    margin-top: 20px;
}

.header_gnb .depth a:hover {
    color: #f96742;
}

.header_gnb.active .depth {
    display: block;
}
.header_gnb.active::before {
    content: "";
    position: absolute;
    top: 58px;
    left: 0;
    width: 100%;
    height: 150px;
    background: #fff;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
    z-index: 9;
}
@media (max-width: 767px) {
    .header_gnb .gnb_menu {
        display: none;
    }
    .header_gnb .gnb_mo {
        display: block;
        position: relative;
    }

    .header_gnb .gnb_mo button {
        height: 40px;
        font-size: 16px;
        padding: 0 20px;
        margin: 0 -10px;
        width: calc(100% + 20px);
        text-align: left;
        background: #f7f7f7;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
}
@media (max-width: 767px)and (max-width: 767px) {
    .header_gnb .gnb_mo button {
        font-size: 15px;
    }
}
@media (max-width: 767px) {
    .header_gnb .gnb_mo button .all_btn {
        margin: 0;
    }
    .header_gnb .gnb_mo button.active .all_btn .top {
        transform: translateY(6px) rotateZ(45deg);
    }
    .header_gnb .gnb_mo button.active .all_btn .middle {
        width: 0;
    }
    .header_gnb .gnb_mo button.active .all_btn .bottom {
        transform: translateY(-6px) rotateZ(-45deg);
    }
    .header_gnb .gnb_mo ul {
        position: absolute;
        top: 41px;
        left: -10px;
        right: -10px;
        background: #fff;
        border-bottom: 1px solid #ebebeb;
        padding: 20px;
        z-index: 3;
        display: none;
    }

    .header_gnb .gnb_mo ul li + li {
        margin-top: 10px;
    }

    .header_gnb .gnb_mo ul a {
        display: block;
    }

    .header_gnb .gnb_mo ul .my a {
        color: #f96742;
        font-weight: bold;
    }

    .header_gnb .gnb_mo ul.active {
        display: block;
    }

    .header_gnb .gnb_mo .bar {
        background: #000;
    }
}

.search_box {
    border: 2px solid #f96742;
    width: 400px;
    display: grid;
    grid-template-columns:auto 20px;
    gap: 20px;
    height: 46px;
    padding: 0 20px;
    background: #fff;
    border-radius: 100px;
}

.search_box .search_btn {
    width: 100%;
    text-indent: -9999px;
    background: url(../../images/ic_search.svg) no-repeat center;
    background-size: contain;
}

.search_box.gray {
  border: 1px solid #ebebeb;
}
.search_box.gray .search_btn {
  background: url("../../images/ic_search_gray.svg") no-repeat center;
  background-size: contain;
}

.search_group {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

@media (max-width: 767px) {
  .search_group {
    width: 100%;
  }
}

footer {
    margin-top: 100px;
    font-family: "NanumSquareRound";
    color: #666;
}

footer .footer_link {
    border-top: 1px solid #d0d0d0;
    border-bottom: 1px solid #d0d0d0;
    font-size: 12px;
}

@media (max-width: 767px) {
    footer .footer_link {
        font-size: 10px;
    }
}

footer .footer_link ul {
    display: flex;
    height: 46px;
    align-items: center;
}

footer .footer_link ul li + li {
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
}

footer .footer_link ul li + li::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #d0d0d0;
}

footer .footer {
    padding: 30px 10px;
}

footer .footer h1 img {
    height: 37px;
}

footer .footer .info {
    margin-top: 20px;
    font-size: 11px;
}

footer .footer .info .copy {
    margin-top: 5;
}

footer .footer .info span {
    display: inline-block;
    margin-right: 10px;
}

footer .footer .info strong {
    font-weight: normal;
}

footer .footer ul {
    position: absolute;
    top: 30px;
    right: 10px;
    display: flex;
    gap: 15px;
}

footer .footer ul a {
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    overflow: hidden;
    background-size: 100% !important;
    text-indent: -9999px;
}

footer .footer ul a.insta {
    background: url(../../images/instagram_icon.svg) no-repeat center;
    background-size: contain;
}

footer .footer ul a.youtube {
    background: url(../../images/youtube_icon.svg) no-repeat center;
    background-size: contain;
}

footer .footer ul a.blog {
    background: url(../../images/naverblog_icon.svg) no-repeat center;
    background-size: contain;
}

footer .footer .print {
    position: absolute;
    bottom: 30px;
    right: 10px;
    font-weight: bold;
    padding-top: 40px;
    background: url(https://tsdownload.i-scream.co.kr/tscream/v1.0/asset/images/resources/04_icon/icon_20170728bottom_moe.png) no-repeat top center;
    font-size: 12px;
}
@media (max-width: 767px) {
    footer .footer .print {
        font-size: 10px;
    }
}
@media (max-width: 767px) {
    footer {
        margin-top: 70px;
        color: #32394d;
    }
    footer h1 img {
        height: 35px;
    }
    footer .footer_link {
        border-top: 2px solid #f96742;
        font-size: 12px;
    }
    footer .footer_link ul {
        height: 43px;
        justify-content: center;
    }
    footer .footer_link li:nth-child(2) {
        padding: 0;
        margin: 0;
    }
    footer .footer_link li:nth-child(2)::before {
        content: none;
    }
    footer .footer {
        padding: 20px 10px 50px;
    }
    footer .footer .info {
        font-size: 12px;
    }
    footer .footer .info p + p {
        margin-top: 10px;
    }
    footer .footer .info .br {
        display: block;
    }
    footer .footer .info strong {
        font-weight: 700;
        color: #f96742;
    }
    footer .footer .info .copy {
        color: #999;
    }
    footer .footer ul {
        top: 20px;
    }
    footer .footer .print {
        display: none;
    }
    footer .footer .btn {
        position: absolute;
        bottom: 50px;
        right: 10px;
        border-color: #ccc;
        border-radius: 0;
    }
}

.main section + section {
    margin-top: 70px;
}

@media (max-width: 767px) {
    .main {
        overflow: hidden;
    }
    .main section + section {
        margin-top: 50px;
    }
}

.main_top {
    padding-top: 50px;
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 20px;
    align-items: center;
}

.main_top h2 {
    font-size: 32px;
}

@media (max-width: 767px) {
    .main_top h2 {
        font-size: 22px;
    }
}

.main_top .search_box {
    width: 480px;
    height: 70px;
    padding: 0 30px;
    grid-template-columns:auto 30px;
    margin: 45px 0 30px;
}

.main_top .search_box input {
    font-size: 18px;
}

@media (max-width: 767px) {
    .main_top .search_box input {
        font-size: 16px;
    }
}

.main_top .reco {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 480px;
    gap: 10px;
}

.main_top .main_banner {
    position: relative;
    width: 560px;
    aspect-ratio: 560/440;
    margin-right: 20px;
}

.main_top .main_banner .slide {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    transition: transform .5s ease, opacity .3s ease;
    opacity: 0;
    z-index: 0;
}

.main_top .main_banner .txt {
    position: absolute;
    left: 50px;
    bottom: 50px;
}

.main_top .main_banner .txt .tit {
    color: #fff;
    font-size: 36px;
    font-weight: bold;
    margin-bottom: 10px;
    line-height: 1;
}

.main_top .main_banner .txt .text {
    color: #fff;
    opacity: .7;
    font-size: 16px;
}

@media (max-width: 767px) {
    .main_top .main_banner .txt .text {
        font-size: 15px;
    }
}

.main_top .main_banner .control {
    position: absolute;
    bottom: 25px;
    right: 25px;
    z-index: 5;
    display: flex;
    align-items: center;
    height: 30px;
    padding: 0 15px;
    background: rgba(0, 0, 0, .5);
    font-size: 12px;
    color: #fff;
    border-radius: 100px;
    line-height: 1;
    gap: 10px;
}

.main_top .main_banner .control .all {
    margin-left: 5px;
    padding-left: 5px;
    position: relative;
    opacity: 0.4;
}

.main_top .main_banner .control .all::before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 1px;
    height: 10px;
    background: hsla(0, 0%, 100%, .4);
}

.main_top .main_banner .control button {
    width: 10px;
    height: 10px;
    text-indent: -9999px;
}

.main_top .main_banner .control button.next {
    background: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%207.45%2012.08'%3E%3Cpath%20d='M.71,11.37l5.33-5.33L.71.71'%20fill='none'%20stroke='%23fff'%20stroke-width='2'/%3E%3C/svg%3E") no-repeat center;
}

.main_top .main_banner .control button.pause {
    background: url(../../images/ic_play.svg) no-repeat center;
    background-size: contain;
}

.main_top .main_banner .control button.is_playing {
    background: url(../../images/ic_pause.svg) no-repeat center;
    background-size: contain;
}

@media (max-width: 767px) {
    .main_top {
        padding-top: 30px;
        grid-template-columns:1fr;
        gap: 30px;
    }

    .main_top .search_box {
        width: 100%;
        height: 50px;
        margin: 20px 0 15px;
        padding: 0 15px;
        grid-template-columns:auto 22px;
        gap: 10px;
    }
    .main_top .reco {
        width: 100%;
        justify-content: left;
        gap: 7px;
    }
    .main_top .main_banner {
        margin-right: 10px;
        width: calc(100% - 10px);
    }
    .main_top .main_banner .txt {
        bottom: 25px;
        left: 25px;
    }
    .main_top .main_banner .txt .tit {
        font-size: 24px;
    }
    .main_top .main_banner .control {
        bottom: 15px;
        right: 15px;
        height: 28px;
        gap: 7px;
    }
}

.main_title {
    margin-bottom: 30px;
}

.main_title .text {
    color: #f96742;
    font-weight: bold;
    letter-spacing: 0;
    margin-bottom: 10px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .main_title .text {
        font-size: 16px;
    }
}

.main_title h3 {
    color: #000;
    font-size: 32px;
}

@media (max-width: 767px) {
    .main_title h3 {
        font-size: 22px;
    }
}

.main_title h3 i {
    width: 15px;
    height: 25px;
    background: url(../../images/arrow.svg) no-repeat center;
    background-size: contain;
    margin-left: 20px;
}

.main_title .comment {
    color: #666;
    margin-top: 10px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .main_title .comment {
        font-size: 16px;
    }
}

.main_title ul {
    margin-top: 15px;
    display: flex;
    gap: 10px;
}

.main_title ul label {
    color: #666;
}

.main_title ul li.active button {
  background: #f96742 !important;
  color: #fff;
  border: none;
}

@media (max-width: 767px) {
    .main_title {
        margin-bottom: 20px;
    }

    .main_title .text {
        margin-bottom: 5px;
    }

    .main_title h3 i {
        width: 10px;
        height: 16px;
        margin-left: 10px;
    }

    .main_title ul {
        gap: 5px;
        margin-top: 10px;
        flex-wrap: wrap;
    }
}

.blt_pay {
    width: 40px;
    height: 44px;
    text-align: center;
    line-height: 40px;
    color: #fff;
    font-size: 12px;
}

@media (max-width: 767px) {
    .blt_pay {
        font-size: 10px;
    }
}

.blt_pay.pay {
    background-color: #f30;
    mask: url("data:image/svg+xml,%3Csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2023.09%2026.71'%3E%3Cpath%20fill='currentColor'%20d='M11.54,0C5.18,0,0,5.18,0,11.54c0,4.8,2.91,9.02,7.31,10.74l-1.89,4.42,9.89-4.26c4.87-2.19,7.78-6.26,7.78-10.9C23.09,5.18,17.91,0,11.54,0Z'/%3E%3C/svg%3E") no-repeat center/contain;
    -webkit-mask: url("data:image/svg+xml,%3Csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2023.09%2026.71'%3E%3Cpath%20fill='currentColor'%20d='M11.54,0C5.18,0,0,5.18,0,11.54c0,4.8,2.91,9.02,7.31,10.74l-1.89,4.42,9.89-4.26c4.87-2.19,7.78-6.26,7.78-10.9C23.09,5.18,17.91,0,11.54,0Z'/%3E%3C/svg%3E") no-repeat center/contain;
    background-size: contain;
}

.blt_pay.free {
    background-color: #3a4198;
    mask: url("data:image/svg+xml,%3Csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2023.09%2026.71'%3E%3Cpath%20fill='currentColor'%20d='M11.54,0C5.18,0,0,5.18,0,11.54c0,4.8,2.91,9.02,7.31,10.74l-1.89,4.42,9.89-4.26c4.87-2.19,7.78-6.26,7.78-10.9C23.09,5.18,17.91,0,11.54,0Z'/%3E%3C/svg%3E") no-repeat center/contain;
    -webkit-mask: url("data:image/svg+xml,%3Csvg%20id='Layer_1'%20data-name='Layer%201'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2023.09%2026.71'%3E%3Cpath%20fill='currentColor'%20d='M11.54,0C5.18,0,0,5.18,0,11.54c0,4.8,2.91,9.02,7.31,10.74l-1.89,4.42,9.89-4.26c4.87-2.19,7.78-6.26,7.78-10.9C23.09,5.18,17.91,0,11.54,0Z'/%3E%3C/svg%3E") no-repeat center/contain;
    background-size: contain;
}

@media (max-width: 767px) {
    .blt_pay {
        width: 30px;
        height: 35px;
        line-height: 33px;
    }
}

.item_list {
    display: flex;
}

.item_list:not(.swiper-wrapper) {
    gap: 40px 10px;
    flex-wrap: wrap;
}

.item_list:not(.swiper-wrapper) li {
    width: calc((100% - 40px) / 5);
}

@media (max-width: 767px) {
    .item_list:not(.swiper-wrapper) {
        gap: 20px 10px;
    }

    .item_list:not(.swiper-wrapper) li {
        width: calc((100% - 10px) / 2);
    }
}

.item_list .item {
  display: flex;
  flex-direction: column;
  gap: 15px;
}


.item_list .more_label {
    color: #666;
    font-size: 12px;
}

@media (max-width: 767px) {
    .item_list .more_label {
        font-size: 10px;
    }
}

.item_list .blt_pay {
    position: absolute;
    top: 10px;
    left: 10px;
}

.item_list .price {
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 0 10px;
    height: 26px;
    line-height: 28px;
    border-radius: 3px;
    background: hsla(0, 0%, 100%, .9);
    color: #f96742;
    font-weight: bold;
    font-size: 15px;
}

@media (max-width: 767px) {
    .item_list .price {
        font-size: 14px;
    }
}

.item_list .tit {
    color: #000;
    font-weight: bold;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 40px;
    line-height: 20px;
    font-size: 15px;
}

@media (max-width: 767px) {
    .item_list .tit {
        font-size: 14px;
    }
}


@media (max-width: 767px) {
    .item_list .item {
        gap: 10px;
    }
    .item_list .blt_pay {
        top: 5px;
        left: 5px;
    }

    .item_list .price {
        bottom: 5px;
        right: 5px;
        border-radius: 5px;
        height: 22px;
        line-height: 24px;
        padding: 0 7px;
    }

    .item_list .name {
        font-size: 13px;
    }
}

@media (max-width: 767px)and (max-width: 767px) {
    .item_list .name {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .item_list .avatar .img {
        width: 20px;
        height: 20px;
    }

    .item_list .date {
        font-size: 13px;
    }
}

@media (max-width: 767px)and (max-width: 767px) {
    .item_list .date {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .item_list .date.active {
        padding-left: 13px;
    }

    .item_list .date.active::before {
        width: 10px;
    }
}

.info_blt {
  display: flex;
  align-items: center;
  gap: 5px;
}

.item_box .item {
   /* background: #fff;*/
    /*border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 4px 2px rgba(0, 0, 0, .05);*/
}

.item_box .item .thumb {
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid #ebebeb;
}

.item_box .item .box {
    padding: 0 15px 15px;
    display: flex;
    flex-direction: column; /*20250911 ahee*/
    gap: 15px;
}

@media (max-width: 767px) {
    .item_box .item .box {
        padding: 0 5px 10px;
        gap: 10px; /*20250911 ahee*/
    }
}

.item .date {
  height: 24px;
  line-height: 24px;
}
.item .date.active {
  color: #f96742;
  padding-left: 21px;
  position: relative;
}
.item .date.active::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 14px;
  height: 14px;
  background: url("../../images/date_active.svg") no-repeat center;
  background-size: contain;
}
.item .date.end {
  color: #999;
}

.point_list .blt_xs {
  position: absolute;
  top: 10px;
  right: 10px;
}
.point_list .tit {
  color: #f96742;
  height: auto;
  margin: 15px 0;
}
.point_list dl {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.point_list dl dt {
  color: #777;
}
.point_list dl dd {
  color: #000;
  font-weight: bold;
}
@media (max-width: 767px) {
  .point_list .blt_xs {
    top: 5px;
    right: 5px;
  }
}

.item_swiper .swiper {
    position: relative;
    overflow: hidden;
}

@media (max-width: 767px) {
    .item_swiper .swiper {
        margin: 0 -10px;
        padding: 0 10px;
    }
}

.swiper_arrow {
    position: absolute;
    top: 50%;
    margin-top: 22px;
    left: -65px;
    width: 45px;
    height: 45px;
    background: url(../../images/swiper_arrow.svg) no-repeat center;
    background-size: 15px;
    background-color: #fff;
    border-radius: 100px;
    text-indent: -9999px;
    box-shadow: 0 0 4px 2px rgba(0, 0, 0, .05);
    z-index: 1;
}

.swiper_arrow.swiper_next {
    left: auto;
    right: -65px;
    transform: rotate(180deg);
}

.swiper_arrow.swiper-button-disabled {
    display: none;
}

@media (max-width: 767px) {
    .swiper_arrow {
        display: none !important;
    }
}

.swiper_num {
    position: absolute;
    bottom: 15px;
    left: auto;
    right: 15px;
    width: auto;
    z-index: 1;
    padding: 0 15px;
    background: rgba(0, 0, 0, .5);
    height: 28px;
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 100px;
    color: hsla(0, 0%, 100%, .4);
    font-size: 13px;
}

@media (max-width: 767px) {
    .swiper_num {
        font-size: 12px;
    }
}

.swiper_num .swiper-pagination-current {
    color: #fff;
}

.main_custom {
    padding: 70px 0;
}

.main_custom .inner {
    display: grid;
    grid-template-columns:1fr 4fr;
    gap: 10px;
}

.main_custom.bk_bgray .main_title {
    position: relative;
    z-index: 2;
}

.main_custom.bk_bgray .main_title::before {
    content: "";
    position: absolute;
    top: -10px;
    bottom: -100px;
    left: -9999px;
    right: -10px;
    background: #edeef8;
    z-index: -1;
}

.main_custom .main_title ul {
    flex-direction: column;
}

.main_custom .item_swiper4 {
    min-width: 0;
}

.main_custom .swiper_bar {
    position: relative;
    margin-top: 35px;
    height: 2px;
    background: rgba(0, 0, 0, .05);
}

.main_custom .swiper_bar .swiper-pagination-progressbar-fill {
    background: #000;
}

.main_custom .swiper_nav {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    gap: 20px;
    z-index: 3;
}

.main_custom .swiper_nav .swiper_arrow {
    position: relative;
    top: 0;
    margin: 0;
    left: auto;
    right: auto;
    display: block;
}

.main_custom .swiper.hidden {
    margin: -3px;
    padding: 3px;
}

@media (max-width: 767px) {
    .main_custom {
        padding: 30px 0;
    }

    .main_custom .inner {
        grid-template-columns:1fr;
        gap: 0;
    }

    .main_custom .main_title::before {
        content: none !important;
    }

    .main_custom .main_title ul {
        flex-direction: row;
    }

    .main_custom .swiper.hidden {
        margin: 0 -10px;
        padding: 0 10px;
    }

}

.ad_banner {
    position: relative;
    display: grid;
    align-items: center;
    height: 135px;
    padding: 0 40px;
    background: #f96742;
    border-radius: 10px;
}

.ad_banner::before, .ad_banner::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 35%;
    width: 110px;
    opacity: .5;
    background: url(../../images/ad_banner01.svg) no-repeat center;
    background-size: contain;
}

.ad_banner::after {
    right: 5%;
    background: url(../../images/ad_banner02.svg) no-repeat center 60%;
    background-size: contain;
    width: 90px;
}

.ad_banner .info {
    color: hsla(0, 0%, 100%, .7);
    letter-spacing: 1px;
    margin-bottom: 5px;
    font-size: 16px;
}

@media (max-width: 767px) {
    .ad_banner .info {
        font-size: 15px;
    }
}

.ad_banner .tit {
    font-weight: bold;
    color: #fff;
    font-size: 28px;
}

.ad_banner .blt_xs {
    position: absolute;
    top: 15px;
    right: 15px;
    letter-spacing: 1px;
    font-weight: bold;
    color: #f96742;
    background: #fff;
}

.ad_banner .img {
    position: absolute;
    bottom: 0;
    right: 15%;
    width: 200px;
    overflow: hidden;
}

.ad_banner .thumb {
    border-radius: 10px 10px 0 0;
}

@media (max-width: 767px) {
    .ad_banner {
        padding: 10px 20px;
        grid-template-columns:1.5fr 1fr;
        height: auto;
        gap: 10px;
    }
    .ad_banner::before {
        right: 42%;
        width: 14%;
        background-position: top 13% center;
    }
    .ad_banner::after {
        content: none;
    }
    .ad_banner .tit {
        font-size: 16px;
    }
    .ad_banner .img {
        position: relative;
        right: 0;
        width: 100%;
    }
    .ad_banner .blt_xs {
        position: relative;
        top: 0;
        right: 0;
        margin-left: 5px;
        vertical-align: top;
    }
    .ad_banner .thumb {
        border-radius: 10px;
    }
}

.sub {
    margin: 50px auto 0;
    width: 1200px;
    padding: 0 10px;
}

.sub section + section {
    margin-top: 40px;
}

@media (max-width: 767px) {
    .sub {
        width: 100%;
        margin-top: 30px;
    }
    .sub section + section {
        margin-top: 30px;
    }
    .sub .inner {
        padding: 0;
    }
}

.sub_txt {
    margin: 0 auto;
    width: 1200px;
    padding: 50px 10px 0;
}

.sub_txt .detail_info {
    margin-top: 0;
}

@media (max-width: 767px) {
    .sub_txt {
        padding: 30px 10px 0;
        width: 100%;
    }
}

.sub_top {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: -50px 0 50px;
    position: relative;
}

.sub_top.sticky {
    position: sticky;
    top: 56px;
    z-index: 9;
}

.sub_top::before {
    content: "";
    position: absolute;
    top: 0;
    left: -9999px;
    right: -9999px;
    bottom: 0;
    background: #fff1ee;
    border-bottom: 1px solid #ebebeb;
    z-index: -1;
}

.sub_top button {
    margin-left: 20px;
}

@media (max-width: 767px) {
    .sub_top {
        height: 50px;
        margin: -30px 0 30px;
    }
    .sub_top::before {
        left: -10px;
        right: -10px;
    }
    .sub_top.sticky {
        top: 0;
    }
}

.sub_title {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 15px !important;
}

.sub_title div {
  display: flex;
  gap: 5px;
}

.sub_title .sort {
    display: flex;
}

.sub_title .sort li {
    color: #666;
}

.sub_title .sort li.active {
    color: #f96742;
    font-weight: bold;
}

.sub_title .sort li + li {
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
}

.sub_title .sort li + li::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #d0d0d0;
}

@media (max-width: 767px) {
    .sub_title {
        padding-bottom: 10px;
        border-width: 1px !important;
    }
}

.filter_box {
    border: 1px solid #000;
    border-radius: 10px;
    overflow: hidden;
}

.filter_box dl {
    display: grid;
    grid-template-columns:125px auto;
    align-items: center;
    background: #f7f7f7;
}

.filter_box dl + dl {
    border-top: 1px solid #ebebeb;
}

.filter_box dl > * {
    padding: 10px 20px;
}

.filter_box dl dt {
    font-weight: bold;
}

.filter_box dl dd {
    background: #fff;
}

@media (max-width: 767px) {
    .filter_box dl {
        grid-template-columns:85px auto;
    }

    .filter_box dl > * {
        padding: 10px;
    }
}

.filter_box.bd_none {
    border: none;
    border-radius: 0;
}

.filter {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.filter input {
    display: none;
    appearance: none;
}

.filter label {
    border-radius: 3px;
    height: 26px;
    line-height: 28px;
    color: #666;
    padding: 0 15px;
    cursor: pointer;
}

.filter input:checked + label {
    color: #fff;
    background: #f96742 !important;
    font-weight: bold;
}

.filter.lg label {
    height: 36px;
    line-height: 36px;
    padding: 0 20px;
    background: #edeef8;
}

@media (max-width: 767px) {
    .filter {
        gap: 5px;
    }

    .filter label, .filter.lg label {
        padding: 0 10px;
    }
}

.search_grid {
    display: grid;
    grid-template-columns:auto 350px;
    gap: 30px;
}

@media (max-width: 767px) {
    .search_grid {
        grid-template-columns:1fr;
    }
}

.search_wrap > div + div, .reco_wrap > div + div {
    margin-top: 40px;
}

.sort_result {
    border-radius: 10px;
    background: #f7f7f7;
    padding: 20px;
    display: none;
}

.sort_result div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.sort_result ul {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.sort_result ul li button {
    width: 10px;
    height: 10px;
    background: url(data:image/svg+xml,%3Csvg%20height%3D%22329pt%22%20viewBox%3D%220%200%20329.26933%20329%22%20width%3D%22329pt%22%20xmlns%3D%22http://www.w3.org/2000/svg%22%3E%3Cpath%20fill%3D%22%23999%22%20d%3D%22m194.800781%20164.769531%20128.210938-128.214843c8.34375-8.339844%208.34375-21.824219%200-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063%200l-128.214844%20128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063%200-8.34375%208.339844-8.34375%2021.824219%200%2030.164063l128.210938%20128.214843-128.210938%20128.214844c-8.34375%208.339844-8.34375%2021.824219%200%2030.164063%204.15625%204.160156%209.621094%206.25%2015.082032%206.25%205.460937%200%2010.921875-2.089844%2015.082031-6.25l128.210937-128.214844%20128.214844%20128.214844c4.160156%204.160156%209.621094%206.25%2015.082032%206.25%205.460937%200%2010.921874-2.089844%2015.082031-6.25%208.34375-8.339844%208.34375-21.824219%200-30.164063zm0%200%22/%3E%3C/svg%3E);
    background-size: 100%;
    text-indent: -9999px;
    vertical-align: middle;
    margin-left: 10px;
}

.sort_result .reset {
    padding-right: 24px;
    position: relative;
    color: #666;
    flex-shrink: 0;
}

.sort_result .reset::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2020%2020'%3E%3Cg%20fill='%23666'%3E%3Cpath%20d='m18%2010c0-4.4-3.6-8-8-8-2.1%200-4.1.8-5.7%202.3l1.4%201.4c1.2-1.1%202.7-1.7%204.3-1.7%203.3%200%206%202.7%206%206h-2l3%203%203-3z'/%3E%3Cpath%20d='m10%2016c-3.3%200-6-2.7-6-6h2l-3-3-3%203h2c0%204.4%203.6%208%208%208%202.1%200%204.1-.8%205.7-2.3l-1.4-1.4c-1.2%201.1-2.7%201.7-4.3%201.7z'/%3E%3C/g%3E%3C/svg%3E");
}

@media (max-width: 767px) {
    .sort_result {
        padding: 10px 15px;
    }

    .sort_result ul {
        gap: 10px;
    }
}

.item_col .item {
    display: grid;
    grid-template-columns: 228px auto;
    align-items: flex-start;
    gap: 15px;
}


.item_col .item + .item {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #ebebeb;
}

.item_col .con {
    position: relative;
    min-width: 0;
}

.item_col .info_blt {
    flex-wrap: wrap;
}

.item_col .tit {
    font-weight: bold;
    color: #000;
    margin: 15px 0 5px;
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 16px;
}

@media (max-width: 767px) {
  .item_col .tit {
    font-size: 15px;
  }
}

.item_col .text {
  color: #666;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 16px;
  height: 32px;
  font-size: 13px;
}
@media (max-width: 767px) {
  .item_col .text {
    font-size: 12px;
  }
}
.item_col .text + .info_blt {
  margin-top: 10px;
}
.item_col .flexbox {
  margin: 15px 0 5px;
}
.item_col .flexbox .name {
  font-size: 13px;
}

@media (max-width: 767px) {
    .item_col .flexbox .name {
        font-size: 12px;
    }

}

.item_col .flexbox .price {
    color: #000;
    font-weight: bold;
    font-size: 20px;
}

@media (max-width: 767px) {
    .item_col .flexbox .price {
        font-size: 17px;
    }
}

.item_col .info {
    display: flex;
    font-size: 13px;
}

@media (max-width: 767px) {
    .item_col .info {
        font-size: 12px;
    }
}

.item_col .info p + p {
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
}

.item_col .info p + p::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #d0d0d0;
}

.item_col .info span, .item_col .info .end {
    color: #999;
}
.item_col .hash {
  margin-bottom: 10px;
  display: flex;
  gap: 5px;
  letter-spacing: 0;
}

.item_col .date {
  height: auto;
  line-height: 1.5;
}

.item_col .address {
  color: #ff3300;
  margin-bottom: 10px;
}

@media (max-width: 767px) {
    .item_col .item {
        grid-template-columns:140px auto;
        gap: 10px;
    }
    .item_col .list_none img {
        width: 55px;
    }
    .item_col .item + .item {
        margin-top: 15px;
        padding-top: 15px;
    }
    .item_col .info_blt {
        flex-wrap: wrap;
    }
    .item_col .tit {
        margin: 10px 0 5px;
    }
    .item_col .flexbox {
        display: block;
        margin: 10px 0 5px;
    }
    .item_col .flexbox .price {
        display: block;
        margin-top: 5px;
    }
    .item_col .mo_line1 {
        flex-direction: column;
    }
    .item_col .mo_line1 p + p {
        padding-left: 0;
        margin-left: 0;
    }
    .item_col .mo_line1 p + p::before {
        content: none;
    }
    .item_col .text {
        height: auto;
    }
}
/*******/
/* 콘텐츠 탭 컨테이너 */
.content_tabs {
    margin: 30px 0 20px;
}

/* 탭 네비게이션 - 기존 .top_tab 스타일 활용 */
.content_tabs .top_tab {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 2px solid #ebebeb;
    margin-bottom: 0;
}

.content_tabs .top_tab ul {
    display: flex;
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 0;
}

.content_tabs .top_tab ul li {
    border: 1px solid #ebebeb;
    border-bottom: 2px solid #ebebeb;
    border-radius: 10px 10px 0 0;
    margin-bottom: -2px;
    background: #f7f7f7;
}

.content_tabs .top_tab ul li + li {
    border-left: 0;
}

.content_tabs .top_tab ul li.active {
    border: 1px solid #333;
    border-bottom: 2px solid #fff;
    background: #fff;
    z-index: 2;
    position: relative;
}

.content_tabs .top_tab ul li a {
    display: block;
    width: 160px;
    height: 50px;
    line-height: 50px;
    color: #666;
    text-align: center;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
    padding: 0;
}

.content_tabs .top_tab ul li.active a {
    color: #f96742;
    font-weight: 700;
}

/* 숫자 카운트 동그라미 - 기본은 회색 */
.content_tabs .top_tab ul li a strong,
.content_tabs .top_tab ul li a span,
strong#contentsCount,
strong#liveCount,
strong#courseWrrCount,
strong#vibeCount {
    margin-left: 5px;
    padding: 0 !important;
    background: #ebebeb !important;
    border-radius: 50% !important;
    font-size: 12px;
    color: #666 !important;
    font-weight: 700;
    width: 24px !important;
    height: 24px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
    letter-spacing: -0.5px !important;
    text-align: center !important;
    text-indent: -1.5px !important;
}

/* 숫자가 0이 아닐 때 주황색으로 표시 */
.content_tabs .top_tab ul li a strong.has-count,
.content_tabs .top_tab ul li a span.has-count,
strong#contentsCount.has-count,
strong#liveCount.has-count,
strong#courseWrrCount.has-count,
strong#vibeCount.has-count {
    background: #f96742 !important;
    color: #fff !important;
}

.content_tabs .top_tab ul li.active a strong {
    background: #ebebeb !important;
    color: #666 !important;
}

/* 활성 탭에서 숫자가 있을 때만 주황색 */
.content_tabs .top_tab ul li.active a strong.has-count {
    background: #f96742 !important;
    color: #fff !important;
}

/* 탭 콘텐츠 영역 */
.tab_content {
    margin-top: 0;
}

.tab_panel {
    display: none;
}

.tab_panel.active {
    display: block;
}

/* 모바일 반응형 - 기존 스타일 완전 재정의 */
@media (max-width: 767px) {
    .content_tabs {
        margin: 20px 0 15px;
    }

    .content_tabs .top_tab {
        border-bottom: 2px solid #ebebeb;
    }

    .content_tabs .top_tab ul {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(2, 1fr);
        gap: 0;
    }

    .content_tabs .top_tab ul li {
        width: 100% !important;
        border: 1px solid #ebebeb !important;
        border-radius: 0 !important;
        margin-bottom: 0 !important;
        background: #f7f7f7 !important;
    }

    .content_tabs .top_tab ul li:first-child {
        border-radius: 10px 0 0 0 !important;
        border-right: none !important;
    }

    .content_tabs .top_tab ul li:nth-child(2) {
        border-radius: 0 10px 0 0 !important;
    }

    .content_tabs .top_tab ul li:nth-child(3) {
        border-radius: 0 0 0 10px !important;
        border-top: none !important;
        border-right: none !important;
    }

    .content_tabs .top_tab ul li:nth-child(4) {
        border-radius: 0 0 10px 0 !important;
        border-top: none !important;
    }

    /* 모바일 활성 탭 - 데스크톱과 동일한 스타일 강제 적용 */
    html .content_tabs .top_tab ul li.active,
    body .content_tabs .top_tab ul li.active {
        background: #fff !important;
        border: 1px solid #333 !important;
        border-bottom: 2px solid #fff !important;
        z-index: 2 !important;
        position: relative !important;
    }

    html .content_tabs .top_tab ul li.active a,
    body .content_tabs .top_tab ul li.active a {
        color: #f96742 !important;
        font-weight: 700 !important;
        background: transparent !important;
    }

    .content_tabs .top_tab ul li a {
        width: 100% !important;
        height: 50px !important;
        line-height: 50px !important;
        text-align: center !important;
        font-size: 13px !important;
        padding: 0 10px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        color: #666 !important;
    }

    .content_tabs .top_tab ul li a strong,
    .content_tabs .top_tab ul li a span {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 20px !important;
        height: 20px !important;
        margin: 0 !important;
        font-size: 11px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        text-align: center !important;
        flex-shrink: 0 !important;
        line-height: 1 !important;
        background: #ebebeb !important;
        color: #666 !important;
        letter-spacing: -0.5px !important;
    }

    .content_tabs .top_tab ul li a strong.has-count,
    .content_tabs .top_tab ul li a span.has-count {
        background: #f96742 !important;
        color: #fff !important;
    }

    html .content_tabs .top_tab ul li.active a strong,
    body .content_tabs .top_tab ul li.active a strong {
        background: #ebebeb !important;
        color: #666 !important;
    }

    html .content_tabs .top_tab ul li.active a strong.has-count,
    body .content_tabs .top_tab ul li.active a strong.has-count {
        background: #f96742 !important;
        color: #fff !important;
    }
}

/* 매우 작은 화면에서는 세로 배치 */
@media (max-width: 480px) {
    .content_tabs .top_tab ul {
        grid-template-columns: 1fr !important;
        grid-template-rows: repeat(4, 1fr) !important;
    }

    .content_tabs .top_tab ul li {
        border-radius: 0 !important;
        border-left: 1px solid #ebebeb !important;
    }

    .content_tabs .top_tab ul li:first-child {
        border-radius: 10px 10px 0 0 !important;
    }

    .content_tabs .top_tab ul li:last-child {
        border-bottom: 2px solid #ebebeb !important;
    }

    html .content_tabs .top_tab ul li.active,
    body .content_tabs .top_tab ul li.active {
        border-left: 1px solid #333 !important;
        background: #fff !important;
        border: 1px solid #333 !important;
        border-bottom: 2px solid #fff !important;
    }

    .content_tabs .top_tab ul li a strong,
    .content_tabs .top_tab ul li a span {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 20px !important;
        height: 20px !important;
        margin: 0 !important;
        font-size: 11px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        text-align: center !important;
        flex-shrink: 0 !important;
        line-height: 1 !important;
        background: #ebebeb !important;
        color: #666 !important;
        letter-spacing: -0.5px !important;
        text-indent: -1.5px !important;
    }

    .content_tabs .top_tab ul li a strong.has-count,
    .content_tabs .top_tab ul li a span.has-count {
        background: #f96742 !important;
        color: #fff !important;
    }
}
/*******/
.list_none {
    grid-template-columns: 1fr !important;
    padding: 50px 0;
    text-align: center;
    gap: 5px !important;
}
.list_none img {
    width: 80px;
    margin: 0 auto 20px;
}

.list_none.sm {
  display: flex;
  padding: 0;
  margin-bottom: 20px;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.05);
  padding: 10px;
  border-radius: 3px;
}
.list_none.sm img {
  width: 30px;
  margin: 0;
}

.noti_bubble {
  position: absolute;
  top: -95px;
  right: 10px;
  text-align: center;
  padding: 15px;
  border-radius: 3px;
  line-height: 20px;
  color: #fff;
  background-image: linear-gradient(145deg, #f96742, #ff3300);
}
.noti_bubble button {
  width: 20px;
  height: 20px;
  border: 2px solid #ff3300;
  background: url("../../images/close.svg") no-repeat center;
  background-size: 6px auto;
  background-color: #fff;
  border-radius: 100px;
  position: absolute;
  top: -10px;
  right: -5px;
  text-indent: -9999px;
}
.noti_bubble::after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -5px;
  border-width: 10px 5px 0;
  border-style: solid;
  border-color: #ff3300 transparent;
  display: block;
  width: 0;
}
@media (max-width: 767px) {
  .noti_bubble {
    padding: 10px;
    top: -65px;
  }
}

.tab_con_box {
display: none;
}
.tab_con_box.active {
display: block;
}

.btn_area {
    margin-top: 40px;
    display: flex;
    gap: 20px;
}

.btn_area.center {
    justify-content: center;
}

@media (max-width: 767px) {
    .btn_area {
        margin-top: 30px;
        gap: 10px;
    }
}

.ic_plus {
    width: 10px;
    height: 10px;
    margin-left: 10px;
    background: url(../../images/ic_plus.svg) no-repeat center;
    background-size: contain;
}

.ic_plus.white {
    filter: invert(99%) sepia(6%) saturate(2%) hue-rotate(44deg) brightness(106%) contrast(100%);
}

.ic_del {
    width: 9px;
    height: 2px;
    background: #fff;
    vertical-align: middle;
    margin-left: 5px;
}

.ic_star {
    width: 18px;
    height: 18px;
    background: url(../../images/ic_star.svg) no-repeat center;
    background-size: contain;
}

@media (max-width: 767px) {
    .ic_star {
        width: 14px;
        height: 14px;
    }
}

.ic_downlaod {
    width: 19px;
    height: 19px;
    background: url(../../images/ic_download.svg) no-repeat center;
    background-size: contain;
}

.ic_file {
  width: 15px;
  height: 15px;
  background: url("../../images/ic_file.svg") no-repeat center;
  background-size: contain;
  opacity: 0.5;
}

.reco_list {
    border-radius: 10px;
    border: 1px solid #ebebeb;
    padding: 20px;
    display: grid;
    /*grid-auto-flow: column;*/
    gap: 20px;
}

.reco_list li {
    position: relative;
    padding-left: 20px;
    min-width: 0;
}

.reco_list li:nth-child(1)::before {
    content: "1";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(2)::before {
    content: "2";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(3)::before {
    content: "3";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(4)::before {
    content: "4";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(5)::before {
    content: "5";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(6)::before {
    content: "6";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(7)::before {
    content: "7";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(8)::before {
    content: "8";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(9)::before {
    content: "9";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li:nth-child(10)::before {
    content: "10";
    position: absolute;
    top: 0;
    left: 0;
    font-weight: bold;
    color: #000;
}

.reco_list li.top::before {
    color: #f96742;
}

.reco_list li a {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
}

@media (max-width: 767px) {
    .reco_list {
        gap: 10px;
    }
}

.info_hover {
    position: relative;
}

.info_hover .tit {
    color: #666;
    cursor: pointer;
}

.info_hover .tit i {
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    border: 1px solid #999;
    border-radius: 100px;
    margin-right: 5px;
    font-weight: bold;
}

.info_hover .text {
    position: absolute;
    z-index: 1;
    top: 30px;
    right: 0;
    display: none;
    width: 280px;
    padding: 10px 15px;
    background: #f7f7f7;
    border-radius: 3px;
    border: 1px solid #ebebeb;
    font-size: 13px;
}

@media (max-width: 767px) {
    .info_hover .text {
        font-size: 12px;
    }
}

.info_hover .text ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.info_hover .text ul li {
  position: relative;
  padding-left: 10px;
}
.info_hover .text ul li::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}

.info_hover:hover .text {
    display: block;
}

.edit_cont {
    font-size: 15px;
}

@media (max-width: 767px) {
    .edit_cont {
        font-size: 14px;
    }
}

.edit_cont .sub_title {
    border-bottom: 2px solid #333;
}

.edit_cont .sub_noti {
    font-size: 14px;
    color: #999;
    margin: 15px 0;
}

.edit_cont .edit_btn {
    margin-top: 20px;
    grid-column: 1/span 2;
    padding-top: 0 !important;
}


.edit_cont .chk_group button {
    font-size: 15px;
}

@media (max-width: 767px) {
    .edit_cont .chk_group button {
        font-size: 14px;
    }
}

.chk_group {
  background: #f7f7f7;
  border-radius: 3px;
  padding: 15px 20px;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

@media (max-width: 767px) {
    .chk_group {
        padding: 10px;
    }
}

.edit_form + .edit_form {
    margin-top: 40px;
}

.edit_form .edit_noti {
    font-size: 14px;
    color: #999;
}

.edit_form .form_group {
    display: grid;
    grid-template-columns:160px auto;
    border-bottom: 1px solid #ebebeb;
}

.edit_form .form_group.grid2 {
  grid-template-columns: 140px auto 140px auto;
  gap: 20px;
}

.edit_form .form_group.form_title .title {
    line-height: 27px;
}

.edit_form .form_group.form_radio .title {
    line-height: 26px;
}

.edit_form .form_group.middle {
    align-items: center;
}

.edit_form .form_group.middle .title {
    line-height: 1;
}

.edit_form .form_group .title {
    font-weight: bold;
    line-height: 46px;
}

.edit_form .form_group .title i {
    color: #f96742;
    margin-left: 5px;
}

.edit_form .form_group > * {
    padding: 20px 0;
}

.edit_form .form_group .input_tit {
    padding: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.edit_form .form_group .input_tit input {
    padding: 25px 0;
}

.edit_form .form_group .input_tit small {
    color: #aaa;
    flex-shrink: 0;
    font-size: 13px;
}

@media (max-width: 767px) {
    .edit_form .form_group .input_tit small {
        font-size: 12px;
    }
}
.edit_form .input_group .input_btn {
  display: grid;
  grid-template-columns: 400px auto;
  gap: 10px;
  justify-content: left;
}
.edit_form .input_group .input_btn.select_input {
  grid-template-columns: 150px 400px;
}
.edit_form .input_group .input_btn > * + * {
  margin-top: 0;
}
.edit_form .input_group > * + * {
    margin-top: 15px;
}

.edit_form .round {
    grid-column: 1/span 2;
    background: #fff1ee;
    height: 54px;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 3px;
}

.edit_form .round p {
    font-weight: bold;
}

.edit_form .round p strong {
    color: #f96742;
    vertical-align: middle;
    margin-right: 5px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .edit_form .round p strong {
        font-size: 16px;
    }
}


.edit_form .zoom_list {
    display: flex;
    justify-content: space-between;
}

.edit_form .file_upload .input {
    background: #f7f7f7;
    color: #aaa;
    position: relative;
    cursor: pointer;
}

.edit_form .file_upload.dragging .input {
    color: #d0d0d0;
}

.edit_form .thumb_group {
    display: flex;
    gap: 5px;
}

.edit_form .thumb_view {
    width: 320px;
    background: url(../../images/thumb_file.svg) no-repeat center;
    background-size: 30px auto;
    background-color: #f7f7f7;
}

.edit_form .thumb_file .file_name {
    background: url(../../images/thumb_file.svg) no-repeat left center;
    background-size: 15px auto;
}

.edit_form .coupon_group {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.edit_form .coupon_group li {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.edit_form .coupon_group li > div {
    display: flex;
    gap: 40px;
}

.edit_form .coupon_group .select_box {
    display: grid;
    grid-template-columns:150px 150px;
    gap: 5px;
}

.edit_form .editor {
    border-radius: 3px;
    border: 1px solid #ebebeb;
}

@media (max-width: 767px) {
    .edit_form .form_group {
        display: block;
    }
    .edit_form .form_group > * {
        padding: 15px 0;
    }
    .edit_form .form_group .input_group {
        padding-top: 0;
    }
    .edit_form .form_group .input_group .input_btn {
        grid-template-columns: auto 125px;
        justify-content: normal;
    }
    .edit_form .form_group .input_group .input_btn.select_input {
        grid-template-columns: 125px auto;
    }
    .edit_form .form_group .input_tit input {
        padding: 0;
        height: 40px;
    }
    .edit_form .form_group .title {
        line-height: 1.5 !important;
    }
    .edit_form .round {
        height: 45px;
        padding: 0 10px;
        margin-bottom: 15px;
    }
    .edit_form .zoom_list {
        flex-direction: column;
        gap: 15px;
    }
    .edit_form .file_upload .input span {
        display: none;
    }
    .edit_form .coupon_group li {
        flex-direction: column;
    }
    .edit_form .coupon_group li > div {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }
    .edit_form .coupon_group li .select_box {
        grid-template-columns:1fr 1fr;
    }
    .edit_form .coupon_group li .date_group {
        display: grid;
        grid-template-columns:1fr 1fr;
        gap: 5px;
    }
    .edit_form .coupon_group li .date_group .date_box {
        width: 100%;
    }
    .edit_form .coupon_group li .bk_black {
        margin-top: 10px;
    }
    .edit_form .thumb_view {
        width: 100%;
    }
    .edit_form .thumb_group {
        flex-direction: column;
        gap: 10px;
    }
}

.date_group {
  display: flex;
  gap: 20px;
}
.date_group > div + div {
  position: relative;
  padding-left: 30px;
}
.date_group > div + div::before {
  content: "~";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  font-size: 20px;
}
@media (max-width: 767px) {
  .date_group > div + div::before {
    font-size: 17px;
  }
}
.date_group .date_time {
  display: grid;
  grid-template-columns: 150px 85px 85px;
  gap: 5px;
}
.date_group .date_box {
  width: 150px;
  display: grid;
  grid-template-columns: auto 17px;
  align-items: center;
  padding: 0 15px;
  border: 1px solid #ebebeb;
  border-radius: 3px;
  height: 46px;
  background: #fff;
}
.date_group.sm {
  gap: 10px;
}
.date_group.sm > div + div {
  padding-left: 20px;
}
.date_group.sm .date_box {
  height: 36px;
  padding: 0 10px;
  width: 125px;
}
.date_group.sm input {
  font-size: 13px;
}
@media (max-width: 767px) {
  .date_group.sm input {
    font-size: 12px;
  }
}
@media (max-width: 767px) {
  .date_group {
    flex-direction: column;
    gap: 10px;
  }
  .date_group > div + div {
    padding-left: 0;
  }
  .date_group > div + div::before {
    content: none;
  }
  .date_group .date_time {
    grid-template-columns: 150px 1fr 1fr;
  }
  .date_group .date_box {
    height: 40px;
  }
}

.file_list {
    margin-top: 0 !important;
}

.file_list li {
    width: 550px;
    display: grid;
    grid-template-columns:auto 22px;
    gap: 15px;
    margin-top: 15px;
}

.file_list li:first-child {
    margin-top: 20px;
}

.file_list .file_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    min-width: 0;
    line-height: 1;
}

.file_list .file_name_group {
    display: flex;
    gap: 15px;
}

.file_list .file_name_group .preview_label {
    height: 24px;
    line-height: 24px;
    border-radius: 3px;
    padding: 0 7px;
    background: #f30;
    color: #fff;
    font-size: 12px;
}

@media (max-width: 767px) {
    .file_list .file_name_group .preview_label {
        font-size: 10px;
    }
}

.file_list .file_name {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 25px;
    line-height: 1.5;
    background: url(../../images/ic_upload.svg) no-repeat left center;
    background-size: 15px auto;
}

.file_list .file_size {
    color: #999;
    flex-shrink: 0;
}

.file_list .file_status {
    display: flex;
    align-items: center;
    justify-content: center;
}

.file_list .loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 100%;
}

.file_list .loading span {
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #f96742;
    border-radius: 100px;
    animation: loading 1s linear infinite;
}

.file_list .loading span:nth-child(1) {
    animation-delay: 0s;
}

.file_list .loading span:nth-child(2) {
    animation-delay: 0.2s;
}

.file_list .loading span:nth-child(3) {
    animation-delay: 0.4s;
}

.file_list .remove_btn, .file_list .down_btn {
    text-indent: -9999px;
    width: 10px;
    height: 100%;
    background: url(../../images/close.svg) no-repeat center;
    background-size: contain;
}
.file_list .down_btn {
    width: 12px;
    background: url("../../images/ic_download_black.svg") no-repeat center;
    background-size: contain;
}
@media (max-width: 767px) {
    .file_list li {
        width: 100%;
    }
}

.detail_thumb {
    padding: 40px 0;
    background: #f7f7f7;
    position: relative;
    overflow: hidden;
}

.detail_thumb::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .15;
    filter: blur(70px);
    background-size: cover !important;
}

.detail_thumb .inner {
    display: grid;
    grid-template-columns:auto 360px;
    gap: 40px;
}

.detail_thumb .inner .info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    color: #000;
    gap: 15px;
}

.detail_thumb .blt {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.detail_thumb .ic_btn {
    display: flex;
    gap: 20px;
}

.detail_thumb .ic_btn button {
    width: 19px;
    height: 19px;
    text-indent: -9999px;
}

.detail_thumb .ic_btn button.share {
    background: url(../../images/ic_share.svg) no-repeat center;
    background-size: contain;
}

.detail_thumb .ic_btn button.report {
    background: url(../../images/ic_report.svg) no-repeat center;
    background-size: contain;
}

.detail_thumb .tit {
    font-weight: bold;
    min-height: 95px;
    margin: 15px 0 10px;
    font-size: 32px;
}

@media (max-width: 767px) {
    .detail_thumb .tit {
        font-size: 22px;
    }
}

.detail_thumb .tit.auto {
    min-height: auto;
}

.detail_thumb .star_box {
    letter-spacing: 0.5px;
}

.detail_thumb .star_box strong {
    margin-left: 8px;
}

.detail_thumb .apply .flexbox p {
    font-weight: bold;
    font-size: 18px;
}

@media (max-width: 767px) {
    .detail_thumb .apply .flexbox p {
        font-size: 16px;
    }
}

.detail_thumb .apply .flexbox span {
    opacity: 0.5;
}

.detail_thumb .apply .bar {
    height: 5px;
    background: rgba(0, 0, 0, .1);
    position: relative;
    margin-top: 10px;
}

.detail_thumb .apply .bar .per {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: #f96742;
}

.detail_thumb .avatar {
    gap: 10px;
}

.detail_thumb .avatar .img {
    width: 50px;
    height: 50px;
}

.detail_thumb .avatar .name {
    font-size: 16px;
}

@media (max-width: 767px) {
    .detail_thumb .avatar .name {
        font-size: 15px;
    }
}

.detail_thumb .avatar .star {
    display: flex;
    align-items: center;
    gap: 5px;
    letter-spacing: 0.5px;
    margin-top: 5px;
}

.detail_thumb .avatar .star span {
    color: #333;
}

.detail_thumb .info_box, .detail_thumb .price {
    display: none;
}

@media (max-width: 767px) {
    .detail_thumb {
        padding: 20px 0;
    }
    .detail_thumb .inner {
        grid-template-columns:1fr;
        gap: 20px;
    }
    .detail_thumb .inner .info {
        order: 2;
    }
    .detail_thumb .inner .thumb {
        order: 1;
    }
    .detail_thumb .blt {
        gap: 5px;
    }
    .detail_thumb .ic_btn {
        gap: 10px;
    }
    .detail_thumb .tit {
        min-height: auto;
        font-size: 18px;
        margin: 10px 0 0;
    }
    .detail_thumb .avatar {
        margin-top: 20px;
        padding: 10px;
        background: hsla(0, 0%, 100%, .5);
        border-radius: 10px;
        border: 1px solid #ebebeb;
    }
    .detail_thumb .avatar .img {
        width: 35px;
        height: 35px;
    }
    .detail_thumb .avatar .star {
        margin-top: 0;
    }
    .detail_thumb .price {
        display: block;
        text-align: right;
        font-weight: bold;
        font-size: 28px;
    }
}
@media (max-width: 767px)and (max-width: 767px) {
    .detail_thumb .price {
        font-size: 19px;
    }
}

@media (max-width: 767px) {
    .detail_thumb .info_box {
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin: 20px 0;
    }
    .detail_thumb .info_box dl {
        display: grid;
        grid-template-columns:70px auto;
    }
    .detail_thumb .info_box dl dt {
        font-weight: bold;
    }
    .detail_thumb .star_box {
        margin-top: 10px;
    }
}

.radio_li {
    display: flex;
    gap: 40px;
}

@media (max-width: 767px) {
    .radio_li:not(.line1) {
        flex-direction: column;
        gap: 10px;
    }
}

.grid_input {
    display:inline-grid;
    grid-template-columns:550px auto;
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
}

.grid_input.full {
    display: flex;
}

.grid_input.full button {
    flex-shrink: 0;
}

.grid_input.sm {
    grid-template-columns:150px auto;
    justify-content: flex-start;
}

@media (max-width: 767px) {
    .grid_input {
        grid-template-columns:auto 125px !important;
        justify-content: normal;
        gap: 5px;
    }
}

.flex_input {
  display: flex;
  align-items: center;
  gap: 20px;
}
.flex_input > div {
  display: flex;
  align-items: center;
  gap: 10px;
}
.flex_input > div input {
  width: 150px;
}
@media (max-width: 767px) {
  .flex_input {
    display: grid;
    gap: 10px;
  }
  .flex_input > div {
    display: grid;
    grid-template-columns: 55px auto;
    gap: 5px;
  }
  .flex_input > div input {
    width: 160px;
  }
}

.detail_info {
    display: grid;
    grid-template-columns:auto 360px;
    gap: 40px;
    margin-top: 50px;
    align-items: flex-start;
}

.detail_info .sub_title {
    border-bottom: 2px solid #333;
}

.detail_info .detail_wrap {
    min-width: 0;
}

.detail_info .side_box {
    position: sticky;
    top: 67px;
    border-radius: 10px;
    border: 1px solid #ebebeb;
    padding: 30px 20px;
}

.detail_info .side_box .price {
    font-weight: bold;
    line-height: 1;
    color: #000;
    margin-bottom: 20px;
    font-size: 28px;
}

@media (max-width: 767px) {
    .detail_info .side_box .price {
        font-size: 19px;
    }
}

.detail_info .side_box .title {
    font-weight: bold;
    color: #000;
    margin-bottom: 20px;
    font-size: 20px;
}

@media (max-width: 767px) {
    .detail_info .side_box .title {
        font-size: 17px;
    }
}

.detail_info .side_box .price_info {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ebebeb;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.detail_info .side_box .price_info dl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 15px;
}

@media (max-width: 767px) {
    .detail_info .side_box .price_info dl {
        font-size: 14px;
    }
}

.detail_info .side_box .price_info dl.total {
    font-weight: bold;
    color: #000;
    font-size: 18px;
}

@media (max-width: 767px) {
    .detail_info .side_box .price_info dl.total {
        font-size: 16px;
    }
}

.detail_info .side_box .agree_li {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.detail_info .side_box .agree_li li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #666;
}

.detail_info .side_box .agree_li li button {
    color: #666;
}

.detail_info .side_box .apply_btn {
    margin-top: 30px;
}

.detail_info .side_box .apply_btn button {
    border-radius: 10px;
}

.detail_info .info_box {
    border-radius: 10px;
    background: #f7f7f7;
    padding: 20px;
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.detail_info .info_box dl {
    display: grid;
    grid-template-columns:70px auto;
}

.detail_info .info_box dl dt {
    font-weight: bold;
    color: #777;
}

@media (max-width: 767px) {
    .detail_info {
        display: block;
        margin-top: 0;
    }
    .detail_info .side_box {
        display: none;
    }
    .detail_info .side_box.block {
        display: block;
        margin-top: 30px;
        padding: 20px 10px;
        background: #f7f7f7;
    }
    .detail_info .side_box .price_info {
        gap: 10px;
    }
}

.btn_like.active path {
    fill: #ff3300;
}

.star_box {
    display: flex;
    gap: 2px;
}

.star_box i {
    width: 16px;
    height: 16px;
}

.star_box .star {
    background: url(../../images/ic_star_off.svg) no-repeat center;
    background-size: contain;
}

.star_box .star.active, .star_box .star.hovered {
    background: url(../../images/ic_star.svg) no-repeat center;
    background-size: contain;
}

.detail_btn {
    display: grid;
    grid-template-columns:auto 60px;
    gap: 10px;
}

.detail_btn button {
    border-radius: 10px;
}

.detail_btn button.coupon_btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    grid-column: 1/span 2;
}

.detail_btn button.coupon_btn span {
    min-width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    border-radius: 100px;
    background: #fff;
    padding: 0 7px;
    color: #ff3300;
    font-weight: bold;
}

.detail_btn button.btn_like {
    width: 100%;
    height: 100%;
    border: 1px solid #ebebeb;
    background: #fff;
}

.detail_btn button.btn_like svg {
    width: 28px;
    vertical-align: middle;
}

@media (max-width: 767px) {
    .detail_btn {
        margin-top: 20px;
        gap: 5px;
        grid-template-columns:auto 50px;
    }
    .detail_btn.fixed {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: 15px 10px;
        background: #fff;
        z-index: 10;
        border-top: 1px solid #ebebeb;
    }
    .detail_btn.fixed .coupon_btn {
        display: none;
    }
}

.time_box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 46px;
    border: 1px solid #ff3300;
    background: #fff1ee;
    border-radius: 10px;
    padding: 0 20px;
    margin: 30px 0;
    font-size: 15px;
}

@media (max-width: 767px) {
    .time_box {
        font-size: 14px;
    }
}

.time_box .date {
    padding-left: 20px;
    position: relative;
}

.time_box .date::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 15px;
    height: 15px;
    background: url(../../images/ic_date.svg) no-repeat center;
    background-size: contain;
}

.time_box .time {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #ff3300;
}

.time_box .time span {
    font-weight: bold;
    vertical-align: middle;
    font-size: 18px;
}

@media (max-width: 767px) {
    .time_box .time span {
        font-size: 16px;
    }
}

.time_box .time strong {
    display: inline-block;
    margin-left: 5px;
}

@media (max-width: 767px) {
    .time_box {
        margin: 20px 0;
    }
}

.detail_tab {
    display: flex;
    gap: 40px;
    background: #fff;
    border-bottom: 1px solid #ebebeb;
    margin-top: -15px;
    position: sticky;
    z-index: 2;
    top: 57px;
}

.detail_tab li {
    color: #000;
    cursor: pointer;
    padding: 15px 0;
    position: relative;
    font-size: 16px;
}

@media (max-width: 767px) {
    .detail_tab li {
        font-size: 15px;
    }
}

.detail_tab li.active {
    color: #f96742;
    font-weight: bold;
}

.detail_tab li.active::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #f96742;
}

@media (max-width: 767px) {
    .detail_tab {
        gap: 10px;
        margin-top: 0;
        top: 0;
    }

    .detail_tab li {
        width: 100%;
        text-align: center;
    }
}

.detail_cont + .detail_cont {
    margin-top: 50px;
}

.detail_cont h2 {
    margin-bottom: 20px;
}

.detail_cont .round_list {
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    gap: 20px;
    margin: 30px 0;
}

.detail_cont .round_list li {
    border-radius: 10px;
    border: 1px solid #ebebeb;
    padding: 20px;
}

.detail_cont .round_list .num {
    color: #f96742;
    font-weight: bold;
    margin-bottom: 20px;
    font-size: 16px;
}

@media (max-width: 767px) {
    .detail_cont .round_list .num {
        font-size: 15px;
    }
}

.detail_cont .round_list div {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.detail_cont .round_list div dl {
    display: grid;
    grid-template-columns:55px auto;
}

.detail_cont .round_list div dl dt {
    font-weight: bold;
    color: #000;
}

.detail_cont .detail_noti {
    border-radius: 10px;
    background: #f7f7f7;
    padding: 20px;
    margin: 30px 0;
}

.detail_cont .detail_noti div + div {
    margin-top: 10px;
}

.detail_cont .pack_list {
  margin: 30px 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.detail_cont .contents img {
    vertical-align: top;
}

@media (max-width: 767px) {
    .detail_cont + .detail_cont {
        margin-top: 30px;
    }
    .detail_cont h2 {
        margin-bottom: 10px;
    }
    .detail_cont .round_list {
        grid-template-columns:1fr;
        gap: 10px;
        margin: 20px 0;
    }
    .detail_cont .round_list li {
        padding: 15px 10px;
    }
    .detail_cont .round_list .num {
        margin-bottom: 10px;
    }
    .detail_cont .round_list div {
        gap: 5px;
    }
    .detail_cont .detail_noti {
        padding: 15px 10px;
        margin: 20px 0;
    }
    .detail_cont .pack_list {
        margin: 20px 0;
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

.teacher_box {
    border-radius: 10px;
    border: 1px solid #ebebeb;
    padding: 20px;
}

.teacher_box .tit {
    display: flex;
    gap: 15px;
    align-items: center;
}

.teacher_box .tit p {
    font-weight: bold;
    color: #000;
    font-size: 16px;
}

@media (max-width: 767px) {
    .teacher_box .tit p {
        font-size: 15px;
    }
}

.teacher_box .tit svg {
    width: 18px;
    height: 18px;
}

.teacher_box .info {
    display: grid;
    grid-template-columns:75px auto;
    gap: 20px;
    align-items: center;
    margin: 20px 0;
}

.teacher_box .info .img {
    width: 75px;
    height: 75px;
}

.teacher_box .info .info_list {
    display: grid;
    grid-template-columns:200px auto;
    gap: 10px 0;
}

.teacher_box .info .info_list dl {
    display: flex;
    align-items: center;
    gap: 10px;
}

.teacher_box .info .info_list dl dt {
    font-weight: bold;
    color: #000;
    padding-left: 26px;
}

.teacher_box .info .info_list dl dt.star {
    background: url(../../images/info_star.svg) no-repeat left center;
    background-size: 16px 16px;
}

.teacher_box .info .info_list dl dt.review {
    background: url(../../images/info_review.svg) no-repeat left center;
    background-size: 16px 16px;
}

.teacher_box .info .info_list dl dt.call {
    background: url(../../images/info_call.svg) no-repeat left center;
    background-size: 16px 16px;
}

.teacher_box .info .info_list dl dt.mail {
    background: url(../../images/info_mail.svg) no-repeat left center;
    background-size: 16px 16px;
}

.teacher_box .info .info_list dl dd {
    color: #999;
}

.teacher_box .info .info_list ul {
    grid-column: 1/span 2;
    display: flex;
  	flex-wrap: wrap;
}
.teacher_box .info .info_list ul li + li {
    position: relative;
    padding-left: 15px;
    margin-left: 10px;
}

.teacher_box .info .info_list ul li + li::before {
    content: "/";
    color: #d0d0d0;
    position: absolute;
    top: 0;
    left: 0;
}
.teacher_box .info .info_list ul li:last-child::before {
  content: none;
}

.teacher_box .info .info_list ul a {
    padding-left: 26px;
}


.teacher_box .record_list {
    border-radius: 10px;
    background: #f7f7f7;
    padding: 20px;
}

.teacher_box .record_list ul {
    max-height: 95px;
    line-height: 1.7;
    overflow: hidden;
}

.teacher_box .record_list button {
    display: block;
    width: 100%;
    margin-top: 10px;
}

.teacher_box .record_list button i {
    width: 10px;
    height: 10px;
    background: url(../../images/arrow.svg) no-repeat center;
    background-size: contain;
    transform: rotate(90deg);
    margin-left: 10px;
}

.teacher_box .record_list.active ul {
    max-height: none;
}

.teacher_box .record_list.active i {
    transform: rotate(-90deg);
}
@media (max-width: 767px) {
    .teacher_box {
        padding: 15px 10px;
    }
    .teacher_box .tit {
        gap: 10px;
    }
    .teacher_box .info {
        display: block;
        margin: 15px 0;
    }
    .teacher_box .info .img {
        width: 55px;
        height: 55px;
    }
    .teacher_box .info .info_list {
        grid-template-columns:145px auto;
        gap: 5px 0;
    }
    .teacher_box .info .info_list .mo_line1 {
        grid-column: 1/span 2;
    }
    .teacher_box .info .info_list ul {
        flex-direction: column;
        gap: 5px;
    }
    .teacher_box .info .info_list ul li + li {
        padding-left: 0;
        margin-left: 0;
    }
    .teacher_box .info .info_list ul li + li::before {
        content: none;
    }
    .teacher_box .record_list {
        padding: 15px 10px;
    }
}

.facebook {
  background: url("../../images/ic_facebook.svg") no-repeat left center;
  background-size: 16px 16px;
}

.insta {
  background: url("../../images/ic_instagram.svg") no-repeat left center;
  background-size: 16px 16px;
}

.youtube {
  background: url("../../images/ic_youtube.svg") no-repeat left center;
  background-size: 16px 16px;
}

.blog {
  background: url("../../images/ic_blog.svg") no-repeat left center;
  background-size: 16px 16px;
}

.band {
  background: url("../../images/ic_band.svg") no-repeat left center;
  background-size: 16px 16px;
}

.review_box {
    border-radius: 10px;
    border: 1px solid #ebebeb;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fff;
}

.review_box .btn_wrap {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: right;
}

@media (max-width: 767px) {
    .review_box {
        padding: 15px 10px;
    }
}

.write_list {
    margin-top: 40px;
}

.write_list > li + li {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #ebebeb;
}

.write_list .flexbox {
    margin-bottom: 15px;
}

.write_list .flexbox small {
    display: inline-block;
    margin-left: 15px;
    color: #999;
}

.write_list .avatar {
    gap: 10px;
}

.write_list .img {
    width: 35px;
    height: 35px;
}

.write_list .text {
    display: flex;
    gap: 10px;
}

.write_list .text label {
    flex-shrink: 0;
}

.write_list .text p {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.write_list .lock {
    padding-left: 20px;
    background: url(../../images/ic_lock.svg) no-repeat left center;
    background-size: 14px 14px;
}

.write_list .edit_btn span {
    position: relative;
}

.write_list .edit_btn span + span {
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
}

.write_list .edit_btn span + span::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #d0d0d0;
}

.write_list .edit_btn button {
    color: #666;
}

.write_list .re_btn {
    margin-top: 15px;
}

.write_list .re_box {
    border-radius: 10px;
    background: #f7f7f7;
    padding: 20px;
    margin-top: 20px;
}

.write_list .re_box .re_text {
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ebebeb;
}

.write_list .star_box span {
    margin-left: 3px;
    font-weight: bold;
}

@media (max-width: 767px) {
    .write_list {
        margin-top: 20px;
    }
    .write_list li + li {
        margin-top: 15px;
        padding-top: 15px;
    }
    .write_list .re_box {
        padding: 15px 10px;
    }
    .write_list .re_box .re_text {
        margin-bottom: 15px;
        padding-bottom: 15px;
    }
    .write_list .flexbox {
        gap: 10px;
    }
    .write_list .avatar {
        gap: 5px;
        min-width: 0;
    }
    .write_list .avatar .flex {
        min-width: 0;
    }
    .write_list .avatar small {
        flex-shrink: 0;
    }
    .write_list .img {
        width: 30px;
        height: 30px;
    }
    .write_list .flexbox small {
        margin-left: 5px;
    }
    .write_lis .edit_btn {
        flex-shrink: 0;
    }
    .write_list .edit_btn span + span {
        margin-left: 5px;
        padding-left: 5px;
    }
    .write_list .star_box .star {
        width: 10px;
        height: 10px;
    }
}

.preview_box {
    position: relative;
    margin: 30px 0;
}

.preview_box .swiper {
    border-radius: 10px;
}

.preview_box .swiper-slide {
    opacity: 0.5;
}

.preview_box .swiper-slide.swiper-slide-active {
    opacity: 1;
}

.preview_box .swiper_arrow {
    margin-top: -22px;
}

.preview_box .swiper_prev {
    left: -22px;
}

.preview_box .swiper_next {
    right: -22px;
}

.preview_box .swiper_num {
    display: none;
}

.preview_box .thumb > * {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 767px) {
    .preview_box {
        margin: 20px 0;
    }
    .preview_box .swiper_num {
        display: flex;
    }
}

.layer_pop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .5);
    z-index: 10;
    display: none;
}

.layer_pop .pop_box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 5px;
    width: calc(100% - 20px);
}

.layer_pop .pop_box.sm {
    max-width: 450px;
}

.layer_pop .pop_box.md {
    max-width: 650px;
}

.layer_pop .pop_box.lg {
    max-width: 900px;
}
.layer_pop .pop_box.auto {
  max-width: calc(100% - 20px);
  width: auto;
}

.layer_pop .pop_tit {
    padding: 15px 30px;
    border-bottom: 1px solid #ebebeb;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.layer_pop .pop_tit p {
    font-weight: bold;
    color: #000;
    font-size: 18px;
}

@media (max-width: 767px) {
    .layer_pop .pop_tit p {
        font-size: 16px;
    }
}

.layer_pop .pop_tit .pop_close {
    width: 18px;
    height: 18px;
    text-indent: -9999px;
    background: url(../../images/pop_close.svg) no-repeat center;
    background-size: contain;
}

.layer_pop .pop_con {
    padding: 30px;
    max-height: 80vh;
    overflow: auto;
    overflow-x: hidden;
}

.layer_pop .pop_con .cont + .cont {
    margin-top: 30px;
}

.layer_pop .pop_con .cont > .title {
    font-weight: bold;
    color: #000;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 15px;
}

@media (max-width: 767px) {
    .layer_pop .pop_con .cont > .title {
        font-size: 14px;
    }
}

.layer_pop .pop_con .text_box {
  padding: 20px;
  border-radius: 10px;
  background: #f7f7f7;
}

.layer_pop .pop_noti {
    margin-top: 20px;
}

.layer_pop .pop_noti li {
    position: relative;
    padding-left: 10px;
    color: #999;
    font-size: 13px;
}

@media (max-width: 767px) {
    .layer_pop .pop_noti li {
        font-size: 12px;
    }
}

.layer_pop .pop_noti li::before {
    content: "-";
    position: absolute;
    top: 0;
    left: 0;
}

.layer_pop .pop_noti.md {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.layer_pop .pop_noti.md li {
  color: #333;
  font-size: 14px;
}

.layer_pop .pop_thumb {
    display: grid;
    grid-template-columns: 90px auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
}
.layer_pop .pop_edit dl {
    display: grid;
    align-items: center;
    grid-template-columns: 85px auto;
    gap: 10px;
}
.layer_pop .pop_edit dl.grid1 {
    grid-template-columns: 1fr;
}
.layer_pop .pop_edit dl dt {
    font-weight: bold;
}
.layer_pop .pop_edit dl + dl {
    margin-top: 20px;
}
.layer_pop .pop_edit .star_box {
    gap: 5px;
}
.layer_pop .pop_edit .star_box i {
    width: 22px;
    height: 22px;
}
.layer_pop .pop_btn {
    border-top: 1px solid #ebebeb;
    padding: 15px 30px;
    display: flex;
    gap: 10px;
    justify-content: center;
}
.layer_pop .pop_btn .btn {
    border-radius: 3px;
}
.layer_pop .pop_btn.between {
  justify-content: space-between;
  align-items: center;
}
.layer_pop .pop_btn.between div {
  display: flex;
  gap: 10px;
}
@media (max-width: 767px) {
    .layer_pop .pop_tit {
        padding: 10px;
    }
    .layer_pop .pop_tit .pop_close {
        width: 14px;
        height: 14px;
    }
    .layer_pop .pop_con {
        padding: 10px 10px 20px;
    }
    .layer_pop .text_box {
        padding: 15px 10px;
    }
    .layer_pop .pop_noti {
        margin-top: 20px;
    }
    .layer_pop .pop_btn {
        padding: 10px;
    }
}

.coupon_list {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.coupon_list .info {
    position: relative;
}

.coupon_list .flexbox {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
    padding: 0 30px;
}

.coupon_list .flexbox .tit {
    color: #f96742;
    font-weight: 700;
    margin-bottom: 5px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .coupon_list .flexbox .tit {
        font-size: 16px;
    }
}

.coupon_list .flexbox .date {
    color: #999;
}

.coupon_list .flexbox .price {
    color: #000;
    font-weight: bold;
    font-size: 32px;
}

@media (max-width: 767px) {
    .coupon_list .flexbox .price {
        font-size: 22px;
    }
}

.coupon_list button {
    margin-top: 5px;
    border-radius: 0;
}

.coupon_list button i {
    vertical-align: middle;
    margin-right: 10px;
}

@media (max-width: 767px) {
    .coupon_list {
        gap: 20px;
    }
}

.coupon_chk {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.coupon_chk input {
    display: none;
}

.coupon_chk input:checked + label {
    border-color: #f96742;
}

.coupon_chk input:checked + label i {
    border-color: #f96742;
}

.coupon_chk input:checked + label i::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    width: 14px;
    height: 14px;
    background: #f96742;
    border-radius: 100px;
}

.coupon_chk label {
    border: 1px solid #ebebeb;
    padding: 20px;
    border-radius: 10px;
    display: block;
    cursor: pointer;
}

.coupon_chk label .price {
    color: #f96742;
    font-weight: bold;
    position: relative;
    font-size: 18px;
}

@media (max-width: 767px) {
    .coupon_chk label .price {
        font-size: 16px;
    }
}

.coupon_chk label .price i {
    width: 26px;
    height: 26px;
    border: 1px solid #ebebeb;
    border-radius: 100px;
    position: relative;
    margin-right: 10px;
    vertical-align: middle;
    position: relative;
}

.coupon_chk label .tit {
    font-weight: bold;
    color: #000;
    margin: 15px 0 10px;
}

.coupon_chk label .date {
    color: #999;
    font-size: 13px;
}

@media (max-width: 767px) {
    .coupon_chk label .date {
        font-size: 12px;
    }
}

.top_sorting {
    margin-top: 50px;
}

.top_sorting > * + * {
    margin-top: 20px;
}

@media (max-width: 767px) {
    .top_sorting {
        margin-top: 30px;
    }
}

.top_tab {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #333;
}

.top_tab > ul {
    display: flex;
    position: relative;
    z-index: 1;
}

.top_tab > ul > li {
    border: 1px solid #ebebeb;
    border-bottom: 1px solid #333;
    border-radius: 10px 10px 0 0;
    margin-bottom: -1px;
}

.top_tab > ul > li + li {
    border-left: 0;
}

.top_tab > ul > li.active {
    border: 1px solid #333;
    border-bottom: 1px solid #fff;
}

.top_tab > ul > li.active a {
    color: #000;
    font-weight: bold;
}

.top_tab > ul > li.active strong {
    color: #f96742;
}

.top_tab > ul a {
    display: block;
    /*width: 135px;*/
    height: 45px;
    min-width: 150px;
    padding: 0 20px;
    line-height: 45px;
    color: #666;
    text-align: center;
}

.top_tab > ul a strong {
    font-size: 13px;
}

@media (max-width: 767px) {
    .top_tab > ul a strong {
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .top_tab {
        flex-direction: column;
        gap: 10px;
        border-bottom: none;
    }
    .top_tab > ul {
        border-bottom: 1px solid #333;
        width: 100%;
    }
    .top_tab > ul > li {
        width: 100%;
    }
    .top_tab > ul > li a {
        width: 100%;
        height: 40px;
        line-height: 40px;
        padding: 0;
        min-width: auto;
    }
    .top_tab .info_hover {
        margin: 0 0 0 auto;
    }
}

.sort_box {
    padding: 15px 20px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f7f7f7;
}


@media (max-width: 767px) {
    .sort_box {
        padding: 0;
        border-radius: 0;
        background: none;
        flex-direction: column;
        gap: 20px;
    }
    .sort_box .sort_li {
        margin: 0 0 0 auto;
    }
    .sort_box button {
        width: 100%;
    }
}
.sort_box i {
    width: 18px;
    height: 18px;
    margin-right: 10px;
    vertical-align: middle;
}

.ic_edit {
  background: url("../../images/ic_edit.svg") no-repeat center;
  background-size: contain;
}

.ic_contents {
  background: url("../../images/ic_contents.svg") no-repeat center;
  background-size: contain;
}

.ic_pack {
  background: url("../../images/ic_pack.svg") no-repeat center;
  background-size: contain;
}
.ic_vibe {
  background: url("../../images/ic_vibe.svg") no-repeat center;
  background-size: contain;
}

.sort_li {
    display: flex;
}

.sort_li li + li {
    margin-left: 10px;
    padding-left: 10px;
    position: relative;
}

.sort_li li + li::before {
    content: "";
    position: absolute;
    top: 5px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #d0d0d0;
}

.sort_li a {
    color: #666;
}

.sort_li li.active a {
    color: #f96742;
    font-weight: bold;
}

.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin-top: 50px;
}

.pagination a {
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    border-radius: 100px;
}

.pagination a.arrow {
    border: 1px solid #ebebeb;
    text-indent: -9999px;
    background-size: auto 8px !important;
}

.pagination a.first {
    background: url(../../images/ic_arrow2.svg) no-repeat center;
    background-size: contain;
    transform: rotate(180deg);
}

.pagination a.prev {
    background: url(../../images/ic_arrow1.svg) no-repeat center;
    background-size: contain;
    transform: rotate(180deg);
}

.pagination a.last {
    background: url(../../images/ic_arrow2.svg) no-repeat center;
    background-size: contain;
}

.pagination a.next {
    background: url(../../images/ic_arrow1.svg) no-repeat center;
    background-size: contain;
}

.pagination a.active {
    background: #f96742;
    color: #fff;
    font-weight: bold;
}

.pagination a:not(.active):hover {
    background-color: #f7f7f7;
}

@media (max-width: 767px) {
    .pagination {
        margin-top: 30px;
    }

    .pagination a {
        width: 30px;
        height: 30px;
        line-height: 30px;
    }
}

.apply_box {
    padding: 20px 0;
    border-bottom: 1px solid #ebebeb;
    font-size: 15px;
}

@media (max-width: 767px) {
    .apply_box {
        font-size: 14px;
    }
}

.apply_box .thumb_box {
    display: grid;
    grid-template-columns:90px auto;
    gap: 20px;
    align-items: start;
}

.apply_box .thumb_box .price {
    font-weight:  bold;
    margin-top: 10px;
    font-size: 18px;
}

@media (max-width: 767px) {
    .apply_box .thumb_box .price {
        font-size: 16px;
    }
}

.apply_box .line {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ebebeb;
}

.apply_box .form_group {
    display: grid;
    grid-template-columns: 150px auto;
}

.apply_box .form_group + .form_group {
    margin-top: 10px;
}

.apply_box .form_group .tit {
    font-weight: bold;
}

.apply_box .form_group .radio_tit {
    line-height: 26px;
}

.apply_box .form_group .input_tit {
    line-height: 46px;
}

.apply_box .noti {
    margin-top: 10px;
    color: #999;
}

.apply_box .noti span {
    color: #333;
}

.apply_box .coupon_info {
    margin-top: 20px;
}

.apply_box .coupon_info dl {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.apply_box .coupon_info dl dt {
    font-weight: bold;
}

.apply_box .coupon_info dl dd {
    color: #f96742;
}

.apply_box .coupon_info dl + dl {
    padding-top: 10px;
    margin-top: 10px;
    border-top: 1px dashed #ebebeb;
}

.apply_box .grid_input {
    grid-template-columns:500px auto;
}

@media (max-width: 767px) {
    .apply_box {
        gap: 10px;
    }

    .apply_box .form_group {
        grid-template-columns:100px auto;
    }
}

.complete_info {
    display: grid;
    grid-template-columns:270px auto;
    gap: 40px;
}

.complete_info .info_box .tit {
    font-weight: bold;
    color: #000;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 2px solid #333;
    font-size: 18px;
}

@media (max-width: 767px) {
    .complete_info .info_box .tit {
        font-size: 16px;
    }
}

.complete_info .info_box dl {
    display: grid;
    grid-template-columns:110px auto;
    gap: 10px 0;
}

.complete_info .point {
  margin-bottom: 20px;
  color: #f96742;
  font-weight: bold;
  font-size: 24px;
}

@media (max-width: 767px) {
  .complete_info .point {
    font-size: 18px;
  }
}
.complete_info .point_input {
  margin-bottom: 20px;
  display: grid;
  grid-template-columns: 150px auto;
  gap: 10px;
  align-items: center;
}

@media (max-width: 767px) {
    .complete_info {
        grid-template-columns:1fr;
        gap: 20px;
    }
}

.tit_blt_wrap {
    display: flex;
    align-items: center;
    gap: 10px;
}
.tit_blt_wrap .tit_blt {
    display: flex;
    gap: 5px;
    font-weight: normal;
}

.complete_noti {
    background: #f7f7f7;
    padding: 70px 20px;
    border-radius: 10px;
    text-align: center;
}

.complete_noti .title {
    color: #000;
    font-weight: bold;
    font-size: 28px;
}

@media (max-width: 767px) {
    .complete_noti .title {
        font-size: 19px;
    }
}

.complete_noti .noti {
    color: #666;
    margin-top: 20px;
}

@media (max-width: 767px) {
    .complete_noti {
        padding: 30px 10px;
    }
}

.mypage {
  margin: 50px auto 0;
  width: 1200px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: 265px minmax(0, 1fr);
  gap: 40px;
  align-items: start;
}
.mypage .left_gnb {
  position: sticky;
  top: 67px;
  border: 1px solid #ebebeb;
  border-radius: 10px;
}
.mypage .left_gnb > div {
  padding: 20px;
}
.mypage .left_gnb > div + div {
  border-top: 1px solid #ebebeb;
}
.mypage .left_gnb .avatar {
  gap: 10px;
}
.mypage .left_gnb .avatar .img {
  width: 50px;
  height: 50px;
}
.mypage .left_gnb .avatar .my_id {
  color: #666;
}
.mypage .left_gnb .menu_list p {
  font-weight: bold;
  margin: 0 0 5px 10px;
}
.mypage .left_gnb .menu_list a {
  height: 40px;
  border-radius: 3px;
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 0 10px;
}
.mypage .left_gnb .menu_list i {
  width: 17px;
  height: 17px;
}
.mypage .left_gnb .menu_list i.my_ic01 {
  background: url("../../images/my_ic01.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic02 {
  background: url("../../images/my_ic02.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic03 {
  background: url("../../images/my_ic03.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic04 {
  background: url("../../images/my_ic04.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic05 {
  background: url("../../images/my_ic05.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic06 {
  background: url("../../images/my_ic06.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.my_ic07 {
  background: url("../../images/my_ic07.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic01 {
  background: url("../../images/ssem_ic01.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic02 {
  background: url("../../images/ssem_ic02.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic03 {
  background: url("../../images/ssem_ic03.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic04 {
  background: url("../../images/ssem_ic04.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic05 {
  background: url("../../images/ssem_ic05.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic06 {
  background: url("../../images/ssem_ic06.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.ssem_ic07 {
  background: url("../../images/ssem_ic07.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.school_ic01 {
  background: url("../../images/school_ic01.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.noti_ic01 {
  background: url("../../images/noti_ic01.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.noti_ic02 {
  background: url("../../images/noti_ic02.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.noti_ic03 {
  background: url("../../images/noti_ic03.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list i.noti_ic04 {
  background: url("../../images/noti_ic04.svg") no-repeat center;
  background-size: contain;
}
.mypage .left_gnb .menu_list li:hover:not(.active) a {
  background: #fff1ee;
}
.mypage .left_gnb .menu_list li.active a {
  background: #f96742;
  color: #fff;
}
.mypage .left_gnb .menu_list li.active a i {
  filter: invert(99%) sepia(70%) saturate(204%) hue-rotate(220deg) brightness(119%) contrast(100%);
}
.mypage .detail_cont .sub_title {
  border-bottom: 2px solid #333;
}
.mypage .detail_cont .item_col {
  margin-top: 10px;
}
.mypage .detail_cont .form_btn {
  display: flex;
  gap: 10px;
}
.mypage .detail_cont .form_group h4 {
  grid-column: 1/span 2;
  color: #f96742;
  margin-bottom: 20px;
}
.mypage .detail_cont .form_grid {
  display: grid;
  grid-template-columns: auto 180px;
  gap: 15px;
}
.mypage .my_box {
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.mypage .my_box .sub_title {
  padding-bottom: 0;
}
.mypage .item_col:not(.like_item) .item {
  grid-template-columns: 228px auto 180px;
}
.mypage .item_col:not(.like_item) .list_none {
  grid-template-columns: 1fr !important;
}
.mypage .item_col .payment_btn {
  display: flex;
  gap: 10px;
}
.mypage .item_btn {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-self: center;
  margin-left: 20px;
}
.mypage .item_btn .btn {
  width: 100%;
  padding: 0;
  border-radius: 3px;
}
.mypage .my_info_btn i {
  width: 10px;
  height: 10px;
  background: url("../../images/arrow.svg") no-repeat center;
  background-size: contain;
  margin-left: 10px;
  transform: rotate(90deg);
}
.mypage .my_info_btn.active i {
  transform: rotate(-90deg);
}
.mypage .my_pack {
  display: none;
  grid-column: 1/span 3;
  flex-direction: column;
  gap: 20px;
}
.mypage .my_pack.active {
  display: flex;
}
.mypage .my_pack .my_info {
  display: block;
}
.mypage .my_pack .sub_title {
  border-bottom: none !important;
  padding: 0;
}
.mypage .my_info {
  grid-column: 1/span 3;
  border: 1px solid #ebebeb;
  padding: 20px;
  background: #f7f7f7;
  border-radius: 3px;
  display: none;
}
.mypage .my_info.active {
  display: block;
}
.mypage .my_info .detail_cont {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.mypage .my_info .round_list {
  grid-template-columns: 1fr;
  margin: 0;
}
.mypage .my_info .round_list li {
  background: #fff;
}

.mypage .my_info .round_list .line_box {
  width: 100%;
  background: #fff;
  border-radius: 10px;
  border: 1px solid #ebebeb;
  padding: 20px;
}
.mypage .my_info .round_list .line_box dl {
  align-items: center;
}
.mypage .my_info .round_list .line_box dd {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mypage .my_info .round_list .line_box .line_btn {
  flex-direction: initial;
}

.mypage .my_info .round_list .num {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mypage .my_info .round_list dl {
  grid-template-columns: 110px auto;
}
.mypage .my_info .detail_noti {
  background: none;
  padding: 0 10px;
  margin: 0;
}
.mypage .file_list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mypage .file_list li {
  border: none;
  padding: 0;
  margin-top: 0;
}
.mypage .file_list li.file_item:first-child {
  margin-top: 20px;
}
.mypage .file_list .file_info {
  flex-direction: row !important;
}
.mypage .file_list.line_box li {
  width: 100%;
  background: #fff;
  border-radius: 10px;
  border: 1px solid #ebebeb;
  padding: 20px;
}
.mypage .num_box {
  padding: 10px;
  background: #edeef8;
  border-radius: 3px;
  text-align: center;
}
.mypage .edit_cont + .edit_cont {
  margin-top: 40px;
}
.mypage .file_upload {
  grid-template-columns: 400px auto;
}

.mypage .pack_group > div + div {
  padding-top: 20px;
  margin-top: 20px;
  border-top: 1px dashed transparent;
  border-image: repeating-linear-gradient(to right, #d0d0d0 0 5px, transparent 5px 10px) 1;
}
.mypage .pack_group .pack_tit a {
  display: block;
  padding: 10px;
  background: #fff1ee;
  border-radius: 3px;
  font-weight: bold;
  font-size: 16px;
}
@media (max-width: 767px) {
  .mypage .pack_group .pack_tit a {
    font-size: 15px;
  }
}
.mypage .pack_group .pack_tit .info_blt {
  margin: 15px 0;
}

@media (max-width: 767px) {
  .mypage {
    margin-top: 30px;
    width: 100%;
    display: block;
  }
  .mypage .left_gnb {
    display: none;
  }
  .mypage .my_box {
    gap: 20px;
  }
  .mypage .item_col .item {
    grid-template-columns: 90px auto !important;
    align-items: start;
    gap: 20px 10px;
  }

  .mypage .item_col .flexbox .fc_orange {
    font-size: 13px;
  }
}
@media (max-width: 767px) and (max-width: 767px) {
  .mypage .item_col .flexbox .fc_orange {
    font-size: 12px;
  }
}
@media (max-width: 767px) {
  .mypage .item_col .payment_btn {
    gap: 5px;
    margin: 10px 0;
  }
  .mypage .item_btn {
    grid-column: 1/span 2;
    margin-left: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
  .mypage .item_btn .mo_full {
    grid-column: 1/span 2;
  }
  .mypage .item_btn p.btn {
    background: #edeef8;
  }
  .mypage .item_btn p.btn.fc_orange {
    background: #fff1ee;
  }
  .mypage .item_btn p.btn.fc_gray9 {
    background: #f7f7f7;
  }
  .mypage .my_pack {
      grid-column: 1/span 2;
    }
  .mypage .my_info {
    padding: 15px 10px;
    grid-column: 1/span 2;
  }
  .mypage .my_info .detail_cont {
      gap: 10px;
  }
  .mypage .my_info .round_list dl {
    grid-template-columns: 65px auto;
  }
  .mypage .my_info .round_list .line_box {
      padding: 15px 10px;
  }
    .mypage .my_info .round_list .line_box dd {
      flex-direction: column;
      align-items: start;
      gap: 10px;
  }
  .mypage .my_info .detail_noti {
    padding: 0;
    margin-top: 10px;
    font-size: 13px;
  }
}
@media (max-width: 767px) and (max-width: 767px) {
  .mypage .my_info .detail_noti {
    font-size: 12px;
  }
}
@media (max-width: 767px) {
  .mypage .num_box {
    justify-content: center;
    margin-top: 10px;
  }
  .mypage .detail_cont .form_grid {
    grid-template-columns: 1fr;
  }
  .mypage .detail_cont .form_btn {
    flex-wrap: wrap;
  }
  .mypage .detail_cont .item_col {
    flex-direction: column;
    gap: 5px;
    align-items: start;
  }
  .mypage .file_list.line_box li {
      padding: 15px 10px;
  }
}
.mypage .mypage_noti {
  text-align: center;
  margin-top: 40px;
}
.mypage .mypage_noti p {
  font-size: 15px;
}
@media (max-width: 767px) {
  .mypage .mypage_noti p {
    font-size: 14px;
  }
}
.mypage .btn_area .btn.md {
  min-width: 180px;
}
.mypage .detail_info {
  margin-top: 0;
  display: block;
}

.search_box_list {
  display: flex;
  align-items: center;
  justify-content: right;
  gap: 10px;
}
.search_box_list .select {
  width: 150px;
  flex-shrink: 0;
}
.search_box_list .search_box {
  width: 100%;
}
@media (max-width: 767px) {
  .search_box_list {
    display: grid;
    grid-template-columns: 75px auto 65px;
    gap: 5px;
  }
  .search_box_list .select {
    width: 100%;
  }
  .search_box_list .search_box {
    gap: 10px;
  }
}

.search_sort {
  display: flex;
  gap: 10px;
  justify-content: right;
  margin-top: 20px;
}

.channel_info {
  width: 550px;
  margin: 0 auto;
}
.channel_info .avatar {
  flex-direction: column;
  gap: 15px;
}
.channel_info .avatar .img {
  width: 180px;
  height: 180px;
}
.channel_info .avatar p {
  font-weight: bold;
  color: #000;
  font-size: 15px;
}
@media (max-width: 767px) {
  .channel_info .avatar p {
    font-size: 14px;
  }
}
.channel_info .info_list {
  border-bottom: 1px solid #ebebeb;
  border-top: 1px solid #ebebeb;
  margin-top: 30px;
}
.channel_info dl {
  display: grid;
  grid-template-columns: 160px auto;
  padding: 20px 0;
}
.channel_info dl + dl {
  border-top: 1px solid #ebebeb;
}
.channel_info dl dt {
  font-weight: bold;
  color: #000;
}
.channel_info dl dd .lock {
  padding-left: 20px;
  background: url("../../images/ic_lock.svg") no-repeat left center;
  background-size: 14px 14px;
  opacity: 0.4;
  margin-left: 10px;
  display: inline-block;
  vertical-align: middle;
}
.channel_info .keyword {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.channel_info .history {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.channel_info .history li {
  padding-left: 10px;
  position: relative;
}
.channel_info .history li::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}
.channel_info .sns {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 0;
}
.channel_info .sns li {
  position: relative;
  padding-right: 15px;
  margin-right: 10px;
}
.channel_info .sns li::before {
  content: "/";
  color: #d0d0d0;
  position: absolute;
  top: 0;
  right: 0;
}
.channel_info .sns li:last-child::before {
  content: none;
}
.channel_info .sns p {
  padding-left: 20px;
}
@media (max-width: 767px) {
  .channel_info {
    width: 100%;
  }
  .channel_info .avatar {
    gap: 10px;
  }
  .channel_info .avatar .img {
    width: 140px;
    height: 140px;
  }
  .channel_info .info_list {
    margin-top: 20px;
  }
  .channel_info dl {
    grid-template-columns: 85px auto;
    padding: 15px 0;
  }
}

.channel_edit .form_group {
  grid-template-columns: 110px auto;
}
.channel_edit .thumb_view {
  width: 180px;
  border-radius: 100%;
  margin: 15px auto 0;
}
.channel_edit .thumb_view .thumb {
  padding-bottom: 100%;
  border-radius: 100%;
}
.channel_edit .file_list li {
  width: auto;
  display: flex;
  justify-content: center;
}

.sns_input {
  display: grid;
  grid-template-columns: 1fr 1fr 1.5fr 100px;
  gap: 10px;
  align-items: center;
}
@media (max-width: 767px) {
  .sns_input {
    grid-template-columns: 1fr 1fr;
  }
}

.sns_li {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sns_li li {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.sns_li a {
  padding-left: 20px;
}
.sns_li button {
  width: 10px;
  height: 10px;
  background: url("../../images/pop_close.svg") no-repeat center;
  background-size: contain;
  text-indent: -9999px;
}

.channel_like.bk {
    background: #f7f7f7;
    border-radius: 10px;
    padding: 20px;
}
.channel_like .item {
    grid-template-columns: 180px auto !important;
    gap: 40px;
    align-items: center;
}
.channel_like .item:hover .img img {
    transform: translate(-50%, -50%) scale(1.1);
}
.channel_like .img {
    border-radius: 100%;
    width: 100%;
    padding-bottom: 100%;
    border: 1px solid #ebebeb;
    overflow: hidden;
    position: relative;
}
.channel_like .img img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
}
.channel_like .info {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 10px;
    font-size: 14px;
}
.channel_like .name {
    font-weight: bold;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 15px;
}
@media (max-width: 767px) {
  .channel_like .name {
    font-size: 14px;
  }
}
.channel_like .name button {
  width: 40px;
  height: 40px;
  border: 1px solid #ebebeb;
  border-radius: 10px;
}
.channel_like .name button svg {
  width: 20px;
  vertical-align: middle;
}
.channel_like .history {
  display: flex;
}
.channel_like .history li {
  font-size: 13px;
}
@media (max-width: 767px) {
  .channel_like .history li {
    font-size: 12px;
  }
}
.channel_like .history li + li {
  margin-left: 10px;
  padding-left: 10px;
  position: relative;
}
.channel_like .history li + li::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 1px;
  height: 10px;
  background: #d0d0d0;
}
.channel_like .num_box {
  display: flex;
}
@media (max-width: 767px) {
  .channel_like.bk {
    padding: 15px 10px;
}
.channel_like .channel {
    gap: 20px;
    grid-template-columns: 90px auto !important;
    align-items: start;
}
.channel_like .history {
flex-direction: column;
}
.channel_like .history li, .channel_like .history li + li {
  padding-left: 10px;
  margin: 0;
  position: relative;
}
.channel_like .history li::before, .channel_like .history li + li::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
  width: auto;
  height: auto;
  background: none;
}
.channel_like .num_box {
  margin-top: 0;
  font-size: 13px;
 }
}

@media (max-width: 767px) and (max-width: 767px) {
  .channel_like .num_box {
    font-size: 12px;
  }
}

@media (max-width: 767px) {
  .channel_like .name button {
    width: 30px;
    height: 30px;
  }
  .channel_like .name button svg {
    width: 15px;
  }
}

.period {
  padding: 20px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #f1f1f1;
}
.period .period_sort {
  display: flex;
  align-items: center;
  gap: 10px;
}
.period .period_btn {
  display: flex;
  gap: 5px;
}
@media (max-width: 767px) {
  .period {
    flex-direction: column;
    align-items: start;
    gap: 10px;
  }
  .period .date_group {
    flex-direction: row;
  }
  .period .date_group > div + div::before {
    content: "~";
  }
}

.agree_con {
  border-radius: 10px;
  background: #f7f7f7;
  padding: 20px;
  color: #666;
}
.agree_con p {
  margin-bottom: 10px;
}

.agree_con > div + div {
  margin-top: 20px;
}

.agree_con ul {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.agree_con ul li, .agree_con ul p {
  position: relative;
  padding-left: 10px;
  margin-bottom: 0;
}
.agree_con ul li::before, .agree_con ul p::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}
.agree_con ul li {
  padding-left: 15px;
}
.agree_con ul li:nth-child(1)::before {
  content: "1.";
}
.agree_con ul li:nth-child(2)::before {
  content: "2.";
}
.agree_con ul li:nth-child(3)::before {
  content: "3.";
}
.agree_con ul li:nth-child(4)::before {
  content: "4.";
}
.agree_con ul li:nth-child(5)::before {
  content: "5.";
}
.agree_con ul li:nth-child(6)::before {
  content: "6.";
}
.agree_con ul li:nth-child(7)::before {
  content: "7.";
}
.agree_con ul li:nth-child(8)::before {
  content: "8.";
}
.agree_con ul li:nth-child(9)::before {
  content: "9.";
}
.agree_con ul li:nth-child(10)::before {
  content: "10.";
}
.agree_con ul li:nth-child(11)::before {
  content: "11.";
}
.agree_con ul li:nth-child(12)::before {
  content: "12.";
}
.agree_con ul li:nth-child(13)::before {
  content: "13.";
}
.agree_con ul li:nth-child(14)::before {
  content: "14.";
}
.agree_con ul li:nth-child(15)::before {
  content: "15.";
}
@media (max-width: 767px) {
  .agree_con {
    padding: 15px 10px;
  }
}
.event_list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px 20px;
}
.event_list .thumb {
  padding-bottom: calc(100% - 2px);
}
.event_list .tit {
  font-weight: bold;
  margin: 15px 0 5px;
  font-size: 15px;
}
@media (max-width: 767px) {
  .event_list .tit {
    font-size: 14px;
  }
}
.event_list .date {
  color: #999;
  height: auto;
  line-height: 1.5;
  font-size: 13px;
}
@media (max-width: 767px) {
  .event_list .date {
    font-size: 12px;
  }
}
.event_list .end a {
  cursor: default;
}
.event_list .end .thumb::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  z-index: 1;
}
.event_list .end .thumb::after {
  content: "이벤트 종료";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  z-index: 2;
  font-size: 18px;
}
@media (max-width: 767px) {
  .event_list .end .thumb::after {
    font-size: 16px;
  }
}
.event_list .end .thumb img {
  transform: none;
}
.event_list .list_none {
  grid-column: 1/span 4;
}
@media (max-width: 767px) {
  .event_list {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px 10px;
  }
  .event_list .list_none {
    grid-column: 1/span 2;
  }
}
.board_detail {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.board_detail h2 {
  padding-bottom: 15px;
  border-bottom: 2px solid #333;
}
.board_detail .date {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.board_detail .date p {
  display: flex;
  align-items: center;
  gap: 5px;
}
.board_detail .date span {
  color: #999;
}
.board_detail .file_box {
  background: #f7f7f7;
  padding: 20px;
  border-radius: 10px;
}
.board_detail .file_box li {
  width: 100%;
}
@media (max-width: 767px) {
  .board_detail .file_box {
    padding: 10px;
  }
}
.board_detail .board_edit {
  padding: 30px 0;
  border-top: 1px solid #ebebeb;
  border-bottom: 1px solid #ebebeb;
}
.board_detail .btn_area {
  margin-top: 25px;
}
.board_detail .btn_area .btn {
  min-width: auto !important;
}

.support_gnb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.noti_tab {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;

}

.faq_list {
  font-size: 15px;
}
@media (max-width: 767px) {
  .faq_list {
    font-size: 14px;
  }
}
.faq_list .tit {
  padding: 20px;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.faq_list .tit p {
  display: grid;
  grid-template-columns: 85px auto;
  gap: 10px;
}
.faq_list .arrow {
  width: 10px;
  height: 10px;
  transform: rotate(90deg);
  background: url("../../images/arrow.svg") no-repeat center;
  background-size: contain;
}
.faq_list .text {
  margin: 0 20px 20px;
  padding: 20px;
  border-radius: 10px;
  background: #f7f7f7;
  display: none;
}
.faq_list li.active .arrow {
  transform: rotate(-90deg);
}
.faq_list li.active .text {
  display: block;
}
@media (max-width: 767px) {
  .faq_list .tit {
    padding: 15px 10px;
  }
  .faq_list .tit p {
    grid-template-columns: 75px auto;
  }
  .faq_list .text {
    margin: 0 15px 15px;
    padding: 15px 10px;
  }
}

.pack_list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.pack_list .item {
  display: grid;
  grid-template-columns: 40px auto;
  border: 1px solid #ebebeb;
}
.pack_list .item .number {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  background: #fff1ee;
  font-size: 18px;
}
@media (max-width: 767px) {
  .pack_list .item .number {
    font-size: 16px;
  }
}
.pack_list .item .item_col {
  padding: 20px;
  min-width: 0;
}
.pack_list .file_list {
  padding: 10px;
  background: #f7f7f7;
  border-radius: 10px;
  margin-top: 10px !important;
}
@media (max-width: 767px) {
  .pack_list .item .item_col {
    padding: 15px 10px;
  }
  .pack_list .item .flexbox {
    display: flex;
  }
}

.note_li {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.note_li li {
  position: relative;
  padding-left: 10px;
  color: #777;
}
.note_li li::before {
  content: "-";
  position: absolute;
  top: 0;
  left: 0;
}
.location_tit ul {
  display: flex;
  opacity: 0.5;
  margin-bottom: 5px;
}
.location_tit li + li {
  margin-left: 7px;
  padding-left: 12px;
  position: relative;
}
.location_tit li + li::before {
  content: "";
  position: absolute;
  top: 5px;
  left: 0;
  width: 5px;
  height: 8px;
  background: url("../../images/arrow.svg") no-repeat center;
  background-size: contain;
}
.location_tit h2 {
  font-size: 28px;
}
@media (max-width: 767px) {
  .location_tit h2 {
    font-size: 19px;
  }
}
/* 추가 css */
/* 빈 info_blt 영역 높이 설정 */
.info_blt_empty {
    min-height: 24px;
  }

@media (max-width: 767px) {
  .info_blt_empty {
    min-height: 18px;
  }

  /*.item .date {
    height: 18px;
    line-height: 18px;
  }*/
}

@keyframes loading {
    0%, 100% {
        opacity: 0;
        transform: scale(.5);
    }
    50% {
        opacity: 1;
        transform: scale(1.2);
    }
}

@keyframes opacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/* 에디터 이미지 크기 조정 */
.detail_cont .contents .image.image_resized {
   width: 100% !important;
}

.detail_cont .contents .image.image_resized img {
   max-width: 100%;
   height: auto;
   display: block;
}

.detail_cont .contents img, .board_detail img {
	width: auto;
	height:auto;
}

/* 마이페이지 파일명 조정 */
.mypage .file_info span {
	display: inline-block;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.left_gnb .avatar .name {
    word-break: break-all;
    white-space: normal;
    overflow-wrap: break-word;
    line-height: 1.4;
    max-width: 100%;
}