/***************************************************************** 
              common Style
************************/
.sub-wrapper {
  width: 1400px;
  margin: 0px auto 100px;
  display: block;
}
.sub-wrapper .content {
  float: left;
  vertical-align: top;
  width: 1100px;
  margin: 30px 0 0 50px;
}

/******************************************************************
              Sub title style 
************************/
.sub-wrapper .sub-title-wrap {
  width: 100%;
  padding-top: 165px;
}
.sub-wrapper .sub-title-wrap .location-wrap {
  float: left;
  padding-top: 25px;
  width: 250px;
}
.sub-wrapper .sub-title-wrap .location-wrap span.location {
  font-size: var(--bis-font-size-12); font-weight: 500; line-height: 15px;
  color: var(--bis-color-black);
  margin:0 5px;
}
.sub-wrapper .sub-title-wrap .location-wrap span.location-arrow {
  position: relative;
  width: 15px; height: 15px;
  margin: 0px; padding: 0;
  display: inline-block;
  vertical-align: top;
}
.sub-wrapper .sub-title-wrap .location-wrap span.location:first-child {
  position: relative;
  padding-left: 25px;
  margin-left: 0px;
}
.sub-wrapper .sub-title-wrap .location-wrap span.location:last-child {
  color: var(--bis-color-blue); font-weight: 800;
}
.sub-wrapper .sub-title-wrap .location-wrap span i.icon-home {
  position: absolute; top: 0px; left: 0px;
  background: url('../images/common/icon-home.svg') no-repeat;
  width: 15px; height: 15px;
}
.sub-wrapper .sub-title-wrap .location-wrap span i.icon-arrow {
  position: absolute; top: 1px; left: 0px;
  display: block;
  background: url('../images/common/icon-arrow.svg') no-repeat;
  width: 12px; height: 12px;
}

.sub-wrapper .sub-title-wrap .title-wrap {
  float: left;
  width: 1100px;
  margin-left: 50px;
  text-align: center;
}
.sub-wrapper .sub-title-wrap .title-wrap h2 {
  font-size: var(--bis-font-size-32); font-weight: 700;
  color: var(--bis-color-black);
  text-align: center;
  align-content: flex-start;
}

/******************************************************************
              Left Menu Style css
************************/
.sub-wrapper .Left-menu {
  float: left;
  vertical-align: top;
  width: 250px;
  margin-top: 30px;
}
.sub-wrapper .Left-menu .sub-menu {
  border: 1px solid var(--bis-color-light-gray);
  padding: 35px 30px 85px;
}
.sub-wrapper .Left-menu .sub-menu h2 {
  font-size: var(--bis-font-size-25); font-weight: 700; color: var(--bis-color-black );
  padding-bottom: 20px;
  border-bottom: 2px solid var(--bis-color-black);
}
.sub-wrapper .Left-menu .sub-menu ul {
  margin-top: 16px;
}
.sub-wrapper .Left-menu .sub-menu ul li {
  border-bottom: 1px solid var(--bis-color-light-gray);
  font-size: var(--bis-font-size-15); font-weight: 500;
  color: var(--bis-color-black);
}
.sub-wrapper .Left-menu .sub-menu ul li:hover {
  color: var(--bis-color-blue);
}
.sub-wrapper .Left-menu .sub-menu ul li.active {
  color: var(--bis-color-blue);
  font-weight: 800;
}
.sub-wrapper .Left-menu .sub-menu ul li a {
  display: block;
  width: 100%; line-height: 110%;
  padding: 14px 0;
}
.sub-wrapper .Left-menu .banner {
  width: 100%; height: 250px;
  margin-top: 30px;
}
.left-md-content {
  width: 100%; height: 536px;
  margin: 30px -1px 0;
  border: 1px solid var(--bis-color-light-gray);
}
.left-md-content .box-md-list {
  margin: 32px 30px;
}
.left-md-content .box-md-list .photo {
  width: 190px; height: 130px;
}
.left-md-content .box-md-list .photo img {
  width: 100%;
}
.left-md-content .box-md-list span {
  display: block;
  font-size: var(--bis-font-size-12); font-weight: 400; line-height: 120%;
  color: var(--bis-color-slate-gray);
  padding-top: 10px ;
}
.left-md-content .box-md-list h3 {
  font-size: var(--bis-font-size-12); font-weight: 500; line-height: 140%;
  color: var(--bis-color-black);
  padding: 10px 0 20px;
  border-bottom: 1px solid var(--bis-color-light-gray);
}
.left-md-content .box-md-list:last-child h3 {
  border-bottom: 0px;
}



