@charset "utf-8";
/* CSS Document */

.PC {display: block;}
.PHONE {display: none;}

#header .all_wrap .all{ position:fixed; right:0; top:0; width:100%; height:100vh; opacity:0; visibility:hidden; z-index:1; color:#333; flex-direction:column; background:rgba(0,0,0,.7);}
#header .all_wrap .allBtn {font-size: 1.3em;}
#header .all_wrap .all .wrap_bg{ position:relative; opacity:0}
#header .all_wrap .all .wrap_bg .btn{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:3em; line-height:3em; background:#fff; border-radius:50%; color:#1a4e87; text-align:center}
#header .all_wrap .all .wrap_con{ height:calc(100% - 5em); max-width:94%; min-width:90%; padding:2em 0 0 0; box-sizing:border-box; margin:0 auto; background:#fff; border-radius:2em 2em 0 0; transform:translateY(5em)}
#header .all_wrap .all .wrap_con .wrap_in{ height:100%; box-sizing:border-box; padding:0 2em}
#header .all_wrap .all .top{ padding:1em 0}
#header .all_wrap .all .top .logo{ gap:0 1.5em;}
#header .all_wrap .all .top .logo img{ height:2em;}
#header .all_wrap .all .top .logo .tt{ font-size:1.375em; color:#000; font-weight:700;}
#header .all_wrap .all .top .lang{ gap:0 2em}
#header .all_wrap .all .top .lang > li > a{ font-weight:700; font-size:1.125em; color:#999; padding:.25em}
#header .all_wrap .all .top .lang > li > a.on{ color:#0060ae; position:relative}
#header .all_wrap .all .top .lang > li > a.on:before{ content:""; position:absolute; left:0; bottom:0; width:100%; height:.25em; background:#0060ae; opacity:.2; z-index:-1}
#header .all_wrap .all .top .lang:hover{ opacity:1}
#header .all_wrap .all .bottom{ padding:1.5em 0; box-sizing:border-box}
#header .all_wrap .all .bottom .link{ gap:0 2em}
#header .all_wrap .all .bottom .link > li > a{ font-size:.938em; color:#666}
#header .all_wrap .all .bottom .link > li > a.point{ font-weight:500; color:#0060ae}
#header .all_wrap .all .bottom .link > li > a .xi{ font-size:1em; vertical-align:middle}
#header .all_wrap .all .bottom .link > li > a .t1{ font-weight:500}
#header .all_wrap .all .bottom .link > li > a:hover,
#header .all_wrap .all .bottom .link > li > a:focus{ text-decoration:underline}
#header .all_wrap .all .bottom .etc{ margin-top:2em}
#header .all_wrap .all .bottom .etc > li > a{ font-size:.938em; color:#777}
#header .all_wrap .all .menu{ position:relative}
#header .all_wrap .all .menu:before{ content:""; position:absolute; left:0; top:0; width:calc(100% - 1px); height:100%; z-index:-1; box-sizing:border-box; border:1px solid #eee; border-bottom-color:#ddd}
#header .all_wrap .all .gnb{ height:100%; position:relative}
#header .all_wrap .all .gnb ul{ display:block}
#header .all_wrap .all .gnb a{ text-align:left; position:relative; line-height:1.2}
#header .all_wrap .all .gnb li{ position:relative; flex:1 1 1%}
#header .all_wrap .all .gnb a .arrow{ position:absolute; right:.5em; opacity:.5; transition:.3s; font-size:1em}
#header .all_wrap .all .gnb a .arrow:before{ content:"\e907"; font-size:.75em}
#header .all_wrap .all .gnb li.more > a .arrow:before{ content:"\e943"; font-size:1em}
#header .all_wrap .all .gnb > li:not(.m_hide){ display:flex; flex-direction:column}
#header .all_wrap .all .gnb > li .dp1{ padding:0 1em; height:4em; background:var(--siteC); box-sizing:border-box; border-right:1px solid rgba(255,255,255,.2); color:#fff}
#header .all_wrap .all .gnb > li .dp1 .va{ font-size:1.25em; font-weight:700}
#header .all_wrap .all .gnb > li .dp1 .arrow{ top:50%; transform:translateY(-50%)}
#header .all_wrap .all .gnb > li .dp2{ flex:1 1 0%; min-height:0; border-left:1px solid transparent; border-right:1px solid #eee; border-bottom:1px solid #eee; padding:1em 0}
#header .all_wrap .all .gnb > li .dp2 > li > a{ padding:.5em 1em; padding-right:2em; font-weight:500; transition:.3s}
#header .all_wrap .all .gnb > li .dp2 > li > a .arrow{ right:.75em; top:.5em}
#header .all_wrap .all .gnb > li .dp2 > li.more > a .arrow:before{ content:"\e942"}
#header .all_wrap .all .gnb > li .dp2 > li.act > a .arrow{ opacity:1}
#header .all_wrap .all .gnb > li .dp2 > li.act > a .va .tt{ text-decoration:underline}
#header .all_wrap .all .gnb > li .dp3{ background:#f5f5f5; margin:0 .5em; border-radius:.5em; padding:.5em; margin-bottom:.5em}
#header .all_wrap .all .gnb > li .dp3 > li > a{ padding:.188em .5em; padding-left:.75em; color:#666; display:flex}
#header .all_wrap .all .gnb > li .dp3 > li > a:before{ content:"-"; position:absolute; left:0; top:.125em; width:auto; height:auto}
#header .all_wrap .all .gnb > li .dp3 > li > a .arrow{ display:none}
#header .all_wrap .all .gnb > li .dp3 > li > a .va{ font-size:.938em}
#header .all_wrap .all .gnb > li .dp3 > li.act > a{ color:#0060ae; font-weight:500}
#header .all_wrap .all .gnb > li.act .dp1{ background:#002144}

.allGnbOn{ overflow-y: hidden}
.allGnbOn body{ overflow-y: scroll}
.allGnbOn #header .top_wrap{ z-index:11}
.allGnbOn #header .all_wrap .all{ opacity:1; visibility:visible}
.allGnbOn #header .all_wrap .all .wrap_bg{ opacity:1; transition:.3s; transition-delay:.2s}
.allGnbOn #header .all_wrap .all .wrap_con{ transform:translateY(0); transition:.3s}


.main_more.c2{ background:var(--siteC)}
.main_more.c2:hover{ box-shadow: inset 0 -7em 0 0 var(--siteC)}
.main_more.c3{ background:midnightblue;}
.main_more.c3:hover{ box-shadow: inset 0 -7em 0 0 midnightblue;}

.gnb_wrap .gnb .dp3 .m3_A {display: none;}
#contents .sub_layout_wrap .sub_lnb_wrap .gnb > li .dp2 .m2_order {display: none;}

#header .top_wrap .etc_wrap .link > li.pointmall > a {border-color: #154194; background: #154194; color: #fff; transition: .3s;}
#header .top_wrap .etc_wrap .link > li.pointmall > a:hover {background: #fff; color: #154194; transition: .3s;}


.visualSlogan_wrap { overflow: hidden;}

/* 서브 공통 */

.sub_tt {}
.sub_tt.t1 { font-size: 1.2em; margin-bottom: 1.5em; line-height: 1.7; letter-spacing: 0.3px;}
.sub_tt.t2 { font-size: 1.8em; font-weight: 600; position: relative;}
.sub_tt.t2:after,
.sub_tt.t2::before {position: absolute; top: 20%; transform: translate(150%, -200%); left: -6%; content: ''; width: .7em; height: .7em; background-color: var(--siteC); border-radius: 50%;}
.sub_tt.t2::before {transform: translate(76%, -100%) scale(.6); opacity: .5;}
.sub_tt.t3 { font-size: 1.2em;}
.sub_tt.t4 { font-size: 2em; font-weight: 700; margin-bottom: 0.5em; position: relative;}
.sub_tt.t4:after,
.sub_tt.t4::before {position: absolute; top: 57%; transform: translate(150%, -200%); left: 37%; content: ''; width: .7em; height: .7em; background-color: var(--siteC); border-radius: 50%;}
.sub_tt.t4::before {transform: translate(76%, -100%) scale(.6); opacity: .5;}
.sub_tt.t5 { font-size: 1.5em; margin-bottom: 1em;}
.sub_tt.t6 { font-size: 1em;}
.sub_tt.t7 { font-size: 2em; margin-bottom: .5em;}

