@charset "utf-8";

@import url("../../fonts/webfonts_Pretendard.css");
 @import url("../../fonts/XEIcon-2.2.0/xeicon.min.css");
@import url("../../fonts/remixicon.css");
@import url("../../fonts/boxicons.min.css");
/* @import url("../../fonts/iconoir-master/iconoir-master/css/iconoir.css"); */

*, *::before, *::after {-webkit-box-sizing: inherit;box-sizing: inherit;}
html, body{height:100%}
html{overflow:auto;-webkit-box-sizing: border-box;box-sizing: border-box;font-size:10px}
body{margin: 0;padding: 0;font-size: 1.4rem;line-height:1.6875;font-family:'Pretendard', sans-serif;font-weight: 400;color:#6e6e6e;letter-spacing: -1px}
header, footer, main, section, article, nav, aside {display: block}
ul, ol, li, dl, dt, dd {margin: 0;padding: 0;list-style: none}
h1, h2, h3, h4, h5, h6, p, form, figure, figcaption {margin: 0;padding: 0}
fieldset, hr {display: block;margin: 0;padding: 0;border: 0 none}
input, select {max-width: 100%;vertical-align: middle;line-height: 1.9rem;height: 1.9rem}
input, select, button, textarea, optgroup {margin: 0;font-family: inherit;font-size: inherit;color: inherit;border-radius: 0;border: 1px solid #ddd}
input {height: 1.9rem;line-height: 1.9rem}
input:-moz-read-only, input:disabled {background: #fafafa}
input:read-only, input:disabled {background: #fafafa}
input[readonly] {background: #fafafa}
/*select{-webkit-appearance:none;-moz-appearance: none;appearance:none}
select::-ms-expand {display: none}*/
address, em, i {font-style: normal}
strong {font-weight: 600}
a {color: inherit;text-decoration: none}
button {padding: 0;border: 0 none;background: none;cursor: pointer}
input[type="text"]{border:1px solid #E9ECEF;}
input[type='submit']{-webkit-appearance: none;-moz-appearance:none;appearance:none}
img {max-width: 100%;border: 0 none;font-size: 0;vertical-align: middle}
table {width: 100%;border-collapse: separate;border-spacing: 0;table-layout: fixed}
caption, legend,
.sr-only, .sr_only, .hidden, .blind, .IR, .title_hidden {overflow: hidden;position: absolute;width: 1px;height: 1px;margin: -1px;padding: 0;border: 0 none;clip: rect(0, 0, 0, 0)}
#skip_nav {position: absolute;left: 0;top: -1000px;width: 100%;height: 0;z-index: 1000;line-height: 0;font-size: 0}
#skip_nav a {display: block;text-align: center;width: 100%;line-height: 0;font-size: 0}
#skip_nav a:focus, #skip_nav a:hover, #skip_nav a:active {position: absolute;left: 0;top: 1000px;padding: 8px 0;display: block;height: 30px;background: #20262c;font-size: 12px;font-weight: bold;line-height: 18px;color: #fff}
.container {width: 64rem;max-width: calc(100% - 2rem);margin-left: auto !important;margin-right: auto !important}
.container:after {display: block;clear: both;content: ''}
.ellipsis {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width: 100%;display: inline-block}
.txt_left, .txt-left {text-align: left !important}
.txt_center, .txt-center {text-align: center !important}
.txt_right, .txt-right {text-align: right !important}
.float_left {float: left}
.float_right {float: right}
.inline_b {display: inline-block;vertical-align: middle}
.inline {display: inline-block}
.block {display: block}
.mT0 {margin-top: 0 !important}
.mT10 {margin-top: 10px}
.mT20 {margin-top: 20px}
.mT30 {margin-top: 30px}
.w100 {width: 100% !important}

/* 사용자 썸네일 */
.thumb{position:relative;display:inline-block;width:4rem;height:4rem;vertical-align:middle;}
.thumb img{
  position:absolute;
  top:50%;
  left:50%;
  width:100%;
  height:100%;
  object-fit: cover;
  transform:translate(-50%, -50%);
  overflow:hidden;
  }

/* 버튼 */
.btn{display:inline-block;text-align:center;font-size:1.4rem;font-weight:500}
.btn.apply{padding:.4rem 2rem;background:#FED530;color:#000;border-radius:1.6rem}

/* 메인, 리빙랩 목록 이미지 */
.img_wrap{text-align:center}
.imgBox{display:inline-block;width:100%;max-width:38rem;margin-top:1rem;position:relative;height:18.4rem;border-radius:.5rem;overflow:hidden;text-align:center}
.imgBox img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);height:100%;max-width:inherit}
.imgBox>.box{position:relative;height:18.4rem;overflow:hidden;border-radius:.5rem}
.imgBox>.box.big{margin-right:10.2rem}
.imgBox>.box.sm{position:absolute;right:0;top:0;width:9.2rem}
.imgBox>.box.sm .row{margin-top:1.3rem;position:relative;width:100%;height:8.5rem;border-radius:.5rem;overflow:hidden;text-align:center;color:#fff;font-size:1.5rem}
.imgBox>.box.sm .row:first-of-type{margin-top:0}
.imgBox>.box.sm .row img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}
.imgBox>.box.sm .row:last-of-type:after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.4);z-index:1}
.imgBox>.box.sm .row span{position:absolute;left:0;top:50%;width:100%;transform:translateY(-50%);z-index:2}
.imgBox>.box.sm .row span i{margin-right:.3rem}

/* 목록 이미지 21-08-20 */

/* 이미지 공통 */
.img_container {overflow: hidden; height: 18.4rem; width: 100%; text-align: center; position: relative;}
.img_container ul {height: 100%;}
.img_container ul li {border-radius: .5rem; overflow: hidden;}
.img_container ul li img {width: 100%; height: 100%;}

/* 이미지 1개 */
.img_container.num_1 ul li img {width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}

/* 이미지 2개 */
/* .img_container.num_2 ul { display: flex; justify-content: space-between;}
.img_container.num_2 ul li {width: calc(50% - .5rem); position: relative; }
.img_container.num_2 ul li img {width: 100%; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);} */

/* 이미지 3개 */
/* .img_container.num_3 ul {display: flex; justify-content: space-between;}
.img_container.num_3>ul>li:first-child {width: calc(70% - .5rem);}
.img_container.num_3>ul>li:last-child {width: calc(30% - .5rem);}
.img_container.num_3 ul>li>ul {flex-wrap: wrap; width: 100%;}
.img_container.num_3 ul>li>ul li {width: 100%; height: 50%;}
.img_container.num_3 ul>li>ul li img {height: 100%;}
.img_container.num_3 ul>li>ul li:first-child {margin-bottom: .5rem;}
.img_container.num_3 ul>li>ul li:last-child {margin-top: .5rem;} */

/* 이미지 4개 이상 */
.img_container.num_4 ul {display: flex; justify-content: space-between;}
.img_container.num_4>ul>li:first-child {width: calc(70% - .5rem);}
.img_container.num_4>ul>li:last-child {width: calc(30% - .5rem);}
.img_container.num_4 ul>li>ul {flex-wrap: wrap; width: 100%;}
.img_container.num_4 ul>li>ul li {width: 100%; height: 50%;}
.img_container.num_4 ul>li>ul li img {height: 100%;}
.img_container.num_4 ul>li>ul li:first-child {margin-bottom: .5rem;}
.img_container.num_4 ul>li>ul li:nth-child(2) {position: relative;}
.img_container.num_4 ul>li>ul li:nth-child(2)::after {display: block; content: ''; background: rgba(0,0,0,.4); position: absolute;left: 0; top: 0; height: 100%; width: 100%;}


/* 공통 - 모달창 */
.modal_wrap{position:fixed;width:100%;height:100%;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,.5);text-align:center;z-index:9999}
.modal_wrap:before{content:"";display:inline-block;height:100%;vertical-align:middle}
.modal_wrap .modal{display:inline-block;min-width:27rem;max-width:calc(100% - 3rem);padding:4rem 1.6rem 2rem;background:#fff;border-radius:.8rem;vertical-align:middle;text-align:center;word-break:keep-all}
.modal_wrap .modal .modal_box h2{margin-bottom:2.5rem;padding-bottom:1rem;border-bottom:1px solid #ddd;font-size:1.6rem;color:#111;font-weight:500;line-height:1}
.modal_wrap .modal .modal_box strong{color:#111;font-size:1.6rem;font-weight:500;line-height:2.3rem;}
.modal_wrap .modal .modal_box p{margin-top:1rem;line-height:2.1rem;font-size:1.7rem;font-weight:600;color:#111;}
.modal_wrap .modal .modal_box .modal_btn{margin-top:3rem;text-align:center}
.modal_wrap .modal .modal_box .modal_btn button,
.modal_wrap .modal .modal_box .modal_btn a{display:inline-block;width:calc(50% - .9rem);margin:0 .3rem;height:3.9rem;line-height:3.9rem;border-radius:.8rem;text-align:center;font-size:1.4rem;vertical-align:top}
.modal_wrap .modal .modal_box .modal_btn .modal_close{border:1px solid #268DFF;color:#222}
.modal_wrap .modal .modal_box .modal_btn .modal_confirm{background:#268DFF;color:#fff}
.modal_wrap .modal.type2{min-width:32.8rem;}
/* 22-10-28 */
.modal_wrap .modal .modal_box.btn_close {position: relative;}
.modal_wrap .modal .modal_box button.xi-close {font-family: 'xeicon'; top: 0; right: 0; position: absolute; width: auto; color: #212121; font-size: 1.6rem;}
.modal_wrap .modal .alert_box {background: #F5F6F8; border-radius: .5rem; padding: 1.4rem; text-align: left; font-size: 1.2rem; border: 1px solid #EBEBEB;}
.modal_wrap .modal .alert_box strong {display: block; font-size: 1.5rem; color: #111; margin-bottom: .9rem;}
.modal_wrap .modal .input_list_box {margin: 1.8rem 0 1.3rem;}
.modal_wrap .modal .input_list_box li {margin-bottom: 1rem; display: flex; align-items: center; justify-content: space-between}
.modal_wrap .modal .input_list_box li label {color: #333; font-size: 1.5rem;}
.modal_wrap .modal .input_list_box li input {width: calc(100% - 8.9rem); border: 1px solid #E9ECEF; border-radius: .8rem; height: 4.3rem; padding: 0 1.5rem;}
.modal_wrap .modal .input_list_box li input::placeholder {color: #BDC3C9;}
.modal_wrap .modal .alert_box.type2 i {display: block; text-align: center; font-size: 1.8rem;}
.modal_wrap .modal .alert_box.type2 p {line-height: 2rem;}
.modal_wrap .modal .alert_box.type2 strong {display: inline-block; margin: 0 .5rem 0 0; font-size: 1.4rem;}
.modal_wrap .modal .alert_box.type3 ul li {position: relative; padding-left: .5rem;}
.modal_wrap .modal .alert_box.type3 ul li::after {position: absolute; width: .3rem; height: .3rem; background: #a1a1a1; border-radius: 50%; top: 50%; left: 0;
  transform: translateY(-50%); content: '';}
/* 22-10-28 */

.more_menu{position:absolute;bottom:7%;left:50%;width:calc(100% - 3rem);transform:translateX(-50%);vertical-align:bottom}
.more_menu .m_linkList{border-radius:1.5rem;overflow:hidden}
.more_menu .m_linkList>li{float:none !important;padding:0 !important;border-top:1px solid #DBDBDB}
.more_menu .m_linkList>li:before{display:none !important}
.more_menu .m_linkList>li:first-child{border-top:0}
.more_menu .m_linkList>li a{display:block;padding:2rem 1rem;background:#fff;text-align:center;font-size:1.8rem;letter-spacing:-0.05rem;color:#5180E4;font-weight:500}
.more_menu .cancel{margin:1rem 0;display:block;width:100%;padding:2rem 1rem;background:#fff;text-align:center;font-size:1.8rem;letter-spacing:-0.05rem;color:#111;border-radius:1.5rem;font-weight:500}

/* grid */
/* .row {margin-right: -15px; margin-left: -15px;} */
.row::after{content:'';display:block;clear:both}

[class*="col-"] {position:relative;min-height:1px;float:left}
.col-xs-12{width:100%}
.col-xs-11{width:91.66666667%}
.col-xs-10{width:83.33333333%}
.col-xs-9{width:75%}
.col-xs-8{width:66.66666667%}
.col-xs-7{width:58.33333333%}
.col-xs-6{width:50%}
.col-xs-5{width:41.66666667%}
.col-xs-4{width:33.33333333%}
.col-xs-3{width:25%}
.col-xs-2{width:16.66666667%}
.col-xs-1{width:8.33333333%}

@media (min-width: 640px) {
  .col-sm-12{width:100%}
  .col-sm-11{width:91.66666667%}
  .col-sm-10{width:83.33333333%}
  .col-sm-9{width:75%}
  .col-sm-8{width:66.66666667%}
  .col-sm-7{width:58.33333333%}
  .col-sm-6{width:50%}
  .col-sm-5{width:41.66666667%}
  .col-sm-4{width:33.33333333%}
  .col-sm-3{width:25%}
  .col-sm-2{width:16.66666667%}
  .col-sm-1{width:8.33333333%}
}

@media (min-width: 992px) {
  .col-md-12{width:100%}
  .col-md-11{width:91.66666667%}
  .col-md-10{width:83.33333333%}
  .col-md-9{width:75%}
  .col-md-8{width:66.66666667%}
  .col-md-7{width:58.33333333%}
  .col-md-6{width:50%}
  .col-md-5{width:41.66666667%}
  .col-md-4{width:33.33333333%}
  .col-md-3{width:25%}
  .col-md-2{width:16.66666667%}
  .col-md-1{width:8.33333333%}
}

@media (min-width: 1200px) {
  .col-lg-12{width:100%}
  .col-lg-11{width:91.66666667%}
  .col-lg-10{width:83.33333333%}
  .col-lg-9{width:75%}
  .col-lg-8{width:66.66666667%}
  .col-lg-7{width:58.33333333%}
  .col-lg-6{width:50%}
  .col-lg-5{width:41.66666667%}
  .col-lg-4{width:33.33333333%}
  .col-lg-3{width:25%}
  .col-lg-2{width:16.66666667%}
  .col-lg-1{width:8.33333333%}
}