/******************************************************************
              Box List Style
************************/
.box-list {
  width: 100%;
  vertical-align: top;
}
.box-list figure {
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}
.box-list figure img {
  width: 100%;
  vertical-align: middle;
}
.box-list figure:after {
  content: "";
  position: absolute; top: 0px; left: 0px;
  width: 100%; height: 100%;
  background: rgba(50, 63, 178, .01);
  border-radius: 5px;
}
.box-list figure .view-more {
  font-size: 0%;
}
.box-list .inner .tit-travel-01 {
  font-size: var(--bis-font-size-18); font-weight: 700; line-height: 140%;
  margin-top: 20px;
}
.box-list .inner {
  margin-top: 20px;
  text-align: left;
}
/********************************************* Tag Area */
.box-list .inner .tag-area {
  display: block;
}
.box-list .inner .tag-area button.keyword {
  margin-left: 2%;
}
.box-list .inner .tag-area button.keyword:first-child {
  margin-left: 0%;
}
/********************************************* subject content Area */
.box-list .inner strong.tit-list-01 {
  display: block;
  font-size: var(--bis-font-size-18); font-weight: 700; line-height: 140%;
  margin-top: 10px;
}
.box-list .inner span.txt-list-01 {
  display: block;
  font-size: var(--bis-font-size-15); font-weight: 400; line-height: 140%;
  padding-top: 10px;
}
/********************************************* profile Area */
.box-list .user-info-wrap {
  display: block;
  margin-top: 20px;
  height: 36px;
  text-align: left;
}
.box-list .user-info-wrap .userWrap {
  display: inline-block;
  height: 36px;
}
.box-list .user-info-wrap .userWrap span.user-profile {
  display: inline-block;
  width: 36px; height: 36px;
  border-radius: 50%;
  overflow: hidden;
}
.box-list .user-info-wrap .userWrap span.user-profile img {
  width: 100%;
}
.box-list .user-info-wrap .userWrap label {
  font-size: var(--bis-font-size-12); font-weight: 700; line-height: 36px;
  vertical-align: top;
  padding-left: 10px;  
}
.box-list .user-info-wrap .likeWrap {
  float: right;
  padding-left: 15px;
  margin-top: 8px;
}
.box-list .user-info-wrap .likeWrap:after {
  content: "";
  position: absolute; top: 0px; left: 0px;
  width: 1px; height: 20px;
  background-color: var(--bis-color-light-gray);
}
.box-list .user-info-wrap .likeWrap label {
  font-size: var(--bis-font-size-12); font-weight: 700; line-height: 20px;
  vertical-align: top;
}

/********************************************* box-list hover  */
.box-list:hover figure:after {
  background: rgba(50, 63, 178, .57);
}
.box-list:hover figure .view-more {
  position: absolute; top: 50%; left: 52%; z-index: 2;
  font-size: var(--bis-font-size-15); font-weight: 500; line-height: 21px;
  color: var(--bis-color-white);
  transform: translate(-100%, -50%);
}
.box-list:hover figure .view-more:after {
  content: "";
  position: absolute; top: 0; left: 42px;
  width: 21px; height: 21px;
  border-radius: 100%; border: 1px solid var(--bis-color-white);
  background-color: rgba(255, 255, 255, .25);
}
.box-list:hover figure .view-more span {
  position: absolute; top: 8px; right: -20px;
  width: 1px; height: 7px;
  background-color: var(--bis-color-white);
}
.box-list:hover figure .view-more span:last-child {
  transform: rotate( 90deg );
}
.box-list:hover .inner strong.tit-list-01 {
  color: var(--bis-color-sky);
}