.sub_tt.we1 {font-weight: 300;}
.sub_tt.we2 {font-weight: 500;}
.sub_tt.we3 {font-weight: 600;}
.sub_tt.we4 {font-weight: 700;}

.sub_tt.dot { position: relative; padding-left: 0.8em; }
.sub_tt.dot:before { position: absolute; content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); top: 10px; left: 0; }
.sub_tt.redot { position: relative; padding-right: 0.5em; }
.sub_tt.redot:before { position: absolute; content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--siteC); top: 10px; right: 0; }
.sub_tt.dot2 { position: relative; padding-left: 0.5em; }
.sub_tt.dot2:before { position: absolute; content: ""; left: 0; top: 20px; width: 3px; height: 3px; border-radius: 50%; background: #666; }
.sub_tt.dot2:first-of-type:before { top: 11px; }

.main_more2 { position: relative; display: inline-flex; padding: 0 2em; height:3.5em; color: var(--siteC); align-items:center; font-weight:700; background: transparent; cursor: pointer; transition: ease-out 0.5s; border: 1px solid var(--siteC); border-radius: .5em; box-shadow: inset 0 0 0 0 var(--siteC); font-size:1.063em}
.main_more2 .arrow{ margin-left:.5em; transition:.3s}
.main_more2 .arrow:before{ content:"\e93f"}
.main_more2:hover{ color: white; box-shadow: inset 0 -7em 0 0 var(--siteC); border-color:transparent}
.main_more2:hover .arrow{ transform:translateX(.5em)}
.main_more2:active { transform: scale(0.9);}
.main_more2.c1{ background:var(--siteC2)}
.main_more2.c1:hover{ box-shadow: inset 0 -7em 0 0 var(--siteC2)}
.main_more2.s1{ font-size:1.25em}

.txt_wrap {position: relative; padding: 1em; border-radius: 1em; overflow: hidden; color: #fff;}
.txt_wrap:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; background:var(--siteC); }
.txt_wrap .sub_tt.dot:before { background: #fff;}

.img_wrap {gap: 2em;}
.img_wrap li { overflow: hidden; border-radius: 1em;}

.page_con{ padding:6em 0;}
.page_con.p1{ padding:4em 0 5em 0;}
.page_con:last-child{ padding-bottom:10em;}
.page_con.bg1{ background:#fafafa;}
.page_con.bg2{ position:relative;}
.page_con.bg2:before{ content:""; position:absolute; top:0; left:0; bottom:-3em; width:30vw; background:#16346c; border-radius:0 4em 4em 0;}
.page_con.bg2 + .page_con{ padding-top:8em;}
.page_con.bg3{ /*background:#16346c;*/background: linear-gradient(to right, #7988d3, #62d6da);}
.page_con.bg4{ background:#f4f7ff;}
.page_con.line:not(:first-child){ border:dashed #e5e5e5; border-width:2px 0 0 0;}

.page_col{ gap:2em 6em;}
.page_col.gp0{ gap:0 0;}
.page_col.gp1{ gap:2em 8em;}
.page_col > li{}
.page_col > li.w1{ width:40%;}
.page_col > li.w2{ width:28%;}
.page_col > li.w3{ width:38%;}
.page_col + .page_col{ margin-top:8em;}
.page_col > li .p1{ padding:4em 0 5em 0;}
.page_col > li .p2{ padding:3em 0 0 0;}
.page_col > li .p3{ padding:4.5em 6em;}
.page_col > li .round{ border-radius:2em; overflow:hidden;}
.page_col > li .wrap_img{ position:relative; height:100%;}

.page_tit2{ font-size:1.125em; color:#22; font-weight:500; padding-bottom:.5em}
.page_tit2 .xi{ margin:-.125em .25em 0 0}
.page_tit2 .xi:before{ content:"\e939"}

.sub_section { margin-top: 8em;}

/*  */

.message_wrap {margin: 2em 0 5em;}
.message_wrap .inn {text-align: center;;}
.message_wrap .inn .message_tt { font-size: 2.2em;width: 60%; margin:1em auto; font-weight: 700; letter-spacing: 0.3px;}
.message_wrap .inn .mark {width:3em; margin: 0 auto;}
.message_wrap .inn .mark:first-child {transform: scaleX(-1);}

.intro_wrap {border-top: 2px solid var(--siteC2); padding-top: 5em; border-top-right-radius: 1em; border-top-left-radius: 1em;}
.img_wrap {gap: 2em;}

.value_wrap { position: relative;}
.value_wrap:after { position: absolute; content: ''; border: 1px solid var(--siteC2); width: 27em; height: 27em; top: 5.6%; left: 31.8%; border-radius: 50%; border-top-color: #28276a; animation: spin 3s ease-in-out infinite; z-index: -1;}
.value_wrap .bg {position: absolute; top: 36%; left: 50%; transform: translate(-50%,-50%); width: 22%; height: 38%;}
.value_wrap .bg .tt { font-size: 2em; color: #fff; font-weight: 600;}
.value_wrap .list{width: 90%; margin: 0 auto;}
.value_wrap .list > li{width: 20%;}
.value_wrap .list > li .in{ position:absolute; left:0; top:0; width:100%; height:100%; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:.5em 0; color:#fff}
.value_wrap .list > li .in .ico{ font-size:3em}
.value_wrap .list > li .in .twrap{ display:flex; flex-direction:column; gap:.25em 0; text-align:center}
.value_wrap .list > li .in .t1{ opacity:.7; font-weight:500; font-size:.875em}
.value_wrap .list > li .in .t2{ font-weight:500; font-size:1.125em}

@keyframes spin {
  100%
  {
    transform: rotate(360deg);
  }
}

.program { position: relative;}
.program .top { position: relative; display: none;}
.scroll .program .top {display: block;}
.program .visual { width: 100%; color: #fff; position: relative; z-index: 1;}
.program .visual .inner { height: 23rem; border-radius: 3em; background-color: var(--siteC); overflow: auto;}
.program .visual .inner.c2 {background-color: midnightblue;}
.program .visual .inner.c3 {background-color: var(--siteC3);}
.program .visual .inner.c4 {background-color: var(--siteC2);}
.program .visual .inner .imgBox {position: absolute;left: 0; top: -1px; bottom: 0; width: 100%;box-shadow: 40px 0px 63px rgba(0, 0, 0, 0.25);border-radius: 3rem;overflow: hidden;animation: industry-visual 2s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s forwards;}
.program .visual .inner .txtBox {width: 44%;position: absolute;right: 0;bottom: 0;padding: 3em;}
.program .visual .inner .txtBox > * {transform: translateY(50%);opacity: 0;animation: industry-visual-txt 2s cubic-bezier(0.165, 0.84, 0.44, 1) 1.5s forwards;}
.program .visual .inner .txtBox span {display: block;font-size: 2rem;font-weight: 600;line-height: 1.2;}
.program .visual .inner .txtBox p {font-size: 1em;font-weight: 300;margin-top: 2rem;}
@keyframes industry-visual {
  0% {
    width: 100%;
  }
  100% {
    width: 50%;
  }
}
@keyframes industry-visual-txt {
  0% {
    transform: translateY(50%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
.expo {
  transition: 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.program .middle {margin-top: 6%;}
.program .middle .txt_box { padding: 2em; width: 60%;}
.program .middle .img_box {border-radius: 3em; overflow: hidden; width: 40%;}

.program_bottom { margin-top: 5em; position: relative; background:linear-gradient(0deg, rgba(1,83,155,.9) 50%, rgba(1,83,155,1) 100%); padding: 6em 0; color: #fff;}
.program_bottom .tx_box span { color: var(--siteC2); vertical-align: baseline;}

.spon p span {vertical-align: baseline; font-weight: 600;}


/*  */

.step_st{ display:flex; justify-content:center; gap:0 5em; margin:4em 0}
.step_st > li .ico{ position:relative}
.step_st > li:not(:last-child) .ico:before{ content:""; position:absolute; left:100%; top:50%; width:5em; height:1px; background:#ddd}
.step_st > li .ico .xi{ font-size:1em; width:1.5em; height:1.5em; margin:0 auto; display:flex; align-items:center; justify-content:center; color:#fff; background:#ccc; border-radius:50%}
.step_st > li .tt{ margin-top:.5em; text-align:center; color:#666}
.step_st > li.on .tt{ font-weight:500; color:#111}
.step_st > li.on .ico .xi,
.step_st > li.on .ico:before{ background:#0060ae}
.step_st > li.on .ico .xi:before{content:"\e928"}
.step_st > li:not(.on) .ico .xi{ transform:scale(.5)}


/* 개인정보처리방침 */

.agree_box{ border-radius:.5em; border:1px solid #ddd; padding:1.5em}
.agree_box.tt1{ color:#666; font-size:.938em; line-height:1.4}
.agree_box.h1{ height:12em; overflow-y: auto; }
.label_st2 input{zoom: 1.5; margin-bottom:auto; cursor:pointer}
.label_st2 input:checked{accent-color:#0060ae}
.label_st2 input:checked ~ .tt{color:#0060ae}

/*시설이용*/
.brand-cont {position: relative;}
.brand-cont .brand-wrap {margin-bottom: 6em;}
.brand-cont .brand-slide { position: relative; overflow: hidden;}
.brand-cont .inner {gap: 3em; position: relative;}
.brand-cont .inner .left  {position: absolute; background: #fff; width: 40%; left: 3em; bottom: -6em; padding: 2em; border-radius: 30px; box-shadow: 20px 20px 20px rgba(0,0,0,.1); border: 1px solid #eee;}
.brand-cont .inner .left .txt-wrap  {}
.brand-cont .inner .left .txt-wrap .page_tt:not(:last-child) {margin-bottom: 1em;}
.brand-cont .inner.rich .left .txt-wrap .page_tt:first-child {margin-bottom: .5em;}
.brand-cont .inner .left .txt-wrap .page_tt.ffSerif {font-weight: bold;}
/* .brand-cont .inner .left .txt-wrap .page_tt > i {font-size: 1.5em; color: #333; font-weight: bold;} */
.brand-cont .inner.rich {width: 100%;}
.brand-cont .inner.rich .left {width: 40%;}
.brand-cont .inner.rich .main-item {width: 100%; }
.brand-cont .inner.rich .main-item .title { color: #333; font-weight: 600;}
.brand-cont .inner.rich .main-item .title .s4 {color: #3dab1d;}
.brand-cont .inner.rich .item-slider { border-radius: 3em; background: #f8f8f8; padding: 2em; position: relative; margin-top: 1em;}
/* .brand-cont .inner.rich .item-list > li { flex: 1; display:flex;} */
.brand-cont .inner.rich .item-controller {position: absolute; left: 0; top: 45%; transform: translateY(-50%); width: 100%; z-index: 11111;}
.brand-cont .inner.rich .item-controller .item-prev,
.brand-cont .inner.rich .item-controller .item-next {position: absolute; width: 2.125em; height: 2.125em; border-radius: 50%; background: #fff; border: 1px solid #eee; box-shadow: 0 0 10px rgba(0,0,0,.1); font-size: 1.5em; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .2s;}
.brand-cont .inner.rich .item-controller .item-prev:hover,
.brand-cont .inner.rich .item-controller .item-next:hover {background: #8dc73f; color: #fff;}
.brand-cont .inner.rich .item-controller .item-prev {left: 2%;}
.brand-cont .inner.rich .item-controller .item-next {right: 2%;} 
.brand-cont .inner.rich .item-list > li{ padding: 1.25em;}
.brand-cont .inner.rich .item-list > li .wrap_in{ flex: 1; padding: 3em 1em; border: 1px solid #eee; box-shadow: 5px 5px 15px rgba(0,0,0,.1); box-sizing: border-box; border-radius: 3em; height: 100%; position: relative; background: #fff; transition: .5s;}
.brand-cont .inner.rich .item-list > li:hover .wrap_in {transform: rotateY(180deg); box-shadow: -5px 5px 15px rgba(0,0,0,.1); }
.brand-cont .inner.rich .item-list > li:hover .wrap_in .img-wrap,
.brand-cont .inner.rich .item-list > li:hover .wrap_in .txt-wrap {opacity: 0; visibility: hidden;}
/* .brand-cont .inner.rich .item-list > li:nth-child(1):after {content: ''; position: absolute; width: 4em; height: 1em; right: -3em; top: 55%; transform: rotate(45deg); background: #33a154; z-index: -1;}
.brand-cont .inner.rich .item-list > li:nth-child(2):after {content: ''; position: absolute; width: 4em; height: 1em; right: -3em; top: 45%; transform: rotate(-45deg); background: #33a154; z-index: -1;}
.brand-cont .inner.rich .item-list > li:nth-child(3):after {content: ''; position: absolute; width: 4em; height: 1em; right: -3em; top: 55%; transform: rotate(45deg); background: #33a154; z-index: -1;} */

/* .brand-cont .inner.rich .item-list > li:nth-child(even) {margin-top: 5em;} */
/* .brand-cont .inner.rich .item-list > li:hover .img-wrap img {transform: scale(1.1);} */
.brand-cont .inner.rich .item-list > li:hover .wrap_in .flip-wrap {transform: rotateY(180deg); opacity: 1;}
.brand-cont .inner.rich .item-list > li .wrap_in .flip-wrap {position: absolute; top: 0; left: 0; transition: .5s; opacity: 0; padding: 3em 2em; width: 100%; height: 100%; box-sizing: border-box;}
.brand-cont .inner.rich .item-list > li .wrap_in .flip-wrap .info-img {max-width: 70%; margin: auto;}
.brand-cont .inner.rich .item-list > li .wrap_in .flip-wrap .info-txt {margin-top: 2em; line-height: 1.5em; }


.brand-cont .inner.rich .item-list > li .img-wrap {max-width: 60%; margin: auto; border-radius: 50%; border: 2px solid #8dc73f; overflow: hidden; position: relative; background: #fff; z-index: 111; transition: .35s;}
.brand-cont .inner.rich .item-list > li .img-wrap img {transition: .3s;}
.brand-cont .inner.rich .item-list > li .txt-wrap {text-align: center; margin-top: 25%; transition: .35s;}
.brand-cont .inner.rich .item-list > li .txt-wrap .kr-tit {font-size: 1.35em; position: relative;}
.brand-cont .inner.rich .item-list > li .txt-wrap .kr-tit:before {content: ''; position: absolute; width: 10px; height: 10px; left: 50%; top: -.75em; background: #8dc73f; transform: translateX(-50%); border-radius: 50%; z-index: 111;}
.brand-cont .inner.rich .item-list > li .txt-wrap .kr-tit:after {content: ''; position: absolute; left: 50%; top: calc(-4em + .25em); width: 1px; height: 3em; background: #ddd; transform: translateX(-50%); z-index: 0;}
.brand-cont .inner.rich .item-list > li .txt-wrap .en-tit {font-size: 1.25em; font-weight: bold; margin-top: .25em;}

.brand-cont .inner .right {height: 32vh; width: 100%; overflow: hidden; border-radius: 30px; }
.brand-cont .inner .right .logo-box {position: absolute; right: 0; top: 0; width: 5em; padding: 1.5em; background: #fff; border-radius: 0 0 0 1em; height: 5em;}
.brand-cont .inner .right .logo-box > img {width: inherit; height: inherit; object-fit: contain; object-position: 50% 50%;}
.brand-cont .inner .right .img-wrap { position: relative; width: 100%; height: 100%;}
.brand-cont .inner .right .img-wrap:before{   content: '';  position: absolute; bottom: 0; width: 100%; height: 65%; opacity: 0.5;
 background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.0) 100%);}
.brand-cont .inner .right .img-wrap .inner_twrap{ position: absolute; bottom: 4em; right: 4em; width: 40%;}
.brand-cont .inner .right .img-wrap .inner_twrap > .inner_ttl{ font-size: 3.25em; color: #fff; font-weight: 600;}
.brand-cont .inner .right .img-wrap .inner_twrap > .inner_txt{ font-size: 1.15em; color: #fff; font-weight: 500; margin-top: .6em;}
.brand-cont .inner .right .img-wrap img {width: inherit; height: inherit; object-fit: cover; object-position: center;}
.partners-list {margin-top: 1em;}
.partners-list > li {flex: 1 1 25%;}
.partners-list > li .logo-img {max-width: 60%; margin: auto; transition: .3s;}
.partners-list > li .logo-img:hover {transform: scale(1.1);}
.partners-list > li .logo-img img {width: inherit; height: inherit; object-fit: contain; object-position: center;}

.brand-download {position: absolute; bottom: -3.5em; right: 0;}
.brand-download .btn {}
.brand-download .btn > a {padding: 1em 2em; background: #ca0202; color: #fff; border-radius: 30px; font-size: 1.125em; font-weight: 500;}
.brand-download .btn > a .xi {font-size: 1.25em; vertical-align: bottom;}

.swiper-container-horizontal > .swiper-pagination-bullets.paging_btn { position: absolute; top: -6em; left: 0; text-align: unset;}
.swiper-container-horizontal > .swiper-pagination-bullets.paging_btn.swiper-pagination-bullet{ background: none; min-width: auto; min-height: auto; width: auto !important; height: auto !important;}
.swiper-pagination-bullet.paging_btn{ display: none;}

.paging_btn .swiper-pagination-bullet{ width: auto !important; height: auto !important; background: none; border-radius: none; opacity: 1;}
.paging_btn .swiper-pagination-bullet > span{ position:relative; width: auto; padding: .8em 2em; border-radius: 3em; background: #EFEFEF; margin-right: 0.35em; color: #111; font-size: 1.15em; font-weight: 600; transition: .25s; box-shadow: 2px 3px 6px rgba(0,0,0,.15);}
.paging_btn .swiper-pagination-bullet > span:hover{ background: #2a6bb6; color: #fff; transition: .25s;}
.paging_btn .swiper-pagination-bullet.swiper-pagination-bullet-active > span{ background: #2a6bb6; color: #fff;}
.paging_btn .swiper-pagination-bullet > span:before{}



/************캘린더***************/
.box1.cal { width: 85%;}
.calendar p{line-height: 20px;}
.clearfix{clear: both;}
.calendar{border-radius: 4px;overflow: hidden;width: 100%; height: 51em;background-color: #ffffff; border-radius: 1.5em; box-shadow: 3px 0 9px rgba(0,0,0,.15);}
.calendar h1, .calendar h2{font-weight: 400; font-size: 3em;}
.calendar h1 span{display: block;}
.calendar .col{}
.calendar .col .content{ }
.calendar .col .content .date_all{ color: #fff; padding: .5em .5em;}
.calendar .col .content .date{}
.calendar ul{margin: 0px;}
.calendar ul li{list-style: none;}


.calendar .review .title{ font-size: 1.35em; font-weight: 600; line-height: 1.3; margin-bottom: .5em;}
.calendar .addNote,
.calendar .removeNote{color: rgba(255,255,255,0.4);font-weight: bold;width: 25%; font-size: .9em; line-height: 1.7em;}
.calendar .addNote:hover,
.calendar .removeNote:hover{color: #ffffff;}
.calendar .addNote{font-size: 16px;}
.calendar .rightCol{width: 70%; padding: 2em; box-sizing: border-box;}
.calendar .rightCol h2{color: #C7BEBE;text-align: right;margin-bottom: 70px;}
.calendar .months li{ width: 8%;}
.calendar .weekday li{ padding: 0.365em;height: 2em;width: 14.285%;background: #2a6bb6;border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .days{ justify-content: space-around;}
.calendar .months li a{font-size: 1.15em; color: #C7BEBE;text-align: center; margin-bottom: 1.5em;}
.calendar .months li .selected{color: #444444; font-weight: 700;}
.calendar .weekday li a{text-align: center;font-size: 1em;color: #193988;font-weight: 500;}
.calendar .days li a{text-align: left; font-size: 1em;font-weight: bold; height: 100%; box-sizing: border-box; border-radius: .5em; margin-bottom: .5em; padding: 1em;transition:.2s; }
.calendar .days li .sun{color: #d52828;}
.calendar .days li .say{ color: #0c318e;}
.calendar .months, .calendar .days {gap: 0.2em;}
.calendar .weekday { margin-bottom: 1em;}
.calendar .leftCol { width: 30%; /*overflow-y: scroll;*/ height: 52em; }
.calendar .days li .selected { }
.calendar .date { position:relative; }
.calendar .days li { width: 13.8%;box-sizing: border-box; height: 6.5em;border: 2px solid #f0f4ff;border-radius: 0.5em;box-sizing: border-box;}

/* 기본 */
.calendar .months li a,
.calendar .weekday li a,
.calendar .days li a{display: block;color: #747978;}
.calendar .days li a .cases{ text-align:center; margin-top: 1em; background: var(--siteC2); color: #fff; padding: .35em 0em; border-radius: 3em;}
.calendar .days li:hover{background-color: #f0f4ff;color: #193988;transition:.2s;}
.calendar .weekday li { padding: 0.365em;height: 2em;width: 14.285%;background: var(--siteC);border-left: 0.125em solid #fff;border-right: 0.125em solid #fff;border-radius: 0.5em;box-sizing: border-box;}
.calendar .weekday li a { color: #f0f4ff;}

/* 선택했을때 */
.calendar .days li .selected{}
.calendar .days li .selected:hover{ cursor: auto;}
.calendar .days li .selected{ color: #fff; background-color: #193988}
.calendar .days li .selected .cases{ text-align:center; margin-top: 1em; background: #fff; color: #3c8cdf; padding: .35em 0em; border-radius: 3em;}

/* 마감됐을때 */
.calendar .close {}
.calendar .days li .close{ background-color: #f4f4f4}
.calendar .days li .close .cases{ text-align:center; margin-top: 1em; background: #ddd; color: #333; padding: .35em 0em; border-radius: 3em;}


/*대관신청*/
.rental{ gap: 1em;}
.brand-cont  .info_wrap{ margin: 6em 0;}
.brand-cont .info_wrap .info_left{ flex: 1 1 35%;}
.brand-cont .info_wrap .info_right{ flex: 1 1 65%;}
.brand-cont .info_wrap .info_right .info_list{ margin-top: 1em; gap: 1em;}
.brand-cont .info_wrap .info_right .info_list > li{padding: 1.5em;background-color: rgba(0,125,197,.1); margin-bottom: 0.5em; border-radius: 1em; width: 85%;}
.brand-cont .info_wrap .info_right .info_list > li .info_tcon{ }
.brand-cont .info_wrap .info_right .info_list > li .info_tcon .ttl{ font-size: 1.35em; font-weight: 600; margin-bottom: 1em;}
.brand-cont .info_wrap .info_right .info_list > li .info_tcon .txt{ font-size: 1.15em; font-weight: 500;}
.brand-cont .data_tt { font-size: 1.5em; font-weight: 600;}
.brand-cont .data_tt .xi {background-color: var(--siteC); color: #fff; width: 1.5em; height: 1.5em; border-radius: 50%; line-height: 1.5em; text-align: center; margin-right: .5em;font-size: 1.3em;}

.sub-tab {max-width: 70%; margin: auto; border-radius: 3em; overflow: hidden; border: 1px solid var(--siteC); box-shadow: 0 10px 30px rgba(0,0,0,.1); margin-bottom: 6em;}
.sub-tab > li {flex: 1; display: flex; align-items: center; justify-content: center;  height: 4.5em;  color: var(--siteC); background: #fff; border-right: 1px solid #2a6bb6; cursor: pointer; transition: .3s;}
.sub-tab > li:last-child {border-right: none;}
.sub-tab > li .tab-btn {font-size: 1.125em; width: 100%; text-align: center; font-weight: 600;} 
.sub-tab > li.on,
.sub-tab > li:hover {background: var(--siteC); color: #fff; border-right-color: #fff;} 

.brand-wrap {}
.brand-wrap .inner {}
.brand-wrap .inner .img-wrap {border-radius: 1em; overflow: hidden;}

.detail {border: 1px solid var(--siteC); border-radius: 1em; overflow: hidden; margin-top: 6em;}
.detail .tit {background-color: var(--siteC); padding: 1em; text-align: center; color: #fff; font-size: 1.35em; font-weight: 600;}
.detail .inn {padding: 2em;}

/*지점찾기*/
.page_search { margin: 0 0 3em; padding: 0 0 2.5em;}
.page_search .search_wrap { gap: 1em; height: 5.5em;}
.page_search .search_wrap .round { background-color: var(--siteC); border: none; border-radius: 5em; box-shadow: 0 4px 1.25em rgba(0, 0, 0, .18); overflow: hidden;}
.page_search .search_wrap .tit { position: relative; padding: 0 2.5em; color: #fff;font-weight: 500;}
.page_search .search_wrap .tit:after { content: ""; position: absolute; right: 0; top: 50%; width: 1px; height: 1.125em; background: #000; opacity: .15; transform: translateY(-50%);}
.page_search .search_wrap .tit .tt { font-size: 1.375em;}
.page_search .search_wrap .inp { height: 100%; border: none; color: #fff;}
.page_search .region { flex: 1; gap: 1.5em; padding-right: 2em;}
.page_search .region .sel { flex: 1; font-size: 1.250em; background-color: var(--siteC); background: url('../images/sub/search_icon.png') no-repeat 97% 50%/15px auto; ;}
.page_search .search { flex: 1; gap: 0 1.5em;}
.page_search .search .inp.txt { flex: 1; background: transparent; font-size: 1.375em;}
.page_search .search .inp.btn { width: 4em; height: 4em;background: #fff; color: var(--siteC); transition: .3s; border-radius: 50%; margin-right: 1em;}
.page_search .search .inp.btn:hover {color: var(--siteC2); transition: .3s;}
.page_search .search .inp.btn .xi { font-size: 1.875em;}
.page_search .search .inp::placeholder { color: #fff; }
.page_search.s1{ font-size:.75em}

.map_tit .sub_tt i {vertical-align: baseline;}
.branch_map{ background:#fff; border-radius:1em; box-shadow: 0 4px 1.625em rgba(0,0,0,.13); overflow:hidden;}
.branch_map .page_col > li{ position:relative;}
.branch_map .page_col > li.inList{ z-index:2; width: 38%; /*box-shadow:4px 0 1.625em rgba(81,136,245,.8);*/ box-shadow: 4px 0 1.625em rgba(0,0,0,.2);}
.branch_map .inH { height:41.25em;}
.branch_map .inH2{ height:36em;}
.branch_map .scrollst{ height:100%;}
.branch_map .addr_list{ padding:1.5em;}
.branch_map .addr_list > li{ position:relative; padding:1em 0; padding-right:3em; min-height:3em; box-sizing:border-box; cursor:pointer; transition:.2s;}
.branch_map .addr_list > li + li{ border-top:1px dashed #ccc;}
.branch_map .addr_list > li .in .txt_box{ gap:1em;}
.branch_map .addr_list > li .in .txt_box .ico{ width:2em; height:2em; background:var(--siteC2); border-radius:50%; font-size:1em; color:#fff; line-height: 2em;}
.branch_map .addr_list > li .in .txt_box .txt{ flex:1; gap:.25em 0;}
.branch_map .addr_list > li .in .txt_box .txt .tt{}
.branch_map .addr_list > li .in .txt_box .txt .t1{ font-size:1.125em; font-weight: 600; line-height:1.4; overflow: hidden; text-overflow: ellipsis; width: 20em; white-space: nowrap; word-break:break-all;}
.branch_map .addr_list > li .in .txt_box .txt .t2{ color:#444; overflow: hidden; text-overflow: ellipsis; width: 20em; white-space: nowrap; word-break:break-all;}
.branch_map .addr_list > li .in .btn{ position:absolute; top:50%; right:0; width:2em; height:2em; line-height: 2em; background:#fff; border:1px solid var(--siteC); border-radius:50%; color:var(--siteC); transform:translateY(-50%); transition:.2s;}
.branch_map .addr_list > li .in .btn .tt{ font-size:.875em;}
.branch_map .addr_list > li .in .btn .xi{ font-size:.813em;width: 100%;}
.branch_map .addr_list > li .in .btn:hover{ background:var(--siteC); color:#fff;}
.branch_map .addr_list > li:hover,
.branch_map .addr_list > li.on{ padding-left:1em; background:#f5f5f5;}
.branch_map .addr_list > li:hover .in .txt_wrap .ico,
.branch_map .addr_list > li.on .in .txt_wrap .ico{ background:#00a0a5;}
.branch_map .addr_list > li:hover .btn,
.branch_map .addr_list > li.on .btn{ right:.5em;}

.branch_map #map{ width:100%; height:100%;}

#map .overlay{ display:none; position:absolute; left:50%; bottom:50px; box-sizing:border-box; border:2px solid var(--siteC); border-radius:1em 1em; background:#fff; box-shadow:1px 1px .5em rgba(0,0,0,.5); transform:translateX(-50%); z-index:99;}
#map .overlay .closeOverlay{ position:absolute; left:calc(100% + .5em); top:0; width:2em; line-height:2em; text-align:center; background:#154194; border-radius:1em; color:#fff; cursor:pointer;}
#map .overlay .closeOverlay:hover{ background:#333;}
#map .overlay .con_wrap{ flex:1; padding:1em; width:26em; box-sizing:border-box; white-space:normal; word-break:keep-all;}
#map .overlay .con_wrap.flex{ gap:.5em;}
#map .overlay .con_wrap .map_tit{ font-size:1.188em; font-weight:600;}
#map .overlay .con_wrap .map_tt{ display:flex; align-items:center; color:#666;}
#map .overlay .con_wrap .map_tt .xi{ width:1.5em; font-size:1em;}
#map .overlay .con_wrap .map_tt .tt{ flex:1;}
#map .overlay .btn_wrap{ width:5em;}
#map .overlay .btn_wrap > a{ height:100%; gap:.5em; background:#f5f5f5; border-left:1px dashed #ddd; border-radius:0 .75em .75em 0; color:#154194; transition:.2s;}
#map .overlay .btn_wrap > a .tt{ font-size:.938em; font-weight:500;}
#map .overlay .btn_wrap > a:hover{ background:var(--siteC); color:#fff;}
#map .overlay.on{ display:block}

.branch_view{ overflow:hidden;}
.branch_view .posImg{ position:absolute;}
.branch_view .posImg img{ width:100%;}
.branch_view .posImg.st1{ bottom:-6vw; left:85vw; width:16vw;}

.branch_view .sbj_list{ gap:.25em;}
.branch_view .sbj_list > li{}
.branch_view .sbj_list > li .in{ height:2.25em; min-width:5.5em; padding:0 1em; background:#fff; border-radius:8em; color:#000;}

/*SHOP*/
/**/
.shopSlider_wrap .el .img{ height:34em}
.shopSlider_wrap{ position:relative;}
.shopSlider_wrap .control_wrap{ position:relative}
.shopSlider_wrap .control_wrap:before{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; border-left:none; border-right:none; box-sizing:border-box}
.shopSlider_wrap .control_wrap .control{ border:1px solid #ddd; border-top:none; border-bottom:none; padding:0 1em; z-index:10}
.shopSliderThumb_wrap{ padding-bottom:1px}
.shopSliderThumb_wrap .el{ width:20%}
.shopSliderThumb_wrap .el .in{ display:flex; align-items:center; justify-content:center; height:3em; position:relative; border-right:1px solid #ddd; cursor:pointer}
.shopSliderThumb_wrap .el.swiper-slide-thumb-active .in:after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--siteC);}
.shopSliderThumb_wrap .el .in .t1{ font-weight:500}

.ico_wrap.flexN.vc.hr .btn.PHONE .vm_wrap.js-toggle-nav [class^=xi-] { font-size: 2em;}

.shop_box{ padding:4em 0}
.shop_box.p0{ padding:0}
.shop_box.bg1{ background:#f5f5f5}
.shop_titN{ margin-bottom:2em}
.shop_titN.pd{ padding-left:1em;}
.shop_titN .t1{ font-weight:300; font-size:2.25em}
.shop_titN .t1 strong{ vertical-align: baseline; font-weight:700; color: var(--siteC);}

.shop_prod_best .tab_wrap{ width:13em;} 
.shop_prod_best .tab_wrap > li > a{ padding:1em 3em; border:1px solid #ddd; border-radius:1em; margin-bottom:1em; color:#999; position:relative; transition:.3s}
.shop_prod_best .tab_wrap > li > a:after{ content:""; position:absolute; right:0; top:50%; height:1px; background:#fff; transition:.3s}
.shop_prod_best .tab_wrap > li > a .t1{ font-weight:700; font-size:1.188em}
.shop_prod_best .tab_wrap > li:hover > a,
.shop_prod_best .tab_wrap > li.on > a{ background:var(--siteC); border-color:transparent; color:#fff; padding-right:4em}
.shop_prod_best .tab_wrap > li:hover > a:after,
.shop_prod_best .tab_wrap > li.on > a:after{ width:2em}
.shop_prod_best .prod_wrapN{ margin-left:4em}
.shop_prod_recom .tab_wrap{ display:flex; gap:1em 3em; margin-bottom:2em}
.shop_prod_recom .tab_wrap > li > a .t1{ font-weight:700; font-size:1.313em; color:#999}
.shop_prod_recom .tab_wrap > li > a .t1:before{ content:"#"; margin-right:.25em; display:inline-block}
.shop_prod_recom .tab_wrap > li:hover > a .t1,
.shop_prod_recom .tab_wrap > li.on > a .t1{ color:#62614C}
.prod_wrapN{ display:flex; flex-wrap:wrap; gap:2em}
.prod_wrapN .prod_stN{ width:calc(25% - 1.5em)}
.prod_wrapN.sec1 .prod_stN{ width:calc( (100% - 4em) / 3);}
.prod_stN{ position:relative}
.prod_stN .img_wrap{ border-radius: 1em; overflow: hidden;}
.prod_stN .con_wrap{ padding:1em 0; display:flex; flex-direction:column; gap:1em}
.prod_stN .con_wrap .tit{}
.prod_stN .con_wrap .tit .t1{ font-weight:500; font-size:1.125em}
.prod_stN .con_wrap .tit .t2{ font-weight:700; font-size:1.225em; margin-top: .5em;}
.prod_stN .con_wrap .price{ display:flex; flex-wrap:wrap; align-items:center; gap:1em; font-size:1.5em}
.prod_stN:hover .img_wrap{ border-color:#375fff}
.prod_stN:hover .con_wrap .tit{ text-decoration:underline }
.prod_stN.st1{ border-radius:50%; overflow:hidden}
.prod_stN.st1 .img_wrap{ border:none}
.prod_stN.st1 .con_wrap{ position:absolute; left:0; top:0; width:100%; height:100%; padding:0; background:rgba(0,0,0,.5); color:#fff; display:flex; align-items:center; justify-content:center; flex-direction:column; visibility:hidden}
.prod_stN.st1:hover .con_wrap{ visibility:visible}

/**/

.prodListImg{ padding:3em 5em; height:12.5em; position:relative; box-sizing:border-box; margin:-1em 0 1.5em 0}

/**/
.list_prod_wrap{}
.list_prod_wrap .list_prod_tit{ color:#111; position:relative; margin-bottom:1.5em}
.list_prod_wrap .list_prod_tit .t1{ font-size:1.625em; vertical-align:baseline; margin-right:.5em}
.list_prod_wrap .list_prod_tit .t2{ opacity:.6;}
.list_prod_wrap .list_prod_tit .t3{ color:#CC0000; font-weight:700; font-size:1.313em;}
.list_prod_wrap .list_prod_tit .t3.c1{ color:#343b4d}
.list_prod_wrap .list_prod_tit .t3.c2{ color:#375fff}
.list_prod_wrap .list_prod_tit .t4{ margin-right:.5em}
.list_prod_wrap .list_prod_tit .btn{ position:absolute; right:0; bottom:.875em; padding:.25em 1em; background:#f5f5f5; border:1px solid #ddd; font-size:.688rem; color:#666; transition:.3s}
.list_prod_wrap .list_prod_tit .btn .xi{ padding-right:.25em}
.list_prod_wrap .list_prod_tit .btn .add:before{content:"\e9a7"}
.list_prod_wrap .list_prod_tit .btn .arrow{ padding:0 0 0 .5em}
.list_prod_wrap .list_prod_tit .btn .arrow:before{content:"\e93f"}
.list_prod_wrap .list_prod_tit .btn:hover{ background:#333; color:#fff; border-color:transparent}
.list_prod_wrap .list_prod_tit .btn.st1{ top:-.25em; bottom:auto; padding:.438em 3em; font-size:.875rem; background:#630D0D; border-color:transparent; color:#fff; border-radius:2em}
.list_prod_wrap .list_prod_tit.st1{ border-bottom:1px solid #ddd; padding-bottom:1em; margin-bottom:1em}
.list_prod_wrap .list_prod_tit .tbox{ float:left}
.list_prod_wrap .list_prod_tit .search{ float:right; font-size:.813em}

.list_prod_wrap .list_prod{ margin:0 0 0 -1.25rem;}
.list_prod_wrap .list_prod .prod .el{ display:inline-block; *display:inline; zoom:1; vertical-align:top; font-size:16px; font-size:1rem;}
.list_prod_wrap .list_prod .prod .in{ position:relative; display:block; box-sizing:border-box; margin:0 0 1.25rem 1.25rem;}
.list_prod_wrap .list_prod .prod .in .img_wrap{display:block;position:relative;overflow:hidden;background:#fff; border-radius: 1em; overflow: hidden;}
.list_prod_wrap .list_prod .prod .in .img_wrap:before{ content:""; position:absolute; z-index:1; left:0; top:0; width:100%; height:100%; background:#000; opacity:0; visibility:hidden; transition:.3s}
.list_prod_wrap .list_prod .prod .in .img_wrap:after { content:"\e917"; font-family:xeicon!important; position:absolute; z-index:1; left:50%; top:50%; transform:translate(-50%, -50%); font-size:2em; color:#fff; opacity:0; visibility:hidden; transition:.3s}
.list_prod_wrap .list_prod .prod .in .img_wrap img{ transition:.3s}
.list_prod_wrap .list_prod .prod .in .con_wrap{ display:block; padding:3em .25em 4.25em .25em; position:relative}
.list_prod_wrap .list_prod .prod .in .con_wrap .t1{display:block;font-size: .6875em;opacity:.6;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:1.5em}
.list_prod_wrap .list_prod .prod .in .con_wrap .t2{display:block;font-size:1.25em; font-weight: 600; color:#222;word-break:break-all;line-height:1.25em;height:2.5em;overflow:hidden;}
.list_prod_wrap .list_prod .prod .in .con_wrap .t3{ display:block; font-size:.75em; line-height:1.2em; height:2.4em; overflow:hidden; opacity:.6; word-break:break-all}
.list_prod_wrap .list_prod .prod .in .con_wrap .priceBox{position:relative;}
.list_prod_wrap .list_prod .prod .in .con_wrap .priceBox > *{ display:inline-block;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price{ margin-right:.25em; color:#222; font-size: 1.35em;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price .no { font-size:.8125em; font-weight:500;}
.list_prod_wrap .list_prod .prod .in .con_wrap .price .won{ font-size:.8125em; font-weight:500; padding-left:.125em;}
.list_prod_wrap .list_prod .prod .in .con_wrap .discount{ font-size:.938em; color:#77787b; text-decoration:line-through;}
.list_prod_wrap .list_prod .prod .in .con_wrap .per{ font-size:1.375em; color:#00a75d; font-weight:700; margin-top:.125rem; margin-right:.125em; display:block}
.list_prod_wrap .list_prod .prod .in .prod_icon{ position:absolute; left:0; top:.75em; width:100%; display:flex}
.list_prod_wrap .list_prod .prod .in .best_num{ position:absolute; z-index:2; top:-.625em; left:-.625em; width:3.5em; line-height:3.5em; background:#f2f5f6; border-radius:100%; text-align:center;}
.list_prod_wrap .list_prod .prod .in .best_num .no{ font-size:1.375em; color:#444; font-weight:700; font-style:italic; letter-spacing:0;}
.list_prod_wrap .list_prod .prod .in:hover .t1{ color:#00a75d; opacity:1}
.list_prod_wrap .list_prod .prod .in:hover .t2{ text-decoration:underline}
.list_prod_wrap .list_prod .prod .in:hover .t3{ opacity:1}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap:before{ opacity:.5; visibility:visible}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap:after{ opacity:1; visibility:visible; transform:translate(-50%, -50%) rotate(90deg)}
.list_prod_wrap .list_prod .prod .in:hover .img_wrap img{ transform:scale(1.2,1.2);}

.prod_icon{ overflow:hidden;}
.prod_icon .icon{ display:flex; align-items:center; justify-content:center; height:2.25em; border-radius:.25em; margin-right:4px; padding:0 .75em; line-height:2em; font-size:.75em; font-weight:500; text-transform:uppercase; color:#fff}
.prod_icon .icon:before{ font-family:xeicon; font-size:1.25em; font-weight:normal; margin-right:.125em;}
.prod_icon .icon.c1{ background:#3333CC}
.prod_icon .icon.c2{ background:#CC3333}
.prod_icon .icon.c3{ background:#009966}
.prod_icon .icon.c4{ background:#000; color:#fff;}
.prod_icon .icon.c1:before{content:"\eba4"}
.prod_icon .icon.c2:before{content:"\e9da"}
.prod_icon .icon.c3:before{content:"\e905"}

.list_prod_wrap.st1 .list_prod .prod .el{ width:calc(100% / 3);}
.list_prod_wrap.st2 .list_prod .prod .el{ width:33.33%;}
.list_prod_wrap.st2 .list_prod .prod .in{ text-align:center;}
.list_prod_wrap.st2 .list_prod .prod .in .img_wrap{ border-radius:100%; box-shadow:none;}
.list_prod_wrap.st2 .list_prod .prod .in .con_wrap{ padding-bottom:0;}
.list_prod_wrap.st2 .list_prod .prod .in .con_wrap .t2{ text-overflow:ellipsis; white-space:nowrap; overflow:hidden;}

.list_prod_wrap.slide{ position:relative;}
.list_prod_wrap.slide .list_prod .prod .el{ float:left;}
.list_prod_wrap.slide .list_prod .prod .in{ margin-bottom:0;}
.list_prod_wrap.slide .list_prod .prod{ display:none;}
.list_prod_wrap.slide .list_prod .prod.slick-slider{ display:block;}

.list_prod_wrap.slide.st2 .list_prod{ margin:0 0 0 0;}
.list_prod_wrap.slide.st2 .list_prod .prod .in{ margin:0 .5rem;}

.list_prod_wrap .wrap_top{ border-bottom:1px solid #111; margin:1.5em 0 3em 0}
.list_prod_wrap .wrap_top .wrap_tit{ float:left; margin-top:.5em; margin-bottom:0; font-size: 1.2em; font-weight: 700;}
.list_prod_wrap .wrap_top .wrap_tab{ float:right; font-size:.938em; border-bottom:none}
.list_prod_wrap .wrap_top .wrap_tab > li{ width:9em}

.tab_st{ border-bottom:1px solid #111;}
/* .tab_st > li{ width:33.33%} */
.tab_st > li{ width:50%}
.tab_st > li > a{ background:#f5f5f5; height:3.5em; color:#777; border:1px solid #ddd; margin-right:-1px; border-bottom:none; position:relative}
.tab_st > li > a:after{ content:""; position:absolute; left:0; bottom:-1px; width:100%; height:1px; background:#fff; display:none; z-index:1}
.tab_st > li > a .va{ font-size:1.125em; font-weight:500;}
.tab_st > li:hover > a{ color:#111}
.tab_st > li.on > a{ background:#fff; border-color:#111; color:#111; z-index:1}
.tab_st > li.on > a:after{ display:block}
.tab_st > li.btn{ width:auto !important}
.tab_st > li.btn > a{ margin-left:1em; background:#8c655d; border-color:transparent; color:#fff; padding:0 1.5em}
.tab_st > li.btn > a .xi{ margin-top:-.125em}

.shopping_search{ padding:1.5em; box-shadow: 0 0 1em rgba(0,0,0,.1); border-radius: 1em;}
.shopping_search .search > *{ display:inline-block; vertical-align:middle;}
.shopping_search .search > dt{ font-size:.938em; color:#222; font-weight:500; padding-right:1.5em;}
.shopping_search .search > dd{ font-size:.875em;}
.shopping_search .search button{ background:#343b4d; color:#fff; border:none;}

.prod_view_top{ display:flex; flex-wrap:wrap; padding:4em; background:#f5f5f5; border-radius:2em; box-sizing:border-box}
.prod_view_top .wrap_img{ width:36%; margin-right:4em}
.prod_view_top .wrap_img .big{ }
.prod_view_top .wrap_img .big .resize{ box-shadow:0 0 1em rgba(0,0,0,.1)}
.prod_view_top .wrap_img .thumb{ margin-top:1em}
.prod_view_top .wrap_img .thumb .list{ display:flex; margin:-.25em}
.prod_view_top .wrap_img .thumb .list > li{ width:20%}
.prod_view_top .wrap_img .thumb .list > li > a{ margin:.25em; display:block; position:relative}
.prod_view_top .wrap_img .thumb .list > li > a:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%; box-sizing:border-box; border:2px solid #eee}
.prod_view_top .wrap_img .thumb .list > li > a:hover:after,
.prod_view_top .wrap_img .thumb .list > li.on > a:after{ border-color:#0060ae}
.prod_view_top .wrap_con{ flex:1 1 0%; min-width:0; box-sizing:border-box; padding:1.25em 0 0 0; display:flex; flex-direction:column; gap:1.5em}
.prodV_tit{ font-weight:700; font-size:1.625em; line-height:1.2}
.prodV_option{ background:#fff; border:1px solid #ddd; display:flex; flex-direction:column; border-radius:.5em}
.prodV_option > li .in{ display:flex; flex-direction:column; gap:1em; padding:1.5em; box-sizing:border-box}
.prodV_option > li:not(:first-child) .in{ border-top:1px dashed #ddd}
.prodV_option .tit{ font-weight:500; font-size:1.063em}
.prodV_option .volW{ margin-left:auto}
.prodV_btn{ margin-top:auto}

.prod_view_con{ padding:4em; box-shadow: 0 0 1em rgba(0,0,0,.1); border-radius:2em; margin-top:4em}
.prod_view_con .wrap_con{ padding:2em 0}

.volW{ display:flex; align-items:center; gap:0 1em}
.volW .st{ display:flex; align-items:center; justify-content:center; height:3em; box-sizing:border-box; border:1px solid #ddd; background:#fff}
.volW .st.ctr{ width:3em}
.volW .st.ctr .xi{ font-size:1em}
.volW .st.ctr.plus .xi:before{content:"\e913"}
.volW .st.ctr.minus .xi:before{content:"\e91a"}
.volW .st.ctr:hover,
.volW .st.ctr:focus{ background:#f5f5f5}
.volW .st.inp{ width:5em; text-align:center}
.volW .st.btn{ border-radius:.5em; padding:0 1em; border-color:transparent; background:#333; color:#fff}
.volW.s1{ font-size:.813em}
.volW .vol_tt{ font-weight:500; color:#666; font-size:1.188em}
.vol{ display:flex; padding-right:1px;}
.vol .st{ margin-right:-1px}
.vol .st:first-child{ border-radius:.5em 0 0 .5em}
.vol .st:last-child{ border-radius:.0 .5em .5em 0}

.price_total{ border:2px solid #0060ae; border-radius:.5em; padding:1em; display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:1em 3em}
.price_total .in{ display:flex; gap:0 .5em; align-items:center;}
.price_total .t1{ font-weight:700}
.price_total .t2{ font-size:1.125em}
.price_total .t3{ font-size:1.25em}
.price_total .mark{ font-size:2em; font-weight:700; color:#aaa; line-height:1; transform:translateY(-.063em)}
.price_total .mark.plus:before{content:"+"}
.price_total .mark.minus:before{content:"-"}
.price_total .mark.equal:before{content:"="}
.price_total.ac{ justify-content:center}
.price_total.p1{ padding:2em}
.price_total.st1{ padding:0; border:none; font-weight: 700;}

.prod_list{ display:flex; flex-wrap:wrap; margin:-1.5em}
.prod_list > li{ width:20%}
.prod_list > li .prod_st{ margin:1.5em; position:relative}
.prod_st .img_wrap{ box-sizing:border-box; border-radius:.5em .5em 0 0; overflow:hidden; border:1px solid #ddd}
.prod_st .btn_wrap{ display:flex; align-items:center; justify-content:space-between; border-radius:0 0 .5em .5em; border:1px solid #ddd; border-top:none; background:#f5f5f5; padding:.5em 1em}
.prod_st .btn_wrap .cart{ color:#666}
.prod_st .btn_wrap .cart .xi:before{content:"\e9fb"}
.prod_st .btn_wrap .cart input{zoom:1.8}
.prod_st .btn_wrap .buy{ width:1.75em; line-height:1.75em; text-align:center; border-radius:50%; color:#002144}
.prod_st .btn_wrap .buy .xi:before{content:"\e9fe"}
.prod_st .btn_wrap .buy:hover{ background:#002144; color:#fff}
.prod_st .con_wrap{ padding:1em .25em; display:flex; flex-direction:column; gap:.75em}
.prod_st .prod_tit{ font-size:1.125em; font-weight:500; line-height:1.2}
.prod_st .prod_tit a:hover,
.prod_st .prod_tit a:focus{ text-decoration:underline}
.prod_st .prod_info{ font-size:.938em}
.prod_st .prod_info > li{ display:flex; align-items:center}
.prod_st .prod_info > li:not(:first-child){ margin-top:.25em}
.prod_st .prod_info > li .tit{ width:4em; margin-right:1em; color:#777; position:relative}
.prod_st .prod_info > li .tit:after{ content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:70%; background:#ddd}
.prod_st .prod_info > li .tt{ flex:1 1 0%; min-width:0}
.prod_st .prod_info.flex{ flex-wrap:wrap; gap:1em 4em}

.listOn .prod_list{ display:block; margin:0; border-top:1px solid #111}
.listOn .prod_list > li{ width:100%}
.listOn .prod_list > li .prod_st{ margin:0; padding:1.5em 0; display:flex; align-items:center; flex-wrap:wrap; gap:1em 3em; padding-left:2.5em; border-bottom:1px dashed #ddd}
.listOn .prod_list > li .prod_st.p1{ padding-left:0}
.listOn .prod_st .img_wrap{ width:8em; border-radius:.5em}
.listOn .prod_st .img_wrap:hover{ border-color:#0060ae}
.listOn .prod_st .img_wrap.w1{ width:6em}
.listOn .prod_st .btn_wrap{ order:2; flex-direaction:column; border:none; background:none}
.listOn .prod_st .btn_wrap .cart{ position:absolute; left:0; top:4em}
.listOn .prod_st .btn_wrap .cart .xi{ display:none}
.listOn .prod_st .btn_wrap .buy{ width:auto; padding:.5em 1em; border-radius:.5em; border:1px solid #0060ae; font-weight:500; display:flex; align-items:center; color:#0060ae; gap:0 .25em}
.listOn .prod_st .btn_wrap .buy:hover{ border-color:transparent; color:#fff}
.listOn .prod_st .btn_wrap .buy:after{ content:"바로구매"}
.listOn .prod_st .btn_wrap .delete .xi:before{ content:"\e96f"}
.listOn .prod_st .con_wrap{ flex:1 1 0%; min-width:0; padding:0}

.orderListW .prod_list .prodL .prod_st:not(:first-child){ display:none}
.orderListW .prod_list > li{ padding:.5em; box-sizing:border-box}
.orderListW .prod_list > li .prod_st:last-child,
.orderListW .prod_list:not(.on) > li .prod_st{ border-bottom:none}
.orderListW .prod_list .wrapBtn .ico{ font-size:1em}
.orderListW .prod_list .wrapBtn .ttClose{ display:none}
.orderListW .prod_list .wrapBtn .ico:before{content:"\e941"}
.orderListW .prod_list.on .wrapBtn .ico{ transform:rotate(180deg)}
.orderListW .prod_list.on .wrapBtn .ttOpen{ display:none}
.orderListW .prod_list.on .wrapBtn .ttClose{ display:inline-block}
.orderListW .prod_list.on .prodL .prod_st{ display:flex}

.order_infoW{ padding:1em 0 0 0; gap:.5em 1.5em}
.order_infoW .xi{ font-size:1em}
.order_btnW{ margin-bottom:3em}

.page_twrap2{ display:flex}
.page_twrap2:not(:first-child){ margin-top:4em}
.page_twrap2 .wrap_tit{ border-top:1px solid #111; padding:1em 0; box-sizing:border-box; width:16em; margin-right:5em}
.page_twrap2 .wrap_tit .t1{ font-weight:700; font-size:1.375em}
.page_twrap2 .wrap_con{ flex:1 1 0%; min-width:0; padding:1.25em 0; box-sizing:border-box}

.fin_box{ border-radius:.5em; border:1px solid #ddd; padding:3em}
.fin_box .tit{ font-size:1.75em; font-weight:500; margin-bottom:1em; color:#111; text-align:center}
.fin_box .tit.s1{ font-size:1.375em}
.fin_box .tt1{ line-height:1.5; font-size:1.063em; color:#666; text-align:center}
.fin_box .fs:not(:last-child):after{ content:","}
.fin_box.bg1{ background:#f5f5f5; border:none}

.flex_table.rental {gap: 1em; border-top: none;}
.flex_table.rental > li {flex: 1 49%;  border-radius: 1em; box-shadow: 0 0 1em rgba(0,0,0,.1);}
.flex_table.rental > li .wrap_in { border-bottom: none; padding: 2em;}
.flex_table > li .wrap_in .cell .tt2 {font-size: 1.05em; font-weight: 500;}

.board_search_detail{ position:relative}
.board_search_detail .wrap_tit{ position:absolute; left:2em; top:0; padding:0 .75em; background:#fff; transform:translateY(-50%)}
.board_search_detail .wrap_tit .t1{ font-weight:700; font-size:1.313em; color:#0060ae}
.board_search_detail .wrap_con{ border:1px solid #0060ae; padding:1.25em 2em; border-radius:.5em}
.board_search_detail .wrap_con .list{ display:flex; flex-wrap:wrap; gap:0 4em}
.board_search_detail .wrap_con .list > li{ width:100%}
.board_search_detail .wrap_con .list > li .in{ display:flex; padding:.75em 0; min-height:2em}
.board_search_detail .wrap_con .list > li .in.vc{ align-items:center}
.board_search_detail .wrap_con .list > li:not(:first-child){ border-top:1px solid #ddd}
.board_search_detail .wrap_con .list > li.st1{ border-top:none}
.board_search_detail .wrap_con .list > li.st1 .in{ padding-top:0}
.board_search_detail .wrap_con .list > li .in .tit{ width:9em; position:relative; display:flex; align-items:center; box-sizing:border-box}
.board_search_detail .wrap_con .list > li .in .tit.st2 { width:11em;}
.board_search_detail .wrap_con .list > li .in .tit.p1{ padding-left:1em}
.board_search_detail .wrap_con .list > li .in .tit .t1{ font-weight:500; font-size:1.125em}
.board_search_detail .wrap_con .list > li .in .tit .t2{ font-weight:500}
.board_search_detail .wrap_con .list > li .in .tit .ico{ font-size:1em; width:1.5em; text-align:center}
.board_search_detail .wrap_con .list > li .in .con{ flex:1 1 0%; min-width:0; padding:.125em 0}
.board_search_detail .wrap_con .list > li .in .con .t1{ font-size:1.063em}
.board_search_detail .wrap_con .list > li.w1{ width:calc(50% - 2em)}
.board_search_detail.st1 .wrap_con .list > li{ border-bottom:none}
.board_search_detail.st1 .wrap_con .list > li .in{ padding:.375em 0}

.label_st{ display:inline-flex; align-items:center; min-height:1em; gap:0 .25em; cursor:pointer; line-height:1; box-sizing:border-box}
.label_st input{zoom: 1.5; margin-bottom:auto; cursor:pointer}
.label_st input:checked{accent-color:#0060ae}
.label_st input:checked ~ .tt{color:#0060ae}