/********************************************* box-list-border  */
.box-list-border {
  vertical-align: top;
  border:1px solid var(--bis-color-light-gray); border-radius: 10px;
  padding: 20px;
}
.box-list-border figure {
  display: inline-block;
  width: 220px; height: 160px;
  border-radius: 5px;
  overflow:hidden;
}
.box-list-border figure+.inner {
  width: calc(100% - 250px);
}
.box-list-border .inner {
  display: inline-block;
  margin-left: 5%;
}
.box-list-border .inner strong.title {
  font-size: var(--bis-font-size-18); font-weight: 700;
}
.box-list-border .inner p {
  line-height: 140%;
  margin-top: 10px;
}
.box-list-border .inner .user-info-wrap {
  margin-top: 25px;
}
/********************************************* box-list-border hover  */
.box-list-border:hover figure:after {
  background: rgba(0, 0, 0, .57);
}
.box-list-border:hover figure .view-more {
  position: absolute; top: calc(50% - 9px); left: calc(50% - 25px);
  font-size: var(--bis-font-size-15); font-weight: 500; line-height: 21px;
  color: var(--bis-color-white);
  z-index: 2;
}
.box-list-border:hover figure .view-more:after {
  content: "";
  position: absolute; top: 0; left: 42px;
  width: 21px; height: 21px;
  border-radius: 100%; border: 1px solid var(--bis-color-white);
  background-color: rgba(255, 255, 255, .25);
}
.box-list-border:hover figure .view-more span {
  position: absolute; top: 8px; right: -21px;
  width: 1px; height: 7px;
  background-color: var(--bis-color-white);
}
.box-list-border:hover figure .view-more span:last-child {
  transform: rotate( 90deg );
}
.box-list-border:hover .inner strong.tit-trv1 {
  color: var(--bis-color-sky);
}



/******************************************************************
              BBS style css
************************/
/********************************************* 검색 Input area  */
.search-right-wrap {
  display: block;
  float: right;
}
.search-right-wrap .input {
  float: left;
  width: 320px; height: 52px; line-height: 52px;
  border:1px solid var(--bis-color-black);
  border-radius: 0px;
}
.search-right-wrap .black {
  float: left;
  width: 52px; height: 52px;
  border-radius: 0px;
  margin-left: -1px;
}
.search-right-wrap .black svg {
  fill: var(--bis-color-white);
  margin-top: 17px;
}

/********************************************* List area  */
.border-list-wrap {
  display: block;
  padding-top: 72px;
}
.border-list-wrap .list-box-th {
  display: table;
  width: 100%;
  border-top: 2px solid var(--bis-color-black);
  border-bottom: 1px solid var(--bis-color-black);
}
.border-list-wrap .list-box-th ul li {
  float: left;
  text-align: center; font-size: var(--bis-font-size-15); font-weight: 700;
  width: 10%; padding: 15px 0;
}
.border-list-wrap .list-box-th ul li:first-child {
  width: 75%;
}
.border-list-wrap .list-box-td ul li:first-child {
  width: 75%; line-height: 0%;
  text-align: left;
}
.border-list-wrap .list-box-td {
  display: table;
  width: 100%; line-height: 32px; vertical-align: middle;
}
.border-list-wrap .list-box-td ul {
  border-bottom: 1px solid var(--bis-color-light-gray);
}
.border-list-wrap .list-box-td ul li {
  float: left;
  text-align: center; font-size: var(--bis-font-size-15); font-weight: 400;
  width: 10%; padding: 15px 0; line-height: 32px;
}
.border-list-wrap .list-box-td ul li span {
  display: inline-block;
  width: 32px; height: 32px;
}
.border-list-wrap .list-box-td ul li a {
  display: inline-block;
  vertical-align: top;
  padding-left:10px; line-height: 32px;
}

/********************************************* paginate hover  */
.paginate {
  position: relative;
  margin: 50px auto 0;
  text-align: center;
  line-height: normal;
}
.paginate a {
  display: inline-block;
  font-size: var(--bis-font-size-15); font-weight: 800; line-height: 40px;
  width: 40px; height: 40px;
  border-radius: 100%; border:1px solid var(--bis-color-black);
  margin-left: 5px; vertical-align: top;
}
.paginate a:hover {
  background-color: var(--bis-color-black);
  color: var(--bis-color-white);
  border-color: var(--bis-color-black);
}
.paginate a.active {
  background-color: var(--bis-color-black);
  color: var(--bis-color-white);
  border-color: var(--bis-color-black);
}
.paginate a.direction {
  background-image: url('../images/common/icon-all-collection.png');
  background-repeat: no-repeat;
  font-size: 0;
  width: 40px; height: 40px;
}
.paginate a.direction.first {
  background-position: -2px -1px;
}
.paginate a.direction.prev {
  background-position: -44px -1px;
  margin-right: 10px;
}
.paginate a.direction.next {
  background-position: -167px -1px;
  margin-left: 15px;
}
.paginate a.direction.last {
  background-position: -208px -1px;
}
.paginate a.direction.first:hover {
  background-position: -86px -1px;
}
.paginate a.direction.prev:hover {
  background-position: -128px -1px;
}
.paginate a.direction.next:hover {
  background-position: -251px -1px;
}
.paginate a.direction.last:hover {
  background-position: -293px -1px;
}
.paginate a.direction.disabled {cursor:not-allowed;opacity:.4;filter:alpha(opacity=40);}
.paginate a.direction.disabled:hover,
.paginate a.direction.disabled:active, 
.paginate a.direction.disabled:focus{background-color:#fff;} 

/******************************************************************
              border list style css
************************/

/************************************************ Search Form Area style */
.search-form {
  display: block;
}
.search-form .search-right {
  float: right;
}
.search-form .search-right input.input01 {
  display: inline-block;
  width: 320px; height: 52px;
  vertical-align: top;
}
.search-form .search-right a.black {
  display: inline-block;
  width: 52px; height: 52px;
  border-radius: 0px;
  margin-left: -1px;
}
.search-form .search-right a.black svg {
  fill: var(--bis-color-white);
  margin: 17px;
}

/************************************************ List Area style */
.bbs-list, .bbs-evt-list  {
  border-top: 3px solid var(--bis-color-black);
  margin-top: 30px;
}
.bbs-list > ul > li,
.bbs-evt-list > ul > li {
  float: left;
  width: auto;
  line-height: 60px; padding: 11px 0;
  font-size: var(--bis-font-size-15); font-weight: 400;
  border-bottom: 1px solid var(--bis-color-light-gray);
  text-align: center;
}
.bbs-list > ul > li strong,
.bbs-evt-list > ul > li strong {
  display: block;
  text-align: center; line-height: 60px;
}
.bbs-list > ul > li strong.tit, .bbs-evt-list > ul > li strong.tit {
  font-size: var(--bis-font-size-18); font-weight: 700;
}
.bbs-list > ul > li.subject,.bbs-evt-list > ul > li.subject {
  text-align: left;
}
.bbs-list > ul > li a,
.bbs-evt-list > ul > li a {
  display: block;
  line-height: 60px;
}
.bbs-list > ul > li a:hover
.bbs-evt-list > ul > li a:hover {
  color: var(--bis-color-blue);
}

/******************************************************************
              border view style css
************************/
.bbs-view .top-subject {
  border-top: 3px solid var(--bis-color-black);
  border-bottom: 1px solid var(--bis-color-light-gray);
  text-align: center;
  padding: 28px 0;
}
.bbs-view .top-subject strong {
  display: block;
  font-size: var(--bis-font-size-22);
}
.bbs-view .top-subject span.notice {
  font-size: var(--bis-font-size-22); font-weight: 700;
  margin: 0px; padding: 0px;
}
.bbs-view .top-subject span {
  display: inline-block;
  position: relative;
  font-size: var(--bis-font-size-15); line-height: 25px;
  margin-top: 20px; padding: 0 30px;
}
.bbs-view .top-subject span.date:before {
  content: "";
  position: absolute; top: 5px; left: 0px;
  width: 1px; height: 16px;
  background-color: var(--bis-color-silver);
}
.bbs-view .bbs-view-cont {
  border-bottom: 1px solid var(--bis-color-light-gray);
  padding: 50px;
}
.bbs-view .bbs-view-cont p {
  line-height: 160%;
}
.bbs-view .bbs-view-cont img, .bbs-view .bbs-view-cont p img {
  width: auto;
}
.bbs-view .button-center-wrap {
  margin-bottom: 50px;
}
.bbs-view .prev-next {
  border-top: 1px solid var(--bis-color-light-gray);
}
.bbs-view .prev-next ul li {
  float: left;
  line-height: 60px; padding: 11px 0;
  font-size: var(--bis-font-size-15); font-weight: 400;
  border-bottom: 1px solid var(--bis-color-light-gray);
}
.bbs-view .prev-next ul li:nth-child(3n+1) {
  width: 10%; text-align: center;
}
.bbs-view .prev-next ul li:nth-child(3n+2) {
  width: 78%;
  color: var(--bis-color-gray);
}
.bbs-view .prev-next ul li:nth-child(3n+3) {
  width: 12%;
  text-align: center; color: var(--bis-color-gray);
}
.bbs-view .prev-next ul li a {
  color: var(--bis-color-black);
}
.bbs-view .prev-next ul li a:hover {
  color: var(--bis-color-blue);
}


/******************************************************************
              border write style css
************************/


/******************************************************************
              Common Content Style css
************************/
.modal {
  display: none;
  position: fixed; left: 0%; top: 0%; z-index: 11;
  width: 100%; height: 100vh;
  background-color: rgba(0, 0, 0, .77);
  overflow: auto;
}
/* Modal Content/Box */
.modal-content {
  position: absolute; top: 50%; left: 50%;
  background-color: var(--bis-color-white);
  margin: 0 auto; border-radius: 20px;
  width: 570px; height: 750px;
  transform: translate(-50%, -50%);
  overflow: hidden;
}
.modal-content .container .modalCont {
  padding: 50px 30px;
  overflow-y: auto;
  height: 496px;
}
.modalCont::-webkit-scrollbar { 
  width: 5px; /*스크롤바의 너비*/
} 

.modalCont::-webkit-scrollbar-thumb { 
  background-color: var(--bis-color-blue); /*스크롤바의 색상*/ 
  border-radius: 10px; /*스크롤바 라운드*/
} 

.modalCont::-webkit-scrollbar-track { 
  background-color: var(--bis-color-light-silver); /*스크롤바 트랙 색상*/ 
  border-radius: 10px; /*스크롤바 트랙 라운드*/
  box-shadow: inset 0px 0px 5px rgba(0,0,0,0.2); /*스크롤바 트랙 안쪽 그림자*/
}

.modal-content .container .modalCont strong {
  display: block;
  font-size: var(--bis-font-size-18); font-weight: 700;
  padding-top: 30px;
}
.modal-content .container .modalCont strong:first-child {
  padding-top: 0px;
}
.modal-content .container .modalCont p {
  position: relative;
  font-size: var(--bis-font-size-15); font-weight: 400;
  padding-top: 10px;
}
.modal-content .container .modalCont p.muCont {
  padding-left: 15px;
  font-size: var(--bis-font-size-15); font-weight: 400; line-height: 160%;
  padding-top: 5px;
}
.modal-content .container .modalCont p.muCont:first-child {
  padding-top: 10px;
}
.modal-content .container .modalCont p.muCont:after {
  content: "-";
  position: absolute; top: 5px; left: 0px;
}
.close-btn {
  position: fixed; right: 50%; top: 92px;
  font-size: 40px; font-weight: 700;
  color: var(--bis-color-white);
  transform: translate(335px, 0%);
  z-index: 12;
}
.close-btn:hover, .close-btn:focus {
  color: #f44336;
  cursor: pointer;
}

/* modal Contact Us */
#modal-ctact {
  display: none;
  position: fixed; left: 0; top: 0; z-index: 12;
  width: 100%; height: 100%;
}
#modal-ctact .modal-bg {
  background-color: rgba(0,0,0,0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
#modal-ctact .modal-bg .modal-cont {
  position: relative;
  background-color: #fff;
  border-radius: 10px;
  padding: 40px; max-width: 500px;
  height: 580px;
  display: inline-block;
}
#modal-ctact .modal-bg .modal-cont h2 {
  font-size: 30px; margin-bottom: 10px;
}
#modal-ctact .modal-bg .modal-cont .content-box {
  background-color: var(--bis-color-light-silver);
  border-radius: 5px;
  overflow-y: auto;
  height: 480px; padding: 30px;
}
#modal-ctact .modal-bg .modal-cont .content-box p {
  font-size: var(--bis-font-size-15); line-height: 160%
}
#modal-ctact .modal-bg .modal-cont .modal-close {
  position: absolute; top: 10px; right: 10px;
  background:#000;
  width: 34px; height: 34px;
  border-radius: 50%;
}
#modal-ctact .modal-bg .modal-cont .modal-close svg {
  width: 14px; fill: #fff; vertical-align: top;
  padding: 10px;
}


/******************************************************************
              Common Content Style css
************************/

/********************************************* Button Area style */
.button-center-wrap {
  text-align: center;
  margin-top: 50px;
}
.button-center-wrap .black {
  display: inline-block;
  width: 150px; height: 58px; line-height: 58px;
  margin-left: 10px; font-weight: 500;
}
.button-center-wrap .black:first-child {
  margin-left: 0px;
}
.button-center-wrap .black-red {
  display: inline-block;
  width: 150px; height: 58px; line-height: 58px;
  margin-left: 10px; font-weight: 500;
}
.button-right-wrap {
  position: absolute; bottom: 0px; right: 0px;
  text-align: center;
  margin-top: 50px;
}
.paginate > .button-right-wrap a.black {
  display: inline-block;
  width: 120px; height: 48px; line-height: 48px;
  margin-left: 10px; font-weight: 500;
  border-radius: 10px;
}
.paginate > .button-right-wrap a.black:hover {
  background-color: var(--bis-color-blue);
  border-color: var(--bis-color-blue);
}
 

/********************************************* Heart ♥ */
.likeWrap {
  position: relative;
  width: auto; height: 18px;
  text-align: left;
}
.likeWrap input {
  position: absolute; top: -3px; left: 10px; z-index: 0;
  opacity: 0;
  width: 22px; height: 20px;
  cursor: pointer;
}
.likeWrap input:checked+i.icon-heart {
  background: url(../images/common/icon-heart-active.svg);
}
.likeWrap input:checked+label {
  color: var(--bis-color-blue);
}
.likeWrap i.icon-heart {
  display: inline-block;
  background: url(../images/common/icon-heart.svg);
  width: 20px; height: 18px;
  cursor: pointer;
}
.likeWrap label {
  font-size: var(--bis-font-size-12); font-weight: 700;
  line-height: 18px; vertical-align: top; margin-left: 7px;
}

/********************************************* Review ★ */
.star-rating {
  position: relative;
}
.star-rating:after {
  content: "";
  position: absolute; top: 1px; left: 0px;
  width: 1px; height: 15px; background-color: var(--bis-color-light-gray);
}
.star-rating i {
  display: inline-block;
}
.star-rating i.star {
  fill: var(--bis-color-deep-yellow);
  width: 17px; height: 17px;
}
.star-rating i.star-color {
  fill: var(--bis-color-silver-gray);
  width: 17px; height: 17px;
}
.star-rating label {
  display: inline-block;
  vertical-align: top;
  margin-left: 10px; padding-top: 3px;
  font-size: var(--bis-font-size-12); font-weight: 700;
}
.star-rating .starChk {
  display: inline-block;
  position: relative;
  margin-left: 5px;
}
.star-rating .starChk:first-child {
  margin-left: 0px;
}
.star-rating .starChk input {
  position: absolute; top: -4px; left: -6px; z-index: 0;
  width: 22px; height: 20px;
  cursor: pointer; opacity: 0;
}
.star-rating .starChk i.star {
  fill: var(--bis-color-silver-gray);
  width: 17px; height: 17px;
}
.star-rating .starChk input:checked+i.star {
  fill: var(--bis-color-deep-yellow);
}
.star-rating span.starimg {
  display: inline-block;
  background: url('../images/common/icon-all-collection-new.png') no-repeat;
  width: 107px; height: 19px;
}
.star-rating span.starimg.five {
  background-position: -70px -52px;
}
.star-rating span.starimg.four {
  background-position: -187px -52px;
}
.star-rating span.starimg.three {
  background-position: -304px -52px;
}
.star-rating span.starimg.two {
  background-position: 0px -84px;
}
.star-rating span.starimg.one {
  background-position: -117px -84px;
}
.star-rating span.starimg.zero {
  background-position: -234px -84px;
}

/********************************************* User Profile */
.userWrap {
  display: inline-block;
}
.userWrap span.user-profile {
  display: inline-block;
  width: 36px; height: 36px;
  border-radius: 50%; font-size: 0%;
  overflow: hidden;
}
.userWrap label {
  font-size: var(--bis-font-size-12); font-weight: 800; color: var(--bis-color-black);
  line-height: 36px;
  vertical-align: top;
  padding-left: 10px;
  cursor: pointer;
}




/*********************************************************************************************
						  반응형 해상도 관련 Style css
*****************************/

/********************************************************************** 1500 미만 해상도 */
@media only screen and (max-width:1500px) and (min-width:1300px){
  .sub-wrapper {
	width: 1200px;
	margin: 0px auto 100px;
	margin: 0px auto 100px;
  }
  .sub-wrapper .Left-menu {
    width: 230px;
  }
  .left-md-content .box-md-list {
    margin: 20px 9%;
  }
  .sub-wrapper .content {
	float: left;
	vertical-align: top;
	width: 920px;
	margin: 30px 0 0 50px;
  }
}
/********************************************************************** 1300 미만 해상도 */
@media only screen and (max-width:1299px) and (min-width:1200px){
  .sub-wrapper {
	width: 1100px;
	margin: 0px auto 100px;
  }
  .sub-wrapper .Left-menu {
    width: 230px;
  }
  .left-md-content .box-md-list {
    margin: 20px 9%;
  }
  .sub-wrapper .content {
	width: 820px;
	margin: 30px 0 0 50px;
  }
}
/********************************************************************** 1024 미만 해상도 */
@media only screen and (max-width:1199px) and (min-width:1000px){
  .sub-wrapper .sub-title-wrap {
    width: 100%;
    padding-top: 110px;
  }
  .sub-wrapper {
	width: 980px;
	margin: 0px auto 100px;
  }
  .sub-wrapper .Left-menu {
    width: 200px;
  }
  .sub-wrapper .content {
	float: left;
	vertical-align: top;
	width: 750px;
	margin: 30px 0 0 30px;
  }
  .card-view-wrap .option-right {
    width: 56%;
    margin-left: 10%;
  }
  
  /********************************************************************** Left */
  .sub-wrapper .Left-menu .banner {
    height: auto;
    margin-top: 30px;
  }
  .left-md-content .box-md-list {
    margin: 22px 20px;
  }
  .left-md-content .box-md-list .photo {
    width: 100%;
    height: 130px;
  }
}
/********************************************************************** 900 미만 해상도 */
@media only screen and (max-width:999px) and (min-width:900px){
  .sub-wrapper .sub-title-wrap {
    width: 100%;
    padding-top: 110px;
  }
  .sub-wrapper {
	width: 880px;
	margin: 0px auto 100px;
  }
  .sub-wrapper .Left-menu {
    width: 200px;
  }
  .sub-wrapper .content {
	float: left;
	vertical-align: top;
	width: 650px;
	margin: 30px 0 0 30px;
  }
  .card-view-wrap .option-right {
    width: 51%;
    margin-left: 10%;
  }
  
  /********************************************************************** Left */
  .sub-wrapper .Left-menu .banner {
    height: auto;
    margin-top: 30px;
  }
  .left-md-content .box-md-list {
    margin: 22px 20px;
  }
  .left-md-content .box-md-list .photo {
    width: 100%;
    height: 130px;
  }
}



/*********************************************************************************************
              Mobile Style css
                        *** 500미만 style ***
*****************************/
@media only screen and (max-width:899px) and (min-width:280px){
  .sub-wrapper {
    width: 90%;
    margin: 0px auto 50px;
  }
  .sub-wrapper .sub-title-wrap {
    width: 100%;
    padding-top: 100px;
  }
  .sub-wrapper .sub-title-wrap .location-wrap {
    display: none;
  }
  .sub-wrapper .sub-title-wrap .title-wrap {
    width: 100%;
    margin-left: 0px;
  }
  .sub-wrapper .Left-menu .banner, .left-md-content {
    display: none;
  }
  .sub-wrapper .Left-menu {
    display: none;
    width: 100%;
    margin-top: 30px;
  }

  .sub-wrapper .content {
    float: left;
    vertical-align: top;
    width: 100%;
    margin: 30px 0 0 0px;
  }

/********************************************************************** Modal Content/Box */
  .close-btn {
    position: fixed; right: 0%; top: 0px;
    font-size: 20px;
    transform: translate(0%, 0%);
  }
  .modal-content {
    width: 100%; height: 100vh; max-height: 100vh;
    border-radius: 0px;
  }
  .modal-content .top {
    margin-top: 0px;
  }
  .modal-content .container .modalCont {
    padding: 5% 5% 0;
    height: 75vh;
  }

  #modal-ctact .modal-bg .modal-cont {
    padding: 20px 5%;
    max-width: 80%;
    height: 80%;
  }
  #modal-ctact .modal-bg .modal-cont h2 {
    font-size: var(--bis-font-size-22);
    font-weight: 700;
  }
  #modal-ctact .modal-bg .modal-cont .content-box {
    height: 83%;
    padding: 20px 5% 20px;
  }
  #modal-ctact .modal-bg .modal-cont .modal-close {
    position: absolute; top: 10px; right: 10px;
    width: 30px;
    height: 30px;
  }
  #modal-ctact .modal-bg .modal-cont .modal-close svg {
    width: 12px;
  }
  
/********************************************************************** bbs */
  .bbs-view .bbs-view-cont {
    border-bottom: 1px solid var(--bis-color-light-gray);
    padding: 30px 5%;
  }
  .bbs-view .bbs-view-cont img, .bbs-view .bbs-view-cont p img {
    width: 100%;
  }
  .bbs-view .prev-next ul li:nth-child(3n+1) {
    width: 25%;
  }
  .bbs-view .prev-next ul li:nth-child(3n+2) {
    width: 75%;
  }
  .bbs-view .prev-next ul li:nth-child(3n+3) {
    display: none;
  }
  .bbs-view .prev-next ul li {
    float: left;
    line-height: 40px; height: 40px;
	overflow: hidden;
  }
}

/********************** 해상도 568이상 css */
@media only screen and (max-width:699px) and (min-width:500px) {
  /********************** 해상도 700 이상 태블릿 css */
}

@media only screen and (max-width:999px) and (min-width:700px) {  
  /********************** 해상도 700 이상 태블릿 css */
}