@charset "utf-8";
@import url('https://cdn.jsdelivr.net/npm/xeicon@2.3.3/xeicon.min.css');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&family=Roboto:wght@300;400;500;700;900&display=swap');
@import url('aos.css');
@import url('slick.css');
@import url('fonts.css');
@import url('swiper.min.css');

/**************************************************************************************************************
	공통
**************************************************************************************************************/
.m0 { margin:0  !important }
.mb0 { margin-bottom:0 !important }
.mb2 { margin-bottom:2px !important }
.mb4 { margin-bottom:4px !important }
.mb5 { margin-bottom:5px !important }
.mb6 { margin-bottom:6px !important }
.mb10 { margin-bottom:10px !important }
.mb15 { margin-bottom:15px !important }
.mb20 { margin-bottom:20px !important }
.mb25 { margin-bottom:25px !important }
.mb30 { margin-bottom:30px !important }
.mb35 { margin-bottom:35px !important }
.mb40 { margin-bottom:40px !important }
.mb45 { margin-bottom:45px !important }
.mb50 { margin-bottom:50px !important }
.mb55 { margin-bottom:55px !important }
.mb60 { margin-bottom:60px !important }
.mb70 { margin-bottom:70px !important }
.mb80 { margin-bottom:80px !important }
.mb90 { margin-bottom:90px !important }
.mb110 { margin-bottom:110px !important }
.mr10 { margin-right:10px !important;}
.mr20 { margin-right:20px !important;}
.mr30 { margin-right:30px !important;}
.mr40 { margin-right:40px !important;}
.mr50 { margin-right:50px !important;}
.ml5 { margin-left:5px !important }
.ml10 { margin-left:10px !important }
.ml20 { margin-left:20px !important }
.pd0 { padding:0 !important }
.pdb10 { padding-bottom:30px !important }
.pd30 { padding:30px !important }
.pd10 { padding:10px !important }
.pdt50 { padding-top:30px !important; }
.pr20 { padding-right:20px; }
.text-center { text-align:center !important }
.text-left { text-align:left !important }
.text-right { text-align:right !important }
.f12 { font-size:12px !important;  }
.f13 { font-size:13px !important;  }
.f14 { font-size:14px !important; }
.f34 { font-size:34px !important;  }
.f16 { font-size:16px !important;  }
.f17 { font-size:17px !important;  }
.f18 { font-size:18px !important;  }
.f19 { font-size:19px !important;  }
.f20 { font-size:20px !important;  }
.f24 { font-size:24px !important;  }
.f25 { font-size:25px !important;  }
.f29 { font-size:29px !important;  }
.f31 { font-size:31px !important;  }
.bold { font-weight: 600 !important; }

/*
	font-family: 'Nanum Gothic', sans-serif;
	font-family: 'Noto Sans', sans-serif;
*/

/***********************************************************************************
	Common
************************************************************************************/

html,body,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,big,cite,code,del,dfn,em,font,img,ins,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,ul,ol,li,dl,dt,dd,table,caption,tbody,tfoot,thead,tr,th,td,fieldset,fo7m,label,legend,input,button,textarea,select{margin:0;padding:0}
header,footer,section,article,aside,nav,hgroup,details,menu,figure,figcaption{display:block;margin:0;padding:0}
legend{display:block;overflow:hidden;position:absolute;width:1px;height:1px;font-size:1px;line-height:0;text-indent:-999em;white-space:nowrap; }
fieldset,img,table,caption,tbody,tfoot,thead,tr,th,td,button,hr{border:0 none}
img{vertical-align:middle}
body li{*vertical-align:top}
ul li{list-style:none; padding:0; margin:0;}
table{border-collapse:collapse}
caption{visibility:hidden;overflow:hidden;width:0;height:0;font-size:0;line-height:0;}
button{overflow:visible;border:0 none;cursor:pointer; outline:none; }
button::-moz-focus-inner,input[type="button"]::-moz-focus-inner,input[type="submit"]::-moz-focus-inner,input[type="reset"]::-moz-focus-inner {padding: 0;border: 0 none}
a { text-decoration:none; color:#000;  }
address, em { font-style:normal }
body,input,select,textarea,button,h1,h2,h3,h4,h5,h6 { font-family:'Noto Sans KR', sans-serif; font-size:13px; color: #000;}
body,textarea,input,select { font-family:'Noto Sans KR', sans-serif; font-size:13px; color: #000; text-decoration: none; }
textarea,.inp,select { border:0; outline:none; border-radius:0; resize:none; box-shadow:none; -webkit-appearance:none; appearance:none; font-weight: normal;}
a:hover { text-decoration: none;}
body { -webkit-text-size-adjust: none; background:none; }
form { padding: 0; margin: 0; }
* {box-sizing: border-box; -webkit-box-sizing:border-box;}
::-ms-clear { display: none;}
select::-ms-expand { display:none; }
a,a:active,a:visited { text-decoration:none !important; }
p,div { word-break:keep-all; }
img { max-width:100%; }

::-webkit-input-placeholder { color: #999;}


body.overflow { overflow: hidden; }
.hidden { overflow:hidden; }
.modal-backdrop {position: fixed; top:0; right:0; bottom:0; left:0; background:#000; z-index:7500; opacity:.7; filter:alpha(opacity=70);}
.modal {display:none; position:fixed; top:0; right:0; bottom:0; left:0; z-index:8000; overflow:auto; -webkit-overflow-scrolling:touch; outline:0; }
.modal-dialog {position:relative; width:auto;margin:0 auto;  padding:0 20px; margin-bottom: 20px;  }
.modal-content {position:relative; background-color:#fff; outline:none;  overflow:hidden; padding:0; }
.modal-header { height:50px; padding-left: 10px; position: relative; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; }
.modal-header h4 { font-size:24px; font-weight: 600; line-height: 50px;   }
.modal-header .btn-close {  width:50px; height: 50px; background: url(../img/common/ico_modal_close.png) no-repeat 50% 50%; text-indent: -9999px; outline:none;}
.modal-body { padding:20px; }
.modal-btns { text-align: center; margin-bottom: 40px; }
.modal-btns button { margin:0 3px; }

.modal-txt1  { text-align: center; font-size:16px; font-weight: 300; margin-bottom: 25px; }
.cart-msg { padding:15px; text-align: center; }
.cart-msg .txt { font-size:16px; line-height: 1.6; font-weight: 300; display: inline-flex; align-items: center; text-align: left; }
.cart-msg .txt:before { content: ''; display: inline-block; vertical-align: middle;  width:82px; height: 82px;  background: #ccc url(../img/common/ico_alert.png) no-repeat 50% 50%;  border-radius:100%;  margin-right:15px; }
.modal-files { }
.modal-files ul { display: flex; flex-wrap: wrap; margin:0 -6px; }
.modal-files ul li { width:calc(25% - 12px); margin:12px 6px 0;position: relative; }
.modal-files ul li .btn-del { position: absolute; right:0;top:0; width:20px; height: 20px; border: 1px solid #e5e5e5; background: #fff; font-size:14px; color: #ec706f; }


.inner { max-width:1360px; margin: 0 auto; padding:0 20px; }

/***************************************************************************************************************************************************************************
	Common
***************************************************************************************************************************************************************************/
.header1 { height: 80px; position: fixed;left: 0; top:0; right:0; background: #fff; z-index:1200; border-bottom: 2px solid #5cb5cd; }
.header1.fixed { box-shadow:0 5px 10px rgba(0,0,0,0.1);}
.header1 .inner { max-width:inherit; padding:0 50px; position: relative; display: flex; align-items: center;  }
.header1 h1 { margin-right:10px; } 
.header1 h1 a { display: block; background: url(../img/common/logo.png) no-repeat 0 50%; width:208px; height:80px; text-indent: -9999px; }
.header1 nav > ul:after { display: block; content: ''; clear: both; }
.header1 nav > ul > li { float:left; position: relative; }
.header1 nav .btn-dep1 { display: block; font-size:20px; height: 80px; line-height: 80px; padding:0 35px;  overflow: hidden; position: relative;}
.header1 nav .btn-dep1:after { content: ''; position: absolute;left: 50%; bottom:-7px; width:26px; height: 12px; transform: translateX(-50%); border-radius:13px 13px 0 0; background: #5cb5cd; transition: all 0.3s ease; opacity:0; }
.header1 nav > ul > li:hover .btn-dep1:after { opacity:1; bottom:0;  }

/* active 클래스 추가 LHH 2022-03-11 */
.header1 nav > ul > li.active .btn-dep1:after { content: '11'; position: absolute;left: 50%; bottom:0px; width:26px; height: 12px; border-radius:13px 13px 0 0; background: #5cb5cd; opacity:100;}

.header1 nav > ul > li:nth-child(4) .dep2 { left: -20px; right:-20px; }
.header1 nav .dep2 { display: none; position: absolute;left: 0; right:0; top:78px; }
.header1 nav .dep2 ul { border: 1px solid #5cb5cd; border-top-width:2px; padding-bottom: 8px; border-radius:0 0 15px 15px ; background: #fff;  }
.header1 nav .btn-dep2 { display: block; font-size:16px; line-height: 38px; text-align: center; position: relative; transition: all 0.3s ease;}
.header1 nav .btn-dep2:hover { background: #5cb5cd;  color: #fff; }
.header1 .etc { position: absolute; right:50px; top:50%; display: flex; align-items: center; transform: translateY(-50%);}
.header1 .etc .btns a{  display: inline-block; vertical-align: middle; font-size:16px; }
.header1 .etc .btns a + a { padding-left: 18px; margin-left: 16px; position: relative;}
.header1 .etc .btns a + a:before { content: ''; position: absolute;left: 0; top:50%; width:1px; background: #b4b4b4; height: 14px; margin-top:-7px; }
.header1 .etc .btns a em { display: inline-block; vertical-align: middle; min-width:12px; height: 20px; border-radius:10px; padding:0 5px; background: #e0331f; text-align: center; line-height: 20px; font-size:12px; color: #fff; font-family: 'Roboto'; }
.header1 .etc .search { width:180px;  position: relative; margin-left: 18px; }
.header1 .etc .search .inp-srch { width:100%; padding:0 50px 0 20px; font-size:16px;border: 1px solid #e5e5e5;  height: 40px; outline:none; background:none; transition: all 0.5s ease; border-radius:40px;  }
.header1 .etc .search .inp-srch:focus { border-color:#5cb5cd; }
.header1 .etc .search .btn-search { position: absolute; right:3px; top:3px; width:34px; height: 34px; background: #5cb5cd; font-size:20px; color: #fff; border-radius:100%;}
.header1 .btn-m { display: none; position: absolute;left: 0; top:0; width:50px; height: 50px; font-size:30px; background: none;  }
.header1 .btn-srch { display: none; position: absolute;right: 0; top:0; width:50px; height: 50px; font-size:28px; background: none;  }

.top-sns {margin-left:23px; font-family:"Roboto",sans-serif; width:80px;}
.top-sns .tt {padding:0 9px; font-size:12px; line-height:24px; border:1px solid #999; transition:none;}
.top-sns .tt:after { content: ''; position: absolute; right:0; top:0; width:25px; height: 100%;  background:url("../img/common/bu_select_lang.png") 50% 50% no-repeat; transition: all 0.3s ease; }
.top-sns ul {width:100%; border:1px solid #999; border-top:0; margin-top:-1px; padding:4px 0; background:#fff;}
.top-sns ul li a {padding:0 9px; color:#666; font-size:12px; line-height:20px;}
.top-sns ul li a:hover {color:#000;}
.top-sns .dropdown.active .tt:after { transform:rotate(180deg);}
.dropdown {position:relative;}
.dropdown a {display:block;}
.dropdown ul {display:none; position:absolute;}

body { padding-top:80px; }

.m-gnb{  position: fixed;left: -100%; top:0; bottom:0; width:80%; background: #fff; z-index:6000; opacity:0; transition: all 0.5s ease; }
.m-gnb .head1 { height: 50px; background: #2b9ab8; display: flex; justify-content: space-between; padding-right:15px;}
.m-gnb .head1 .left {display: flex; align-items: center; }
.m-gnb .head1 .btn-close { width:50px; height: 50px; font-size:30px; background: none; color: #fff; }
.m-gnb .head1 .left span { font-size:17px; font-family: 'Roboto'; color: #fff;  }
.m-gnb .head1 .sns { display: flex; align-items: center; }
.m-gnb .head1 .sns a { display: inline-block; vertical-align: middle; width:28px; height: 28px; border-radius:5px; background: #1f4f80 url(../img/common/ico_insta.png) no-repeat 50% 50%; background-size:15px auto; margin-left: 4px; }
.m-gnb .head1 .sns a.btn-youtube { background-image: url(../img/common/ico_youtube.png); }
.m-gnb .head2 { padding:10px 15px; display: flex; background: #138aaa;  }
.m-gnb .head2 a { flex: 1; margin:0 5px; height: 30px; line-height: 28px; border: 1px solid #e5e5e5; font-size:12px; text-align: center; color: #fff; }
.m-gnb nav > ul > li { border-bottom: 1px solid #e5e5e5; }
.m-gnb nav .btn-dep1 { display: block; height: 45px; font-size:15px; font-weight: 600; padding-left: 15px; line-height: 44px; background: #f8f8f8; position: relative; }
.m-gnb nav .btn-dep1.flip:before { content: ''; position: absolute; right:20px; top:14px; width:8px; height: 8px; border-left: 2px solid #222; border-bottom: 2px solid #222; transform: rotate(-45deg); transition: all 0.5s ease; }
.m-gnb nav > ul > li.active .btn-dep1.flip:before { transform: rotate(135deg); top:18px; }
.m-gnb nav .btn-dep2 { display: block; height: 40px; font-size:13px; font-weight: 400; padding-left: 15px; line-height: 40px; }
.m-gnb nav .dep2 { display: none; }
.m-gnb nav .dep2 li { border-top:1px solid #e5e5e5; }
.m-gnb .cs { padding:15px; border-bottom: 1px solid #e5e5e5;  }
.m-gnb .cs a { display: block; height: 50px; line-height: 49px; background: #666666; font-size:15px; text-align: center; color: #fff; }
.m-gnb .cs a:before { content: ''; display: inline-block; vertical-align: middle; background: url(../img/common/ico_phone.png) no-repeat 0 0; width:22px; height: 22px; background-size:22px auto; margin:-4px 4px 0 0;}
.bg-m { display: none; position: fixed;left: 0; top:0; right:0; bottom:0; background: rgba(0,0,0,0.7); z-index:5000;}

body.menu-on { overflow: hidden; }
body.menu-on .m-gnb { left: 0; opacity:1;  }

.m-search { display: none; position: fixed;left: 0; top:0; right:0; bottom:0; /*background: #fff;*/ z-index:5000; overflow: auto; }
.m-search .head form { height: 50px; padding: 15px 5px 15px 15px; display: flex; justify-content: space-between; align-items: center; background: #2b9ab8;  }
.m-search .head .inp-box { flex: 1; position: relative;}
.m-search .head .inp-box .inp-srch { width:100%; height: 30px; background: #fff;  border: 0;  outline:none;  padding:0 40px 0 10px; font-size:13px; } 
.m-search .head .inp-box .btn-del { position: absolute; right:0; top:0; width:30px; height: 30px; background: url(../img/common/ico_m_srch_del.png) no-repeat 50% 50%; background-size:14px auto;}
.m-search .head .btn-srch { font-size:25px; color: #fff; background: none; padding:0 5px 0 10px;  }
.m-search .head .btn-close { font-size:25px; color: #fff; background: none; padding:0 5px;  }
.m-search .tabs { overflow: hidden; border-bottom: 1px solid #e5e5e5;  }
.m-search .tabs a { float:left; width:50%; height: 40px; line-height: 38px; font-size:13px; text-align: center; position: relative; transition: all 0.3s ease; }
.m-search .tabs a.active:before { content: ''; position: absolute;left: 0; right:0;bottom:0; height: 2px; background: #999999; }
.m-search .tabs a.active { font-weight: 600; }
.m-search ul li { padding:0 104px 0 20px; position: relative; border-bottom: 1px solid #e5e5e5;  font-size:12px; line-height: 40px;  }
.m-search ul li a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.m-search ul li span { position: absolute; right:40px; top:0; }
.m-search ul li .btn-del { position: absolute; right:0; top:0; font-size:17px; color: #ccc; height: 40px; width:40px; background: none;  }

/***************************************************************************************************************************************************************************
	Main
***************************************************************************************************************************************************************************/
.main-wrap h2 { font-size:45px; font-weight: 700; margin-bottom: 40px; line-height: 1.2; text-align: center; }

.main1 { position: relative; margin-bottom: 75px;  }
.main1 .inner {  display: flex; justify-content: center;flex-direction: column; padding:108px 90px ;  color: #fff;  }
.main1 .t1 { font-size:34px; font-weight: 200;  }
.main1 .t2 { font-size:64px; font-weight: 700; line-height: 1.2; margin-bottom: 30px; letter-spacing: -2px; }
.main1 .t3 { font-size:20px; font-weight: 200; margin-bottom: 45px; }

.main1 .swiper-slide-active .t1 { opacity:0; animation:textOn 0.5s cubic-bezier(.5, 0, .5, 1) both; }
.main1 .swiper-slide-active .t2 { opacity:0; animation:textOn 0.6s cubic-bezier(.5, 0, .5, 1) both; animation-delay: 0.2s; }
.main1 .swiper-slide-active .t3 { opacity:0; animation:textOn 0.7s cubic-bezier(.5, 0, .5, 1) both; animation-delay: 0.4s; }
.main1 .swiper-slide-active .btns { opacity:0; animation:textOn 0.8s cubic-bezier(.5, 0, .5, 1) both; animation-delay: 0.5s; }
@keyframes textOn {
	from { transform: translateY(20px);}
	to {opacity:1.0; transform: translateY(0px);}
}


.main1 .btns a { display: inline-block; vertical-align: middle; padding:0 20px 0 28px; height: 55px; line-height: 55px; background: rgba(0,0,0,0.5); font-size:18px; color: #fff;  transition: all 0.3s ease;}
.main1 .btns a i { margin-left: 40px;font-weight: 600; transition: all 0.3s ease;}
.main1 .btns a:hover { background: #fff; color: #222; }
.main1 .btns a:hover i { transform: translateX(5px); }
.main1 .swiper-slide { height: 600px; background: url(../img/main/main1.jpg) no-repeat 50% 50%;  background-size:cover; }
.main1 .slide2 { background-image: url(../img/main/main2.jpg); }
.main1 .slide3 { background-image: url(../img/main/main3.jpg); }
.main1 .slide2 p { display: inline-block; vertical-align: middle; }
.main1 .slide2 .t1 p { background: #1e89dc; }
.main1 .slide2 .t2 p { background: #cd627c; line-height: 1; }
.main1 .slide2 .t3 {  font-size:0;  }
.main1 .slide2 .t3 p { background: #1f8de0; font-size:20px; line-height: 1.5;  }
.main1 .slide3 .inner { color: #000; }
.main1 .swiper-button-next, 
.main1 .swiper-button-prev { background: url(../img/main/btn_slider1.png) no-repeat 0 0; width:40px; height: 63px; margin-top:-30px; top:50%; left: 40px;  }
.main1 .swiper-button-next { transform: scaleX(-1); left: inherit; right:40px;}
.main1 .swiper-pagination { left: 0; right:0; bottom:15px; text-align: center; }
.main1 .swiper-pagination-bullet { width:10px; height: 10px; background: rgba(255,255,255,0.5); opacity:1; margin:0 3px; transition: all 0.3s ease; border-radius:10px;  }
.main1 .swiper-pagination-bullet-active { width:30px; background: #fff; }

.main2 { margin-bottom: 70px; }
.main2 .box1 ul { display: flex; justify-content: space-between;  margin:0 -20px 20px; }
.main2 .box1 ul li { flex: 1;  padding:0 20px 20px; }
.main2 .box1 ul li a { display: block; padding: 33px 15px; text-align: center; border: 1px solid #e5e5e5; transition: all 0.3s ease; }
.main2 .box1 ul li a strong { display: block; padding-top:15px; font-size:20px; font-weight: 400; }
.main2 .box1 ul li a:hover { transform: translateY(-5px); border-color:#5cb5cd; box-shadow:10px 10px 20px rgba(0,0,0,0.1); }
.main2 .box2 {display: flex; justify-content: space-between; }
.main2 .box2 .latest { width:calc(50% - 20px); height: 80px; border: 1px solid #e5e5e5; padding-left: 150px; position: relative; overflow: hidden; }
.main2 .box2 .latest h3 { position: absolute;left:  20px; top:0; line-height: 80px; font-size:22px; font-weight: 700; }
.main2 .box2 .latest h3:before { content: ''; display: inline-block; vertical-align: middle; width:28px; height: 28px; border-radius:100%; border: 8px solid #5cb5cd; margin:-5px 10px 0 0; box-sizing: border-box; }
.main2 .box2 .latest .swiper-slide a { display: block; height: 79px; line-height: 79px; font-size:18px; }
.main2 .box2 .latest:nth-child(2) { padding-left:230px; }
.main2 .swiper-button-prev { position: absolute; right:18px; left: inherit; top:11px; bottom:inherit; width:27px; height: 27px; font-size:30px; color: #999999; background: none; margin: 0;  }
.main2 .swiper-button-next { position: absolute; right:18px; bottom:11px; width:27px; height: 27px; font-size:30px; color: #999999; background: none; margin: 0;  }
.main2 .swiper-button-next i,
.main2 .swiper-button-prev i { vertical-align: top; }

.main3 { padding: 140px 0 130px; background: url(../img/main/bg1.jpg) no-repeat 50% 50%; background-size:cover; margin-bottom: 100px;  text-align: center; color: #fff;  }
.main3 .t1 { font-size:34px; font-weight: 200; margin-bottom: 10px;  }
.main3 .t2 { font-size:64px; font-weight: 700; line-height: 1.2; }

.btn-more {display:inline-block; position:relative; height:52px; padding:0 25px 0 30px; font-size:18px; font-weight:300; color: #666666; line-height:50px; background:#fff; border:1px solid #e5e5e5; border-radius:50px;  transition: all 0.3s ease; text-align: left; }
.btn-more i {vertical-align: middle; margin:-2px 0 0 75px; font-size:20px; color: #cccccc; font-weight: 700; }
.btn-more:hover { background-color: #666; color: #fff; border-color:#666; }

.sort-tabs { text-align: center; margin-bottom: 30px; }
.sort-tabs a { display: inline-block; vertical-align: middle; font-size:18px; padding:0 37px; position: relative;}
.sort-tabs a:before {content: ''; position: absolute; left: 0; top:50%; margin-top:-7px; width:1px; height: 14px; background: #999; }
.sort-tabs a:first-child:before { display: none; }
.sort-tabs a.active { font-weight: 600; }

.product-list ul { display: flex; flex-wrap: wrap; margin:0 -20px;  }
.product-list ul li { width:25%; padding:0 20px 40px; }
.product-list ul li a { display: block; text-align: center; }
.product-list ul li a .img { margin-bottom: 13px; border: 1px solid #e5e5e5; position: relative;transition: all 0.3s ease;  }
.product-list ul li a .img img { width:100%; }
.product-list ul li a .img .label  {position: absolute;left: 13px; top:-1px; background: url(../img/common/label_3d.png) no-repeat 0 0; width:60px; height: 72px; text-indent: -9999px; text-align: left; }
.product-list ul li a .subj { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:24px; line-height: 1.3;  font-weight: 600; margin-bottom: 7px; }
.product-list ul li a .desc{ font-size:16px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:16px; color: #666; font-weight: 300; margin-bottom: 15px;  }
.product-list ul li a .img:hover { border-color:#222; box-shadow:5px 5px 15px rgba(0,0,0,0.1);  }
.product-list ul li .btns { text-align: center; }
.product-list ul li .btns button { width:27px; height: 27px; border: 0; outline:none; margin:0 5px; background: none;  background-repeat: no-repeat; background-position: 50% 50%; }
.product-list ul li .btns .btn-like { background-image: url(../img/common/ico_heart_off.png);}
.product-list ul li .btns .btn-cart { background-image: url(../img/common/ico_cart_off.png); display:none;}
.product-list ul li .btns .btn-like.active { background-image: url(../img/common/ico_heart_on.png);}
.product-list ul li .btns .btn-cart.active { background-image: url(../img/common/ico_cart_on.png);}


.tabs1 { text-align: center; display: flex; align-items: center; }
.tabs1 a { display: inline-block; flex: 1; height: 60px; line-height: 58px; font-size:18px; border: 1px solid  #e5e5e5; transition: all 0.3s ease; }
.tabs1 a + a { margin-left: -1px; }
.tabs1 a.active { background: #336699; color: #fff; }

.tabs2 { text-align: center; display: flex; align-items: center; border: 1px solid #e5e5e5; margin:35px 0 30px;  }
.tabs2 p { padding:4px; flex: 1; }
.tabs2 p + p { border-left: 1px solid #e5e5e5; }
.tabs2 a { display: block; height: 50px; line-height: 50px; font-size:18px;  transition: all 0.3s ease; }
.tabs2 a.active { background: #5cb5cd; color: #fff; font-weight: 600; }

.footer-nav { background: #5cb5cd; margin-top:200px; }
.footer-nav .inner { position: relative;}
.footer-nav .menu a { display:inline-block; vertical-align: middle; font-size:18px; color: #fff; line-height: 60px; margin-right:45px; }
.footer-nav .btn-top { position: absolute; right:0; top:0; width:60px; height: 60px; text-align: center; background: none; color: #fff; }
.footer-nav .btn-top i { font-size:22px; font-weight: 600; }
.footer-nav .btn-top span { display: block; font-size:12px; font-family: 'Roboto'; }

.footer { padding: 25px 0 50px;  }
.footer .inner { padding-right:540px; position: relative; }
.footer .menu { margin-bottom: 16px; }
.footer .menu a { font-size:18px; }
.footer .menu a + a { margin-left: 40px; }
.footer .cs { position: absolute; right:0; top:0; }
.footer .cs span { font-size:24px; font-weight: 600; }
.footer .cs strong { font-size:40px; font-family: 'Roboto'; color: #5cb5cd; display: block; }
.footer .cs dl { display: flex; align-items: center; margin-top:14px; }
.footer .cs dl dt a { display: block; width:160px; height: 40px; line-height: 38px; text-align: center; font-size:16px; font-weight: 300; margin-right:12px; border: 1px solid #e5e5e5; }
.footer .cs dl dd  {font-size:14px; line-height: 1.47; font-weight: 200; margin-top:-2px; }
.footer .addr .logo { margin-bottom: 20px; }
.footer .addr { font-size:16px; line-height: 1.7; margin-bottom: 14px;  }
.footer .addr span { margin: 0 10px; color: #999999; font-weight: 200; }
.footer .copy { font-size:14px; font-weight: 300; }

/***************************************************************************************************************************************************************************
	About
***************************************************************************************************************************************************************************/
.container { padding-top:75px; }
.about .t1 { font-size:24px; line-height: 1.4; margin-bottom: 35px;  text-align: center; }
.about h4 { font-size:30px; font-weight: 600; margin-bottom: 10px; line-height: 1.4; text-align: center; }
.about .desc { text-align: center; font-size:18px; font-weight: 300; margin-bottom: 35px; }
.about .desc span { display: block; color: #ff3333; }

.about .box1 { margin-bottom: 100px; }
.about .box1 ul { display: flex; flex-wrap: wrap; justify-content: center; }
.about .box1 ul li { width:200px; margin:0 12px 20px; background: #f8f8f8; }
.about .box1 ul li .tit { padding:18px 20px;  font-size:22px; line-height: 1.2; color: #fff; font-weight: 500; height: 95px; background: #98d765; }
.about .box1 ul li .info { min-height: calc(100% - 95px); padding:20px; background: #f8f8f8; display: flex; flex-direction: column; justify-content: space-between; }
.about .box1 ul li .info .t2 { font-size:16px; line-height: 1.5; color: #000; font-weight: 300; margin-bottom: 20px; letter-spacing: -2px; }
.about .box1 ul li .info .t3 { font-size:16px; line-height: 1.5; color: #ff4d4d; font-weight: 300; letter-spacing: -2px; }
.about .box1 ul li:nth-child(1) .tit,
.about .box1 ul li:nth-child(2) .tit { background: #f8b600;}

.about .box4 .map { height: 700px; background: #f9f9f9; margin-bottom: 50px;  }
.about .box4 .ctt { display: flex; justify-content: space-between; padding:0 60px; }
.about .box4 .ctt .path { display: flex; align-items: center; margin-bottom: 80px; }
.about .box4 .ctt .path .ic { width:140px; height: 140px; border-radius:100%; display: flex; border: 1px solid #e5e5e5; flex-direction: column; align-items: center; justify-content: center; margin-right:25px;  }
.about .box4 .ctt .path .ic img { width:74px; }
.about .box4 .ctt .path dl dt { font-size:18px; font-weight: 600; margin-bottom: 8px; }
.about .box4 .ctt .path dl dd { color: #333; }
.about .box4 .ctt .path dl dd p { font-size:24px;margin-bottom: 4px;  }
.about .box4 .ctt .path dl dd small { font-size:16px; font-weight: 300;}
.about .box4 .ctt .path dl dd span { font-size:20px; }

.sub-tabs { border-bottom: 1px solid #e5e5e5; margin-top:-80px; margin-bottom: 75px; }
.sub-tabs .inner { display: flex; }
.sub-tabs .inner a { flex: 1; text-align: center; line-height:58px; height: 60px; font-size:18px; font-weight: 300; position: relative;}
.sub-tabs .inner a.active { font-weight: 600; }
.sub-tabs .inner a.active:before { content: ''; position: absolute;left: 0; right:0; bottom:-1px; height: 3px; background: #336699; }

.h3 { text-align: center; font-size:36px; font-weight: 700; padding-bottom: 20px;  border-bottom: 2px solid #ccc; }
.h3.border-none { border-bottom: 0; }
.h4 { text-align: center; font-size:30px; font-weight: 600; padding-bottom: 25px;   }
.h4-my { font-size:22px; font-weight: 600; padding-bottom: 12px; border-bottom: 2px solid #ccc; position:relative; }
.h4-my:before { content: ''; display: inline-block; vertical-align: middle; width:28px; height: 28px; border-radius:100%; border: 8px solid #5cb5cd; margin:-5px 10px 0 0; box-sizing: border-box; }
.h4-my .btn-type3 {position: absolute; right:0; bottom:10px; width:100px; height: 34px; line-height: 32px; font-size:16px; font-weight: 300; }
.board-list { margin-bottom: 20px; }
.board-list table { width:100%; border-collapse: collapse; }
.board-list table thead th { height: 60px; border-bottom: 1px solid #e5e5e5; background: #f7f7f7; font-size:16px; font-weight: 400; }
.board-list table tbody td { padding: 17px 5px; font-size:16px; font-weight: 300;text-align: center; border-bottom: 1px solid #e5e5e5;  }
.board-list table tbody td.show-subj { text-align: left; }

/* 상품상세 QNA */
.board-list table tbody tr { transition: all 0.5s ease;}
.board-list table tbody tr.active { background: #f8f8f8; }
.board-list table tbody td .qa { text-align: left; padding:15px 0; position: relative; }
.board-list table tbody td .qa .btns { position: absolute; right:15px; top:15px; }
.board-list table tbody td .qa .btns a { display: inline-block; vertical-align: middle; font-size:14px; font-weight: 300; color: #666; margin-left: 15px; padding-left: 15px; position: relative; }
.board-list table tbody td .qa .btns a:before { content: ''; position: absolute;left: 0; top:50%; width:1px; height: 12px; margin-top:-6px; background: #ccc; }
.board-list table tbody td .qa .btns a:first-child:before { display: none; }
.board-list table tbody td .qa > div { padding:16px 16px 16px 0; display: flex; background: #f8f8f8; margin-bottom: 6px; }
.board-list table tbody td .qa .t { width:85px; text-align: center; font-size:40px; font-family: 'Roboto'; font-weight: 700; }
.board-list table tbody td .qa  .txt { flex: 1; font-size:16px; line-height: 1.6; font-weight: 300; }
.board-list table tbody td .qa .q { padding-right:120px;}

.label-notice { display: inline-block; vertical-align: middle; width:80px; height: 34px; line-height: 33px; text-align: center; background: #000; font-size:16px; color: #fff; font-weight: 300; }
.label1 { display: inline-block; vertical-align: middle; width:80px; height: 24px; text-align: center; line-height: 23px; background: #45b35a; font-size:14px; font-weight: 300; color:#fff; margin-right:6px;  }
.label1.end { background: #b2b2b2; }

.label2 { display: inline-block; vertical-align: middle; width:100px; height: 36px; text-align: center; line-height: 35px; background: #f95f75; font-size:16px; font-weight: 300; color:#fff;  }

.label2.end { background: #45b35a; }
.label2.bg-blue { background: #5cb5cd; }
.label2.bg-green { background: #5cb196; }
.label2.bg-green2 { background: #45b35a; }
.label2.bg-pink { background: #c585b8; }
.label2.bg-red { background: #eb6464; }
.label2.bg-gray { background: #999; }

.label3 { display: inline-block; vertical-align: middle; width:80px; height: 24px; text-align: center; line-height: 23px; background: #f95f75; font-size:14px; font-weight: 300; color:#fff; margin-right:6px;  }
.label3.end { background: #90c10d; }
.label3.used { background: #b2b2b2; }
.label4 { display: inline-block; vertical-align: middle; width:100px; height: 36px; text-align: center; line-height: 35px; background: #fff; border: 1px solid #e5e5e5;   font-size:16px; font-weight: 300;  }
.label4.used { background: #b2b2b2; border-color:#b2b2b2; color: #fff; line-height: 33px;  }


.comment-box { margin:55px 0 25px; padding: 40px; border: 1px solid #e5e5e5;  }
.comment-box .tit { font-size:18px; margin-bottom: 12px;  }
.comment-box .tit small { font-size:14px; color: #666; font-family: 'Roboto';font-weight: 300; }
.comment-box .writes { display: flex; justify-content: space-between; } 
.comment-box .writes .textarea { width:100%; height: 140px; flex: 1;  }
.comment-box .writes .btn-submit { border: 1px solid #e5e5e5; font-size:18px; font-weight: 500; background: none; width:140px; margin-left: 10px; }
.comment-box .list { margin:45px 0 15px; }
.comment-box .list .article { border-bottom: 1px solid #e5e5e5; }
.comment-box .list .article  + .article .head { border-top:0; }
.comment-box .list .article .head { display: flex; justify-content: space-between;  align-items: center; border-top:1px solid #e5e5e5; padding: 8px 10px; }
.comment-box .list .article .head .name img { vertical-align: middle; margin:-3px 0 0 0;}
.comment-box .list .article .head .name strong { font-size:16px; font-weight: 300; }
.comment-box .list .article .head .name span { font-size:14px; font-weight: 300; color: #999999; font-family: 'Roboto'; margin-left: 5px;  }
.comment-box .list .article .head .btns a { display: inline-block; vertical-align: middle; font-size:14px; color: #999; padding-left: 10px; margin-left: 10px; position: relative;}
.comment-box .list .article .head .btns a:before { content: ''; position: absolute; left: 0; top:50%; width:1px; height: 12px; background: #ddd; margin-top:-5px; }
.comment-box .list .article .head .btns a:first-child:before { display: none; }
.comment-box .list .article .body { padding:15px 10px; font-size:16px; line-height: 1.7; font-weight: 300; border-top:1px solid #e5e5e5; }

.guide { }
.guide article { padding: 45px 20px 30px; background: #f3f3f3; display: flex; justify-content: center; }
.guide article .img { margin:0 60px; }
.guide article .info { padding-top:65px; }
.guide article .info .step { background: url(../img/sub/tit_step.png) no-repeat 0 0; width:84px; height: 37px; padding-left: 11px; font-size:16px; color: #fff; font-family: 'Roboto'; font-weight: 700; color: #fff; line-height: 36px; margin-bottom: 12px;  }
.guide article .info h5 { font-size:30px; font-weight: 600; margin-bottom: 10px; color: #333; }
.guide article .info p { font-size:20px; line-height: 1.5; font-weight: 300; }
.guide article.left { flex-direction: row-reverse; background: #f8f8f8;  }

.review-list {}
.review-list ul { display: flex; flex-wrap: wrap; margin:0 -20px; }
.review-list ul li { width:25%; padding:0 20px 40px; }
.review-list ul li a { display: block; border: 1px solid #e5e5e5; transition: all 0.3s ease; }
.review-list ul li a .img { border-bottom: 1px solid #e5e5e5; }
.review-list ul li a .img img { vertical-align: middle; width:100%;  }
.review-list ul li a .info { padding: 15px 20px;}
.review-list ul li a .info .grade-box { margin-bottom: 10px; }
.review-list ul li a .info .text { font-size:16px; font-weight: 300; line-height: 22px; height: 44px; overflow: hidden;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2;}
.review-list ul li a .info .prd { padding-top:15px; margin-top:15px; border-top:1px solid #e5e5e5; display: flex; align-items: center; }
.review-list ul li a .info .prd p { width:80px; height: 80px; border: 1px solid #e5e5e5; margin-right:8px; }
.review-list ul li a .info .prd div{  flex: 1;  font-size:18px; line-height: 24px; max-height: 48px; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2; }
.review-list ul li a:hover { border-color:#5cb5cd; box-shadow:10px 10px 15px rgba(0,0,0,0.1); }

.board-product { padding: 25px 20px; border-bottom: 1px solid #e5e5e5;  }
.board-product .box { display: flex; align-items: center; }
.board-product .box .img { width:100px; height: 100px; overflow: hidden; border: 1px solid #e5e5e5; }
.board-product .box .info { flex: 1; margin-left: 15px; }
.board-product .box .info .name { font-size:30px; font-weight: 600; margin-bottom: 5px; line-height: 1.2; }
.board-product .box .info .desc {font-size:18px; color: #666; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 300; }


.grade-box { display: flex; align-items: center; }
.grade { display: inline-block; vertical-align: middle; background: url(../img/sub/ico_star_off.png) no-repeat 0 0; width:100px; height: 16px; position: relative; }
.grade:before { content: ''; background: url(../img/sub/ico_star_on.png) no-repeat 0 0; position: absolute;left: 0; top:0; height: 16px; width:20%; }
.grade.grade1:before { width:20%;}
.grade.grade2:before { width:40%;}
.grade.grade3:before { width:60%;}
.grade.grade4:before { width:80%;}
.grade.grade5:before { width:100%;}
.grade-box strong { color: #ffcc00; font-size:18px; font-weight: 700; margin-left: 10px; }


.board-list table tbody td a span { color: #ff3300; }
.board-list table tbody td .subj .label-notice { display: none; }
.board-list table tbody td .subj { display: flex; align-items: center; }
.board-list table tbody td .subj img { margin:-5px 5px 0 5px; }
.board-list table tbody td .etc { display: none; }
.board-list .board-product { display: flex; align-items: center; padding: 0; border: 0; text-align: left; }
.board-list .board-product label { width:70px; text-align: center; }
.board-list .board-product .box { flex: 1; }
.board-list .board-product .box .img { width:90px; height: 90px; }
.board-list .board-product .box .info .name{ font-size:22px; font-weight: 400; }
.board-list .board-product .box .info .desc{ font-size:16px; }
.board-list.border-type table tbody td { border-left: 1px solid #e5e5e5; }
.board-list.border-type table tbody td:first-child { border-left: 0; }

.board-list2 { margin-bottom: 20px; }
.board-list2 ul li { border-bottom: 1px solid #e5e5e5; padding: 20px; }
.board-list2 ul li a { display: flex; justify-content: space-between; }
.board-list2 ul li a .img { width:200px; height: 200px; flex:0 0 200px; margin-right:20px;  }
.board-list2 ul li a .info { flex: 1; }
.board-list2 ul li a .info h4 { font-size:26px; font-weight: 600; margin:5px 0 7px; }
.board-list2 ul li a .info .txt{  font-size:16px; line-height: 1.5; margin-bottom: 15px; }
.board-list2 ul li a .info span { font-size:16px; font-weight: 300; position: relative; }
.board-list2 ul li a .info span + span { padding-left: 20px; margin-left: 20px; }
.board-list2 ul li a .info span + span:before { content: ''; position: absolute;left: 0; top:50%; width:1px; height: 16px; background: #999999; margin-top:-7px; }

.board-view { margin-bottom: 20px; }
.board-view .tit { display: flex; justify-content: space-between; background: #f8f8f8; border-bottom: 1px solid #e5e5e5; align-items: center; }
.board-view .tit h4 {padding: 14px 25px; font-size:22px; font-weight: 400; }
.board-view .tit .right { padding-right:10px; }
.board-view .btn-like { font-size:14px; font-weight: 300; color: #666; }
.board-view .btn-like i { vertical-align: middle; font-size:22px; color: #999; margin:-3px 6px 0 0;}
.board-view .etc { padding:14px 25px; display: flex; align-items: center; border-bottom: 1px solid #e5e5e5;  position: relative;}
.board-view .etc span { font-size:16px; font-weight: 300; position: relative; }
.board-view .etc span + span { padding-left: 20px; margin-left: 20px; }
.board-view .etc span + span:before { content: ''; position: absolute;left: 0; top:50%; width:1px; height: 16px; background: #999999; margin-top:-8px; }
.board-view .etc .label2 { position: absolute; right:10px; top:8px; }
.board-view .etc .file-box { position: absolute; right:20px; }
.board-view .etc .file-box img { margin:-5px 10px 0 0;}
.board-view > .file-box  { padding:10px 15px; display: flex; align-items: center; border-bottom: 1px solid #e5e5e5;  position: relative;}
.board-view .file-box.mobile { display: none; }
.board-view .view { font-size:16px; line-height: 1.6; }
.board-view .file { border-top:1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; display:flex; align-items: center; }
.board-view .file .t { font-size:16px; padding:20px 0; text-align: center; background: #f8f8f8; width:190px; }
.board-view .file .list { flex: 1; }
.board-view .file .list dl { display: flex; justify-content: space-between; align-items: center; padding:0 20px; }
.board-view .file .list dl + dl { margin-top:8px; }
.board-view .file .list dl dt { font-size:16px; font-weight: 300; }
.board-view .file .list dl dd .btn-type2 { }
.board-view .files { padding: 14px 25px; font-size:22px; }
.board-view .view4 { padding:50px 20px 80px;  border-bottom: 1px solid #e5e5e5;}
.board-view .view4 .box { display: flex; justify-content: space-between;  }
.board-view .view4 .slider { width:49%; position: relative; }
.board-view .view4 .slider .swiper-slide img { width:100%; }
.board-view .view4 .slider .swiper-pagination { position: static;left: 0; right:0; bottom:20px; text-align: center; padding-top:20px;  }
.board-view .view4 .slider .swiper-pagination-bullet {margin:0 4px; width:10px; height:10px; background:#000; opacity:.2; border-radius:10px; transition: all 0.3s ease;}
.board-view .view4 .slider .swiper-pagination-bullet-active {width:30px !important; opacity:.5;}
.board-view .qna { border-bottom: 1px solid #e5e5e5;}
.board-view .qna .q { padding: 40px 85px; position: relative; }
.board-view .qna .q .anw { position: absolute;left: 32px; top:40px; font-size:30px; font-family: 'Roboto'; font-weight: 700; }
.board-view .qna .q .txt { font-size:16px; font-weight: 300; line-height: 1.6; }
.board-view .qna .q + .q { background: #f7f7f7; border-top:1px solid #e5e5e5;}

.board-view .view4 .text { width:49%; font-size:17px; line-height: 1.7;  }
.board-view .reser { text-align: center; margin-top:40px;  }
.board-view .reser a { display: inline-block; vertical-align: middle; width:300px; height: 55px; line-height: 54px; background: #00943b; font-size:18px; color: #fff; }

.board-view .view3 { border-bottom: 1px solid #e5e5e5;}
.board-view .view3 .poster { text-align: center; padding:70px 20px; }
.board-view .view3 .table2 {margin-top:-1px;}
.board-view .view3 .table2 table tbody td { height: 60px; padding:8px 10px;}
.table2 .list { flex: 1; }
.table2 .list dl { display: flex; justify-content: space-between; align-items: center;  }
.table2 .list dl + dl { margin-top:8px; }
.table2 .list dl dt { font-size:16px; font-weight: 300; }
.table2 .list dl dd .btn-type2 { }


.btn-type1 { display: inline-block; vertical-align: middle; width:140px; height: 45px; line-height: 43px; border: 1px solid #666666; background: #666666; font-size:16px; color: #fff; text-align: center; }
.btn-type2 { display: inline-block; vertical-align: middle; width:140px; height: 45px; line-height: 43px; border: 1px solid #999999; background: #999999; font-size:16px; color: #fff; text-align: center; }
.btn-type3 { display: inline-block; vertical-align: middle; width:140px; height: 45px; line-height: 43px; border: 1px solid #e5e5e5; background: #fff; font-size:16px; text-align: center; }
.btn-type4 { display: inline-block; vertical-align: middle; width:140px; height: 45px; line-height: 43px; border: 1px solid #5cb5cd; background: #5cb5cd; font-size:16px; color: #fff; text-align: center; }
.btn-s { height: 40px; line-height: 38px;}
.btn-m { height: 50px; line-height: 48px; font-size:18px; }
.btn-l { height: 55px; line-height: 53px; font-size:18px; }

.red {color: #ff586b; }
.checkbox { position: absolute;left: -9999px; }
.checkbox + p { display: inline-block; }
.checkbox + p em { display: inline-block; vertical-align: middle; width:16px; height: 16px; background: #fff; border: 1px solid #e5e5e5; position: relative;}
.checkbox + p em:before { content: ''; position: absolute;left: 3px; top:3px; right:3px; bottom:3px; background: #717171; opacity:0; transform: scale(0.4); transition: all 0.5s ease;}
.checkbox + p span { display: inline-block; vertical-align: middle; font-size:16px; margin-left: 6px;   }
.checkbox + p span b { font-weight: 400; }
.checkbox:checked + p em:before { opacity:1; transform: scale(1); }

.radio { position: absolute;left: -9999px; }
.radio + div { display: inline-block; }
.radio + div em { display: inline-block; vertical-align: middle; width:16px; height: 16px; background: #fff; border: 1px solid #e5e5e5; position: relative; border-radius:100%; }
.radio + div em:before { content: ''; position: absolute;left: 2px; top:2px; right:2px; bottom:2px; background: #999; opacity:0; transform: scale(0.4); transition: all 0.5s ease; border-radius:100%;}
.radio + div span { display: inline-block; vertical-align: middle; font-size:16px; margin-left: 6px;  }
.radio + div span b { font-weight: 400; }
.radio + div .grade { margin:-2px 0 0 6px; }
.radio:checked + div em:before { opacity:1; transform: scale(1); }

.board-btns2 { display: flex; justify-content: space-between; }
.board-btns { }
.board-btns .right { text-align: right; }

.select { display: inline-block; vertical-align: middle; height: 40px; padding:0 30px 0 10px; text-align: left; font-size:16px; color: #333; background: #fff url(../img/common/bu_select.png) no-repeat right 50%; background-position: right 10px center; border: 1px solid #e5e5e5; }
.inp { display: inline-block; vertical-align: middle; height: 40px; padding-left: 10px; font-size:16px; color: #333; background: #fff;  border: 1px solid #e5e5e5;}
.textarea { width:100%; /*height: 270px;*/ padding: 10px; font-size:16px; color: #333; background: #fff;  border: 1px solid #e5e5e5;}
.search-box { padding: 40px 20px; background: #f8f8f8; border: 1px solid #e5e5e5; text-align: center; }
.search-box .select { width:140px; }
.search-box .inp { width:300px; }

.pagenate { text-align: center; margin: 30px 0 60px; font-size:0;}
.pagenate a { display: inline-block; vertical-align: middle; width:28px; height: 28px; line-height: 26px; font-size:16px; color: #333; font-family: 'Roboto'; margin:0 3px; }
.pagenate a.first,
.pagenate a.prev,
.pagenate a.next,
.pagenate a.last { border:1px solid #f2f2f2; background: url(../img/common/ico_page_prev.png) no-repeat 50% 50%;  }
.pagenate a.first,
.pagenate a.last { background-image: url(../img/common/ico_page_first.png);}
.pagenate a.next { transform: scaleX(-1);}
.pagenate a.last { transform: scaleX(-1);}
.pagenate a.active { text-decoration: underline !important; }

.member-wrap { padding: 150px 0 100px; }
.member-wrap .login-box { max-width:720px; margin: 0 auto; padding:75px 110px; background: #f8f8f8; border-radius:35px; }
.member-wrap .login-box h3 { text-align: center; font-size:37px; font-weight: 600; }
.member-wrap .login-box .desc { font-size:16px; margin-bottom: 40px; text-align: center; }
.member-wrap .login-box .inp-box { margin-bottom: 10px; }
.member-wrap .login-box .inp-member { width:100%; height: 60px; border: 1px solid #e5e5e5; padding-left: 20px; font-size:16px; font-weight: 300; transition: all 0.3s ease; outline:none;  }
.member-wrap .login-box .inp-member:focus { border-color:#5cb5cd; }
.member-wrap .login-box .btn-login { width:100%; height: 80px; background: #5cb5cd; font-size:24px; color: #fff; border: 0; }
.member-wrap .login-box .agree { padding:15px 0 30px 15px; }
.member-wrap .login-box .btn-join { width:100%; display: block; height: 60px; line-height: 54px; text-align: center; background: #fff; border: 2px solid #5cb5cd; font-size:20px; color: #5cb5cd; margin-bottom: 10px;  }
.member-wrap .login-box .lost { padding:15px 20px; background: #fff; display: flex; justify-content: space-between; align-items: center; font-size:16px; color: #333; margin-bottom: 55px;  }
.member-wrap .login-box h4 { position: relative; text-align: center; margin-bottom: 40px; }
.member-wrap .login-box h4 strong { display: inline-block; vertical-align: middle; padding:0 25px; background: #f8f8f8; font-size:20px; font-weight: 600; position: relative; z-index:2; }
.member-wrap .login-box h4:before { content: ''; position: absolute;left: 0; top:50%; right:0; height: 1px; background: #e5e5e5; }
.member-wrap .login-box .socials { display: flex;justify-content: space-around; }
.member-wrap .login-box .socials a { display: block; text-align: center; font-size:16px; color: #333; }
.member-wrap .login-box .socials a  span { display:block; padding-top:10px; white-space: nowrap; }
.member-wrap .login-box .inp-box.type2 { display: flex; justify-content: space-between; position: relative; padding-right:33px; margin-bottom: 22px; }
.member-wrap .login-box .inp-box.type2 .inp-member { flex: 1; width:100%; }
.member-wrap .login-box .inp-box.type2 .capt { flex:0 0 158px; border: 1px solid #e5e5e5; border-left: 0; }
.member-wrap .login-box .inp-box.type2 .btn-cap1 { position: absolute; right:0; top:0; }
.member-wrap .login-box .inp-box.type2 .btn-cap2 { position: absolute; right:0; bottom:0; }
.member-wrap .login-box .alert { text-align: center; font-size:16px; color: #333; margin-bottom: 50px; }
.member-wrap .login-box .alert i { font-size:20px; vertical-align: middle; margin:-3px 5px 0 0;}

.btn-box1 { text-align:center; }
.btn-box1 a, .btn-box1 button { width:180px; margin:0 3px; }

.sub-wrap { padding-top:75px; }
.h4-member { font-size:22px; font-weight: 700; margin-bottom: 10px;  }
.member .h3 { margin-bottom: 60px; }
.member .prv { padding:20px; border: 1px solid #e5e5e5; font-size:16px; line-height: 1.6; max-height: 400px; overflow: auto; margin-bottom: 14px;  }
.member .agree { text-align: right; margin-bottom: 50px; }
.join-end { margin:130px auto; max-width:1000px; padding: 50px 20px 190px; background: #f8f8f8; border: 1px solid #e5e5e5; border-top:2px solid #d2cdcd; text-align: center; }
.join-end h3{  font-size:37px; font-weight: 700; margin-bottom: 10px; }
.join-end .desc{ font-size:18px; line-height: 1.5; font-weight: 300; color: #333; margin:0 auto 38px; max-width:600px; padding-bottom: 40px; border-bottom: 1px solid #cccccc; }

.table1 { margin-bottom: 70px; }
.table1 table { width:100%; border-collapse: collapse; }
.table1 table tbody th { border-bottom: 1px solid #e5e5e5; background: #f8f8f8; text-align: center; font-size:16px; font-weight: 400; }
.table1 table tbody td { padding: 10px; border-bottom: 1px solid #e5e5e5; font-size:16px; height: 60px; }
.table1 table tbody td .inp-box { display: inline-block; vertical-align: middle; margin-right:10px; }
.table1 table tbody td .desc { display: inline-block; vertical-align: middle; }
.table1 table tbody td .addr1 .inp { width:245px; margin-right:2px; }
.table1 table tbody td .addr1 .btn-type3 { width:180px; }
.table1 table tbody td .addr2 { display: flex; justify-content: space-between;  padding-top:10px;}
.table1 table tbody td .addr2 .inp { width:calc(50% - 3px); }
.border-top { border-top:2px solid #cccccc;}
.td-div1 { display:flex; justify-content: space-between; align-items: center; }
.td-div1 .inp { flex: 1; }
.td-div1 p { margin-left: 10px; }

.table2 {}
.table2 table { width:100%; border-collapse: collapse; border-top:1px solid #e5e5e5; }
.table2 table tbody th { border-bottom: 1px solid #e5e5e5; background: #f8f8f8; text-align: center; font-size:16px; font-weight: 400; }
.table2 table tbody td { padding: 23px 15px; border-bottom: 1px solid #e5e5e5; font-size:16px;  font-weight: 300; }


.gallery-list ul { display: flex; flex-wrap: wrap; margin:0 -20px; }
.gallery-list ul li { width:33.33333%; padding:0 20px 40px; }
.gallery-list ul li a { display: block; height: 100%; border:1px solid #e5e5e5;  }
.gallery-list ul li a .img { overflow: hidden; }
.gallery-list ul li a .img img { width:100%; transition: all 0.5s ease; vertical-align: middle; }
.gallery-list ul li a .info { padding: 20px 30px; border-top:1px solid #e5e5e5;  }
.gallery-list ul li a .info .t1 { font-size:24px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 600; margin-bottom: 10px;}
.gallery-list ul li a .info .t2 { font-size:18px; line-height: 28px; height: 59px; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2; font-weight: 300; color: #666; }
.gallery-list ul li a .info .t3 { font-size:16px; font-weight: 600; margin-top:25px; }

.gallery-list2 ul { display: flex; flex-wrap: wrap; margin:0 -20px; }
.gallery-list2 ul li { width:25%; padding:0 20px 40px; }
.gallery-list2 ul li .item { display: block; height: 100%; border:1px solid #e5e5e5;  }
.gallery-list2 ul li .item .img { overflow: hidden; }
.gallery-list2 ul li .item .img img { width:100%; transition: all 0.5s ease; vertical-align: middle; }
.gallery-list2 ul li .item .info { padding: 20px 30px 30px; border-top:1px solid #e5e5e5;  }
.gallery-list2 ul li .item .info .t1 {font-size:20px; font-weight: 600; margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gallery-list2 ul li .item .info .t2 { font-size:16px; color: #336699; font-weight: 300; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #e5e5e5;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  }
.gallery-list2 ul li .item .info .t3 { font-size:16px; color: #666; line-height:20px; height: 40px;  margin-bottom: 10px; overflow: hidden;}
.gallery-list2 ul li .item .info .tel { font-size:18px; color: #666; font-weight: 600; font-family: 'Roboto'; margin-bottom: 12px;  }
.gallery-list2 ul li .item .info a { display: block; }
.gallery-list2 ul li .item .info .btn { display: block; height: 46px; line-height: 45px; text-align: center; background: #ff9900; font-size:18px; color: #fff; }
.gallery-list2 ul li .item .info .btn:before { content: ''; display: inline-block; vertical-align: middle; background: url(../img/map/ico_map.png) no-repeat 0 0 ;width:19px; height: 26px; margin:-4px 5px 0 0;}

.find-map-wrap { position: fixed;left: 0; top:80px; right:0; bottom:0; }
.find-map-wrap .map { background: #f9f9f9; width:calc(100% - 540px); height: 100%; }
.marker{  position: absolute; transform: translateX(-50%); text-align: center; }
.marker p { display: inline-block; padding:0 10px; height: 30px; line-height: 28px; border: 1px solid #e5e5e5; border-radius:28px; background: #fff; margin-bottom:-8px;  font-size:14px;  }
.marker img { }
.find-map-wrap .markers { position: absolute;left: 30px; top:30px; width:120px; border-radius:20px; background: #fff; box-shadow:5px 5px 18px rgba(0,0,0,0.15); padding:8px 0;  }
.find-map-wrap .markers button { width:100%; text-align: left; align-items: center; display: flex; justify-content: space-between; padding-left: 18px; font-size:16px; font-weight: 300; height: 54px;  background: none; transition: all 0.5s ease; }
.find-map-wrap .markers button span {flex: 1; text-align: center; }
.find-map-wrap .markers button.active { background: #eeeeee; }
.find-map-wrap .list-box { position: absolute; right:0; top:0; bottom:0; width:540px; background: #fff; box-shadow:0 0 20px rgba(0,0,0,0.15);}
.find-map-wrap .list-box .head { padding-top:40px;  height: 160px; background: url(../img/map/bg_head.png) no-repeat  50% 50%; text-align: right; padding-right:70px; position: relative; background-size:cover;}
.find-map-wrap .list-box .head:before{  content: '';position: absolute;left: 110px; top:0; bottom:0; background: url(../img/map/ico_head_map.png) no-repeat 50% 50%; width:74px; }
.find-map-wrap .list-box .head span { font-size:18px; }
.find-map-wrap .list-box .head p { font-size:40px; font-weight: 700; }
.find-map-wrap .list-box .srch { height: 135px; padding:0 40px; display: flex; align-items: center; background: #336699; }
.find-map-wrap .list-box .srch select { width:100%; height: 50px; padding-left: 20px; font-size:20px; font-weight: 300; border: 0; background:#fff url(../img/map/bu_select.png) no-repeat 100% 50%; background-position: right 15px center;}
.find-map-wrap .list-box .list { padding:40px; height: calc(100% - 295px);  overflow: auto; }
.find-map-wrap .list-box .list::-webkit-scrollbar { width:5px; border-radius:5px; background:none;  }
.find-map-wrap .list-box .list::-webkit-scrollbar-thumb { width:5px; border-radius:5px; background: #ccc; }
.find-map-wrap .list-box .list::-webkit-scrollbar-track {  background:none; }
.find-map-wrap .list-box .list ul li { margin-bottom: 25px; }
.find-map-wrap .list-box .list ul li:last-child { margin-bottom: 0;}
.find-map-wrap .list-box .list ul li .item { display: flex; justify-content: space-between; }
.find-map-wrap .list-box .list ul li .item .img { flex:0 0 160px; margin-right:20px;  }
.find-map-wrap .list-box .list ul li .item .img img { width:160px; height: 160px; }
.find-map-wrap .list-box .list ul li .item .img a { display: block; margin-top:1px; height: 46px; line-height: 45px; text-align: center; font-size:18px; color: #fff; background: #ff9900;}
.find-map-wrap .list-box .list ul li .item .img a:before { content: ''; display: inline-block; vertical-align: middle; background: url(../img/map/ico_map.png) no-repeat 0 0; width:19px; height: 26px; margin:-3px 4px 0 0;}
.find-map-wrap .list-box .list ul li .info { border-top:1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; padding:15px 0;  flex: 1; min-width: 0; }
.find-map-wrap .list-box .list ul li .info .t1 { font-size:20px; font-weight: 600; margin-bottom: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.find-map-wrap .list-box .list ul li .info .t2 { font-size:16px; color: #336699; padding-bottom: 15px; margin-bottom: 15px; color: #336699; font-weight: 300;padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #e5e5e5;  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;  }
.find-map-wrap .list-box .list ul li .info  .t3 { font-size:16px; color: #666; line-height:20px; height: 40px;  margin-bottom: 10px;  overflow: hidden; }
.find-map-wrap .list-box .list ul li .info  .tel { font-size:18px; color: #666; font-weight: 600; font-family: 'Roboto';   }

.edu-title { padding: 20px 30px; display: flex;justify-content: space-between; align-items: center; border: 10px solid #e5e5e5; margin-bottom: 20px; }
.edu-title strong { font-size:30px; font-weight: 700; }
.edu-title p { font-size:16px; }

.captcha { text-align:center; margin-bottom:20px; }

.table1 .checks { padding:10px 0 5px; }
.table1 .checks label { display: inline-block; vertical-align: middle; margin-right:20px; margin-bottom: 5px; }

.calendar1 { }
.calendar1 .year { text-align: center; margin-bottom: 20px; display: flex; justify-content: center; align-items: center; }
.calendar1 .year button { background: none; border: 0; outline:none; }
.calendar1 .year strong { font-size:50px; font-weight: 700; font-family: 'Roboto'; line-height: 1;  margin:0 20px;  }
.calendar1 .types { display: flex; justify-content: center; margin-bottom: 25px;  }
.calendar1 .types div { display: flex; align-items: center; font-size:20px; font-weight: 300; margin:0 13px; }
.calendar1 .types div i { display: inline-block; width:20px; height: 20px; border-radius:100%;  margin-right:5px; }
.bg-red { background: #f95f75;}
.bg-green { background: #90c10d;}
.bg-gray { background: #b2b2b2;}

.table-calendar1 {}
.table-calendar1 table { width:100%; border-collapse: collapse; table-layout: fixed; }
.table-calendar1 table thead th { height: 55px; font-weight: 400; font-size:20px; background: #f8f8f8; border: 1px solid #e5e5e5;  border-top:1px solid #ccc; }
.table-calendar1 table thead th:first-child,
.table-calendar1 table tbody td:first-child .num{ color: #fc0056;}
.table-calendar1 table thead th:last-child,
.table-calendar1 table tbody td:last-child .num{ color: #0198cf;}
.table-calendar1 table tbody td { height: 113px; font-size:20px; padding:10px; border: 1px solid #e5e5e5; text-align: right; width:14.28571428571429%; vertical-align: top; }
.table-calendar1 table tbody td .num { padding-right:10px;margin-bottom: 5px; font-weight: 700;}
.table-calendar1 table tbody td ul li + li { margin-top:3px; } 
.table-calendar1 table tbody td ul li a { display: block; font-size:14px; color: #fff; padding:0 7px; height: 30px; line-height: 29px;white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 300;}




.table-calendar2 {}
.table-calendar2 table { width:100%; border-collapse: collapse; table-layout: fixed; }
.table-calendar2 table thead th { height: 60px; font-weight: 300; font-size:20px; }
.table-calendar2 table thead th:first-child,
.table-calendar2 table tbody td:first-child .num{ color: #fc0056;}
.table-calendar2 table thead th:last-child,
.table-calendar2 table tbody td:last-child .num{ color: #0198cf;}
.table-calendar2 table tbody td { height: 60px; font-size:20px; color: #666666;  width:14.28571428571429%; text-align: center; }
.table-calendar2 table tbody td .num { display: inline-block; vertical-align: middle; }
.table-calendar2 table tbody td .num {  background: none;  }
.table-calendar2 table tbody td .num span { display: flex; align-items: center; justify-content: center; width:50px; height: 50px; border-radius:100%;  font-size:20px; color: #666; transition: all 0.3s ease; margin: 0 auto; }
.table-calendar2 table tbody td .num:after{ content: 'TODAY'; display: block; opacity:0;  margin-top:3px; font-size:14px; font-weight: 600; color: #336699; font-family: 'Roboto'; }
.table-calendar2 table tbody td .num.today span { color: #fff; background: #336699; }
.table-calendar2 table tbody td .num.today:after { opacity:1;}
.table-calendar2 table tbody td .num[disabled] { opacity:0.3; }
.table-calendar2 table tbody td .num:hover span { background: #f2f2f2; }

.calendar2 { margin-bottom: 75px; }
.calendar2 .year { text-align: center; margin-bottom: 20px; display: flex; justify-content: center; align-items: center; }
.calendar2 .year button { background: none; border: 0; outline:none; }
.calendar2 .year strong { font-size:34px; font-weight: 500; font-family: 'Roboto'; line-height: 1;  margin:0 20px;  }
.calendar2 { display: flex; justify-content: space-between; }
.calendar2 h4 { padding:0 15px; height: 70px; line-height: 66px;  text-align: center; border: 1px solid #e5e5e5; font-size:24px; border-bottom: 4px solid #336699; font-weight: 400; margin-bottom: 20px; }
.calendar2 .left { width:63.63%; }
.calendar2 .box { border: 1px solid #e5e5e5; height:calc(100% - 90px); padding-bottom: 20px;}
.calendar2 .box .year {display: flex; justify-content: center; align-items: center; height: 90px; border-bottom: 1px solid #e5e5e5;}
.calendar2 .right { width:34.84%; }
.calendar2 .right .box { padding: 30px 35px; display: flex; flex-direction: column; justify-content: space-between; }
.calendar2 .right .box label { cursor: pointer; }
.calendar2 .right .checkbox + p span { font-size:20px; }
.calendar2 .right .checkbox + p em { width:20px; height: 20px;  transform: translateY(2px); margin-right:7px;}
.calendar2 .right .checkbox[disabled] + p span { opacity:0.4; }
.reserve { }
.reserve .tit { text-align: center; padding:15px; font-size:24px; font-weight: 600; border-right:1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-bottom: 4px solid #336699; margin-bottom: 25px;  }
.reserve .msg { text-align: center; padding: 85px 15px; border: 1px solid #e5e5e5; margin-bottom: 50px;  }
.reserve .msg .t1 { font-size:40px; font-weight: 300; margin-bottom: 25px; }
.reserve .msg .t2 { font-size:16px; line-height: 1.6; color: #333; }

/* 제품 */
.product-tabs { margin-bottom: 50px; }
.product-tabs > ul { display: flex; border: 1px solid #e5e5e5; text-align: center; border-top:2px solid #ccc; }
.product-tabs > ul > li { flex: 1; padding: 4px; border-left: 1px solid #e5e5e5; }
.product-tabs > ul > li:first-child { border-left: 0; }
.product-tabs .btn-dep1 { display: block; height: 50px; line-height: 50px; font-size:18px; transition: all 0.3s ease; position: relative; }
.product-tabs .btn-dep1:before { content: ''; position: absolute;left: -4px; right:-5px; bottom:-4px; height: 1px; background: #e5e5e5; }
.product-tabs > ul > li.active .btn-dep1 { background: #5cb5cd; color: #fff; font-weight: 600; }
.product-tabs > ul > li > a.active { font-weight: 600; }
.product-tabs .dep2 { display: flex; justify-content: space-between; margin-top:4px; display:none;}
.product-tabs .dep2 ul { flex: 1; padding:10px 0; }
.product-tabs .dep2 ul + ul { border-left: 1px solid #e5e5e5; }
.product-tabs .dep2 .btn-dep2 {display: block; font-size:16px; line-height:30px; }
.product-tabs .dep2 .btn-dep2.active { font-weight: 700; }
.product-sort { display: flex; align-items: center; justify-content: space-between; padding: 10px; border-top:2px solid #ccc; border-bottom: 1px solid #e5e5e5; margin-bottom: 40px;  }
.product-sort h4 { font-size:24px; font-weight: 700; }
.product-sort .sort { position: relative;}
.product-sort .sort button{ display: none; }
.product-sort .sort ul { display: flex; align-items: center; }
.product-sort .sort ul li { padding-left: 23px; margin-left: 22px; position: relative;}
.product-sort .sort ul li:before { content: ''; position: absolute;left: 0; top:50%; width:1px; height: 14px; background: #ccc; margin-top:-7px; }
.product-sort .sort ul li:first-child:before { display: none; }
.product-sort .sort ul li a { display: block; font-size:16px; }
.product-sort .sort ul li a.active { font-weight: 600; }

.prd-search-msg { text-align: center; margin:45px 0 30px; font-size:24px; font-weight: 200; }
.prd-search { padding: 35px 20px; background: #f8f8f8; border: 1px solid #e5e5e5; display: flex; justify-content: center; align-items: center; margin-bottom: 40px;  }
.prd-search strong { font-size:34px; margin-right:15px; font-weight: 600;}
.prd-search .inp-box { width:60%; position: relative;}
.prd-search .inp-box .inp { border: 1px solid #e5e5e5; padding:0 60px 0 18px; background: #fff; font-size:18px; font-weight: 300; width:100%; height: 60px; }
.prd-search .inp-box .btn-srch { position: absolute; right:10px; top:0; width:60px; height: 60px; background: none; border: 0; font-size:30px; color: #444;}

.product-head { display: flex; justify-content: space-between; }
.product-head .thum {width:48.4848%;  }
.product-head .thum .large { position: relative; border: 1px solid #e5e5e5; margin-bottom: 10px;  }
.product-head .thum .large img { vertical-align: middle; width:100%; }
.product-head .thum .large .label {  position: absolute; left: 27px; top:0; background: url(../img/common/label_3d_large.png) no-repeat 0 0; width:100px; height: 121px;text-indent: -9999px;  }
.product-head .thum ul { display: flex; margin:0 -5px;  }
.product-head .thum ul li { width:25%; padding:0 5px;  }
.product-head .thum ul li p { border: 1px solid #e5e5e5;}
.product-head .thum ul li p img { width:100%; vertical-align: middle; }
.product-head .info { width:48.4848%; position: relative;}
.product-head .info .control { position: absolute; right:0; top:0; }
.product-head .info .control a { display: inline-block; vertical-align: middle; width:31px; height: 31px; line-height: 29px; text-align: center; border: 1px solid #e5e5e5; font-size:22px; color: #999; transition: all 0.5s ease;}
.product-head .info .control a.thums { background: url(../img/common/ico_prd_thum.png) no-repeat 50% 50%; }
.product-head .info .control a:hover{ border-color:#000; }
.product-head .info .t1 { font-size:18px; color: #666; line-height: 1.3; font-weight: 300; margin-bottom: 10px;  padding-right:100px; }
.product-head .info .t2 { font-size:30px; line-height: 1.3; font-weight: 600; margin-bottom: 30px;  }
.product-head .info .opt { margin-bottom: 15px; }
.product-head .info .opt dl:after { display: block; content: ''; clear: both; }
.product-head .info .opt dl { font-size:16px; color: #333; font-weight: 300; line-height: 1.4; margin-bottom: 20px; }
.product-head .info .opt dl dt { float:left; width:95px; color: #000; font-weight: 600;}
.product-head .info .opt dl dd { overflow: hidden; }
.product-head .info .opt .files li { margin-bottom: 6px; }
.product-head .info .opt .files li a { display: inline-block; vertical-align: middle; width:80px; height: 30px; line-height: 30px; text-align: center; background: #666; font-size:14px; color: #fff; font-weight: 300; margin-left: 4px;  }
.product-head .info .btns { display: flex; justify-content: space-between; margin:0 -5px 35px; }
.product-head .info .btns a { flex: 1; margin:0 5px;  height: 60px; line-height: 58px; text-align: center; font-size:20px; font-weight: 300; border: 1px solid #e5e5e5; }
.product-head .info .btns a.b1 { background: #5cb5cd; color: #fff;}
.product-head .info .btns a.b2 { background: #f8f8f8; }
.product-head .info .title { margin-bottom: 15px; position: relative;}
.product-head .info .title .h4-my { border-bottom: 0; }
.product-head .info .title .right { position: absolute; right:0; top:0;}
.product-head .info .title .right a { display: inline-block; vertical-align: middle; width:100px; height: 34px; line-height: 32px; border: 1px solid #e5e5e5; font-size:16px; text-align: center; }
.product-head .info .list { padding: 25px 30px; border: 1px solid #e5e5e5; }
.product-head .info .list li { padding-right:90px; position: relative; font-size:16px; font-weight: 300; }
.product-head .info .list li + li { margin-top:10px; }
.product-head .info .list li a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.product-head .info .list li a .red { color: #eb6464 !important;}
.product-head .info .list li a .pink { color: #c585b8 !important;}
.product-head .info .list li a .blue  { color: #5cb5cd !important;}
.product-head .info .list li a .gray  { color: #666 !important;}
.product-head .info .list li a .green  { color: #5cb196 !important;}
.product-head .info .list li > span { position: absolute; right:0; top:0; }


.product-detail .tabs2 { margin:90px 0 50px;}
.product-detail .tit-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; }
.product-detail .tit-head .right a { display: inline-block; width:140px; height: 40px; line-height: 39px; text-align: center; background: #339933; font-size:16px; font-weight: 300; color: #fff; }
.product-detail .h4-prd { font-size:40px; font-weight: 700; letter-spacing:7px; }
.product-detail .h4-prd small { font-size:16px; color: #333; font-weight: 300; margin-left: 10px; letter-spacing: 0;}

.prd-reviews {}
.prd-reviews ul { border-top:2px solid #cccccc; }
.prd-reviews ul li { border-bottom: 1px solid #e5e5e5;  }
.prd-reviews ul li > a { display:block; padding-left: 140px; padding-right:15px;  line-height: 65px; position: relative; font-size:16px; transition: all 0.5s ease; }
.prd-reviews ul li > a.active { background: #f8f8f8; }
.prd-reviews ul li > a .txt-box { display: flex; justify-content: space-between; align-items: center; }
.prd-reviews ul li > a .subj { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.prd-reviews ul li > a .grade { position: absolute;left:15px; top:50%; transform: translateY(-50%); }
.prd-reviews ul li > a .etc { display: flex; align-items: center; }
.prd-reviews ul li > a .etc div { padding-left: 25px; margin-left: 24px; position: relative;}
.prd-reviews ul li > a .etc div:before{content: ''; position: absolute;left: 0; top:50%; width:1px; height:14px; background: #ccc; margin-top:-7px; }
.prd-reviews ul li > a .etc div:first-child:before { display: none; }
.prd-reviews ul li .a { display: none; }
.prd-reviews ul li .a .box { padding: 40px 35px; border-top:1px solid #e5e5e5; display: flex;  }
.prd-reviews ul li .a .slider { width:400px; position: relative;}
.prd-reviews ul li .a .slider img { width:100%; }
.prd-reviews ul li .a .text { flex: 1; margin-left: 30px; padding-top:10px; font-size:16px; line-height: 1.6; font-weight: 300; }
.prd-reviews ul li .a .text .btns { padding:25px 0 ; }
.prd-reviews .swiper-pagination { position: static;left: 0; right:0; bottom:20px; text-align: center; padding-top:10px;  }
.prd-reviews .swiper-pagination-bullet {margin:0 4px; width:10px; height:10px; background:#000; opacity:.2; border-radius:10px; transition: all 0.3s ease;}
.prd-reviews .swiper-pagination-bullet-active {width:30px !important; opacity:.5;}
.prd-information .box { display: flex;  justify-content: space-between;  border-top:2px solid #000; border-bottom: 1px solid #e5e5e5; }
.prd-information .tit { display: flex; justify-content: center; align-items: center; width:300px; background: #f7f7f7; font-size:20px; font-weight: 300; text-align: center; }
.prd-information .text { padding:25px 30px; font-size:16px; line-height: 1.6; }
.prd-information .text p { padding-left: 12px; text-indent: -12px; margin-bottom: 10px; word-break: keep-all; }
.prd-information .text strong { display: block; font-weight: 700; margin:45px 0 10px;}

.modal-orders { }
.modal-orders .tit { text-align: center; font-size:18px; color: #333; margin-bottom: 20px; }
.modal-orders ul { border-top:2px solid #5cb5cd; }
.modal-orders ul li { padding:15px 0 15px 50px; border-bottom: 1px solid #e5e5e5;  position: relative; }
.modal-orders ul li > label { position: absolute;left: 17px; top:50%; margin-top:-10px; }
.modal-orders ul li .info { font-size:17px; line-height: 1.4; }
.modal-orders ul li .info > div { display:flex; flex-wrap:wrap; margin-bottom:10px; }
.modal-orders ul li .info div p { display: inline; margin-right:15px; }
.modal-orders ul li .info div > div { margin-bottom:5px; padding-right:10px; }
.modal-orders ul li .info div label { margin-right:5px; }
.modal-orders ul.type2 li { padding-left:0; }

.temp-btns { text-align:center; margin-bottom:30px; }
.temp-btns a { display:inline-block; padding:0 35px; height:70px; line-height:69px; border-radius:70px; background:#4f5389; font-size:22px; color:#fff; }


#cont1,
#cont2,
#cont3,
#cont4 { padding-top:30px; }
.terms { font-size:16px; line-height: 1.6; color: #333; font-weight: 300; padding:15px; }

.mobile { display:none; }

@media all and (max-width:1620px) {
	.header1 nav .btn-dep1 { font-size:17px; padding:0 20px; }	
	.header1 nav .btn-dep2 { font-size:13px; }
}
@media all and (max-width:1450px) {
	.header1 .inner { padding: 0 20px; }
	.header1 .etc { right:20px; }
	.header1 .etc .btns a + a { padding-left: 10px; margin-left: 0;}
	.header1 .etc .btns a + a:before { display: none; }
}


@media all and (max-width:1260px) {
	.table2 table tbody td { padding:10px;}
}

@media all and (max-width:1150px) {
	.mobile { display:block; }
	.pc { display:none; }
	
	.mb40 { margin-bottom: 25px !important; }
	.mb50 { margin-bottom: 25px !important; }
	
	body { padding-top:50px; }
	.header1 { height: 50px;  }
	.header1 .inner { display: block; }
	.header1 .etc { display: none; }
	.header1 nav { display: none; }
	.header1 h1 a { width:155px; height: 50px; margin: 0 auto;background: url(../img/common/logo_m.png) no-repeat 0 50%; background-size:155px auto; }
	.header1 .btn-m,
	.header1 .btn-srch { display: block; }
	
	
	.main1 { height: auto; position: relative;  margin-bottom: 40px; }
	.main1 .inner { height: auto; display: block; padding: 60px 35px 190px; }
	.main1 .t1 { font-size:17px; }
	.main1 .t2 { font-size:26px; margin-bottom: 15px; }
	.main1 .t3 { font-size:12px; }
	.main1 .slide2 .t3 p { font-size:12px; }
	.main1 .btns a { padding:0 15px; font-size:12px; height: 40px; line-height: 40px; }
	.main1 .swiper-button-next,
	.main1 .swiper-button-prev { display: none; }
	.main1 .swiper-slide { height: auto; background-position: 70% 50%; }
	.main1 .swiper-pagination-bullet { width:7px; height: 7px; }
	.main1 .swiper-pagination-bullet-active { width:20px; }
	.main2 .box1 ul { flex-wrap: wrap; margin:0 -10px; justify-content: flex-start; }
	.main2 .box1 ul li { width:50%; padding:0 10px 20px; flex: auto;}
	.main2 .box1 ul li a { padding:20px 30px;}
	.main2 .box1 ul li a strong { font-size:14px; }
	.main2 .box2 { display: block; }
	.main2 .box2 .latest { width:auto; height: 50px; padding-left: 90px; margin-bottom: 15px;}
	.main2 .box2 .latest:nth-child(2) { padding-left:135px; }
	.main2 .box2 .latest h3 { left: 10px; line-height: 48px; font-size:13px; }
	.main2 .box2 .latest h3:before { width:14px; height: 14px; border-width:4px;  margin-right:4px; }
	.main2 .box2 .latest .swiper-slide a { line-height: 49px; height: 49px; font-size:13px; margin-right:40px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.main2 .swiper-button-prev { right:5px; top:3px; font-size:22px; }
	.main2 .swiper-button-next { right:5px; bottom:0; font-size:22px;  }
	.main3 { padding:60px 0; margin-bottom: 40px; }
	.main3 .t1 { font-size:15px; }
	.main3 .t2 { font-size:24px; }
	.sort-tabs { margin-bottom: 20px }
	.sort-tabs a{  font-size:13px; padding:0 20px; margin-bottom: 5px;  }
	.sort-tabs .mobile + a:before { display: none; }
	
	.product-list ul { margin:0 -10px; }
	.product-list ul li { width:50%; padding:0 10px 20px;}
	.product-list ul li a .img .label { width:35px; height: 42px; background-size:35px 42px; }
	.product-list ul li a .subj { font-size:14px; }
	.product-list ul li a .desc  {font-size:11px; }
	.product-list ul li .btns button { width:18px; height: 18px; background-size:18px auto; }
	
	.btn-more { height: 40px; line-height: 38px; padding:0 15px 0 20px; font-size:14px; border-radius:40px; }
	.btn-more i { margin-left: 35px; font-size:15px; }
	.footer-nav .btn-top { display: none; }
	
	.footer-nav {margin-top:70px; }
	.footer-nav .menu { text-align: center; }
	.footer-nav .menu a { font-size:11px; margin:0 4px; line-height: 35px;}
	.footer-nav .menu a:last-child { display: none; }
	.footer { padding:20px 0; }
	.footer .inner { display: block; padding: 0; }
	.footer .menu { text-align: center; }
	.footer .menu a { font-size:12px; margin: 0 6px !important;   }
	.footer .menu a + a { margin: 0;}
	.footer .cs { position: static; text-align: center; }
	.footer .cs span { font-size:13px; }
	.footer .cs strong { font-size:24px; display: inline; }
	.footer .cs dl { display: flex; justify-content: center; align-items: center; flex-direction:column-reverse;  }
	.footer .cs dl dt a { width:120px; height: 35px; line-height: 33px; font-size:12px; }
	.footer .cs dl dd { font-size:12px; margin-bottom: 10px; }
	.footer .cs dl dd br { display: none; }
	.footer .addr { text-align: center; font-size:11px; margin-top:15px; }
	.footer .addr span { margin:0 4px;}
	.footer .copy { text-align: center; font-size:11px; }
	.footer .addr .logo { margin-bottom: 20px; }
	.footer .addr .logo img { height: 31px; }
	
	.container { padding-top:30px; }
	
	
	.sub-tabs { margin-top:-40px; margin-bottom: 40px; }
	.sub-tabs .inner { padding: 0; }
	.sub-tabs .inner a { height: 35px; line-height: 32px; font-size:12px; }
	.h3 { font-size:24px;  padding-bottom: 10px; }
	.mb60 { margin-bottom: 30px !important; }
	.h4 { font-size:20px; padding-bottom: 12px;}
	.h4-my {font-size:18px;}
	.h4-my:before{width:20px; height: 20px; border-width:5px; margin-right:7px; }
	.about h4 { font-size:20px; }
	.about .desc { font-size:12px; }
	.about .t1 { font-size:15px;margin-bottom:18px; }
	
	.about .box4 .map { height: 250px; }
	.about .box4 .ctt { display: block; padding: 0; }
	.about .box4 .ctt .path { margin-bottom: 25px; }
	.about .box4 .ctt .path .ic { width:75px; height: 75px; flex:0 0 75px; margin-right:12px; }
	.about .box4 .ctt .path .ic img { width:42px; }
	.about .box4 .ctt .path dl dt { font-size:12px; margin-bottom: 4px;  }
	.about .box4 .ctt .path dl dd p { font-size:13px; margin-bottom: 2px;  }
	.about .box4 .ctt .path dl dd small { font-size:11px; }
	.about .box4 .ctt .path dl dd span { font-size:12px; }
	
	
	.tabs2 p { padding:2px; }
	.tabs2 a { height: 34px; line-height: 33px; font-size:13px; }
	
	.board-product .box .img { width:50px !important;height: 50px !important; }
	.board-product .box .info { margin-left: 10px !important; }
	.board-product .box .info .name { font-size:14px !important; }
	.board-product .box .info .desc { font-size:11px !important; }
	
	.board-list table thead,
	.board-list table colgroup { display: none; }
	.board-list table tbody,
	.board-list table tbody tr{ display: block; }
	.board-list table tbody td { display: none; font-size:12px;  }
	.board-list table tbody td.show-subj { display: block; }
	.board-list table tbody td .subj { align-items: flex-start; }
	.board-list table tbody td .subj .label-notice { flex: 0 0 50px; display: block; width:50px; height: 20px; line-height: 19px; font-size:10px; margin-right:7px;  }
	.label1 { display: block;flex:0 0 50px; width:50px; height: 20px; line-height: 19px; font-size:10px; margin-right:7px;   }
	.board-list table tbody td .subj .label3 { flex: 0 0 50px; display: block; width:50px; height: 20px; line-height: 19px; font-size:10px; margin-right:7px;  }
	.board-list table tbody td .label4 { flex: 0 0 50px; display: block; float:right; width:50px; height: 20px; line-height: 19px; font-size:10px; margin-right:7px;  padding:0 !important;  margin-left: 0; transform: translateY(-2px);}
	.board-list table tbody td .label4:before { display: none; }
	
	.board-list table tbody td .subj img { max-height: 18px; }
	.board-list table tbody td .etc { display: block; font-size:0; padding-top:8px; }
	.board-list table tbody td .etc span { display: inline-block; vertical-align: middle; font-size:11px; margin-right: 5px; padding-right: 7px; position: relative;}
	.board-list table tbody td .etc span:last-child { margin-right:0; padding-right:0; }
	.board-list table tbody td .etc span:before {content: ''; position: absolute;right: 0; top:50%; width:1px; height: 10px; margin-top:-5px; background: #e5e5e5; }
	.board-list table tbody td .etc span:last-child:before { display: none; }
	.board-list table tbody td .subj .label2 { flex: 0 0 50px; display: block; width:50px; height: 20px; line-height: 19px; font-size:10px; margin-right:7px;  }
	.board-list table tbody td .etc + .etc { padding-top:0; }
	
	/* 제품상세 */
	.prd-cont3 .board-list table tbody td[colspan] { display: block; padding:0; }
	.board-list table tbody td .qa { padding: 10px 0 10px; }
	.board-list table tbody td .qa .t { width:50px; font-size:25px; }
	.board-list table tbody td .qa .txt { font-size:12px; }
	.board-list table tbody td .qa .btns { right:10px; top:-35px; background: none; padding: 0; margin-bottom: 0; }
	.board-list table tbody td .qa .btns a { font-size:12px; padding-left: 10px; margin-left: 10px; }
	
	.board-list.cart-type table tbody td { display: block; border-left: 0 !important; text-align: left; padding:10px 5px; }
	.board-list.cart-type table tbody td:nth-child(2):before { content: '디자인 코드 : '; display: inline; font-weight: 600;}
	.board-list.cart-type table tbody td:nth-child(3):before { content: '날짜 : '; display: inline; font-weight: 600;}
	
	.board-product { padding:10px; }
	.board-list .board-product label { width:30px; }
	
	.board-list2 ul li { padding: 5px; }
	.board-list2 ul li a .img { width:90px; height: 90px; flex:0 0 90px; margin-right:8px;  }
	.board-list2 ul li a .info h4 { font-size:14px; margin:0 0 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	.board-list2 ul li a .info .txt { font-size:11px; overflow: hidden; line-height: 1.4;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2; margin-bottom: 5px;  }
	.board-list2 ul li a .info span { font-size:10px; display: inline-block; }
	.board-list2 ul li a .info span + span {  margin-left: 6px; padding-left: 0; }
	.board-list2 ul li a .info span + span:before {  display: none; }
	
	
	.board-view .tit h4 { padding:10px 15px; font-size:13px; }
	.board-view .tit h4 .label1 { display: inline-block; }
	.board-view .etc { padding:10px 15px; position: relative;}
	.board-view .etc .label2 { position: absolute; top:5px; right:0; width:60px; font-size:10px; height: 26px; line-height: 24px;}
	.board-view .etc span { font-size:11px; }
	.board-view .etc span + span { padding-left: 7px; margin-left: 6px; }
	.board-view .file-box.mobile { display: block; }
	.board-view .file-box.pc { display: none; }
	.board-view .file-box.mobile  a { font-size:11px; }
	.board-view .file-box.mobile  img { height: 19px; margin:-4px 8px 0 0; }
	.board-view .etc span + span:before { height: 8px; margin-top:-4px; }
	.board-view .files { border-bottom: 1px solid #e5e5e5; padding:10px 15px; font-size:0; }
	.board-view .files a { font-size:11px; }
	.board-view .files a img { height: 16px;position: relative; top:-2px; margin-right:4px; }
	.board-view .view { font-size:12px; /* border-bottom: 1px solid #e5e5e5; */  }
	.board-view .file { display: none; }
	
	.review-list ul { margin:0 -10px; }
	.review-list ul li { width:50%; padding:0 10px 20px; }
	.review-list ul li a .info { padding:10px; }
	.review-list ul li a .info .text { font-size:12px; line-height: 18px; height: 36px; word-break: break-all; }
	.review-list ul li a .info .prd { margin-top:10px; padding-top:10px; }
	.review-list ul li a .info .prd p { width:45px; height: 45px; margin-right:5px; }
	.review-list ul li a .info .prd div { font-size:12px; line-height: 1.5; max-height: inherit; word-break: break-all; }
	.grade,
	.grade:before  { width:80px; height: 13px; background-size:80px 13px; }
	.grade-box strong { font-size:12px; }
	
	.board-btns a { display: block; width:auto;}
	
	.inp,
	.select { height: 30px; padding-left: 10px; font-size:12px; }
	.btn-type1,
	.btn-type2,
	.btn-type3,
	.btn-type4 { height: 30px; font-size:12px; line-height: 28px; width:80px;  }
	.checkbox + p span { font-size:11px; margin-left: 4px; }
	
	
	.pagenate { margin:20px 0 40px; }
	.pagenate a { width:22px; height: 22px; font-size:12px; margin:0 1px;line-height: 20px;  }
	.search-box { display: flex; justify-content: center; padding:20px; }
	.search-box form { display: flex; justify-content: center;  }
	.search-box .select { flex:0 0 80px; }
	.search-box .inp { flex: 1; width:100%; margin:0 5px; }
	.search-box .btn-type1 { flex:0 0 60px; }
	.gallery-list ul li { width:50%; }
	.gallery-list2 ul li { width:33.3333%; }
	.board-view .view4 { padding:30px 0;}
	.board-view .view4 .box { display: block; }
	.board-view .view4 .box .slider { width:auto; max-width:100%; margin: 0 auto 30px; padding:0 10px; }
	.board-view .view4 .slider .swiper-pagination { padding-top:10px; }
	.board-view .view4 .box .text { width:auto; font-size:13px; line-height: 1.6; }
	.table2 table tbody th { font-size:12px; }	
	.table2 table tbody td { padding:10px; font-size:12px; }
	.board-view .view4 .slider .swiper-pagination { bottom:10px; }
	.board-view .view4 .box .slider .swiper-pagination-bullet { width:8px; height: 8px; }
	.board-view .view4 .box .slider .swiper-pagination-bullet-active { width:20px; }
	.board-view .reser { margin-top:25px; }
	.board-view .reser a { width:150px; height: 30px; font-size:12px; line-height: 30px;}
	.board-view .view3 .box { display: flex; flex-direction: column-reverse; }
	.board-view .view3 .box .poster { padding:40px 20px; }
	.board-view .view3 .box .table2 { margin-bottom: 30px; }
	.board-view .view3 .table2 table tbody td { height: 40px; }
	.table2 .list dl dt { font-size:12px; }
	
	.table1 { margin-bottom: 30px; }
	.table1 table tbody th { font-size:12px; padding:0 10px; white-space: nowrap;}
	.table1 table tbody td { font-size:12px; padding: 5px;  }
	.table1 table tbody td .inp-box { display: flex; justify-content: space-between; position: relative; margin-right:0;}
	.table1 table tbody td .inp { width:100% !important; }
	.table1 table tbody td .inp-box .inp {flex:1; width:100% !important; }
	.table1 table tbody td .inp-box .inp + button { margin-left: 5px; }
	.table1 table tbody td .addr1 .btn-type3 { width:90px; }
	.table1 table tbody td .addr2 .inp { width:calc(50% - 3px) !important; }
	.table1 table tbody td .desc { font-size:11px; }
	.table1.responsive table,
	.table1.responsive table tbody,
	.table1.responsive table tbody tr,
	.table1.responsive table tbody th,
	.table1.responsive table tbody td { display: block;}
	.table1.responsive table tbody tr { overflow: hidden; }
	.table1.responsive table tbody th { float:left; width:28%; height: 42px; line-height: 41px; }
	.table1.responsive table tbody td { float:left; width:72%; height: 42px;  }
	.td-div1 { display: block; }
	.td-div1 p { margin-left: 0; padding-top:10px; }
	
	.btn-box1 a { width:90px; }
	
	.find-map-wrap { position: relative; top:0; }
	.find-map-wrap .map { height: 400px; }
	.find-map-wrap .markers { left: 20px; top:20px; width:90px; }
	.find-map-wrap .markers button { height: 30px; font-size:10px;  }
	.find-map-wrap .markers button img { width:11px; }
	.find-map-wrap .list-box { position: static; width:auto; }
	.find-map-wrap .list-box .head { height: 80px; padding-top:15px;  }
	.find-map-wrap .list-box .head span { font-size:10px; }
	.find-map-wrap .list-box .head p { font-size:20px; }
	.find-map-wrap .list-box .head:before { left: 20%; width:39px; background-size:39px auto; }
	.find-map-wrap .list-box .srch { height: 70px; }
	.find-map-wrap .list-box .srch select { height: 30px; font-size:12px; padding-left: 10px; background-size:10px auto; }
	.find-map-wrap .list-box .list { height: auto; padding:15px; }
	.find-map-wrap .list-box .list ul li { margin-bottom: 15px; }
	.find-map-wrap .list-box .list ul li .item .img { flex:0 0 100px; margin-right:10px;}
	.find-map-wrap .list-box .list ul li .item .img img { width:100%; height: 100px;}
	.find-map-wrap .list-box .list ul li .item .img a { height: 35px; line-height: 34px; font-size:12px; }
	.find-map-wrap .list-box .list ul li .item .img a:before { background-size:12px auto; width:12px ; height: 20px; background-position: 50% 50%; }
	.find-map-wrap .list-box .list ul li .info { padding:8px 0; min-width:0; }
	.find-map-wrap .list-box .list ul li .info .t1 { font-size:13px; margin-bottom: 4px; }
	.find-map-wrap .list-box .list ul li .info .t2 { font-size:12px; padding-bottom: 7px; margin-bottom: 7px; }
	.find-map-wrap .list-box .list ul li .info .t3 { font-size:11px; height: auto; overflow: hidden; line-height: 1.4;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2; }
	.find-map-wrap .list-box .list ul li .info .tel { font-size:11px; }
	
	.sub-wrap { padding-top:30px; }
	.h4-member { font-size:16px; margin-bottom: 7px; }
	.member .h3 { margin-bottom: 30px; }
	.member .prv {max-height: 140px !important; font-size:11px; margin-bottom: 10px; padding: 10px; }
	.member .agree { margin-bottom: 25px; }
	
	.edu-title { padding:10px; border-width:5px; margin-bottom: 15px; display: block; }
	.edu-title strong { display: block;  font-size:18px; }
	.edu-title p { font-size:12px; }
	
	.calendar1 .year { margin-bottom: 12px; }
	.calendar1 .year strong { font-size:30px; }
	.calendar1 .year button img { width:10px; }
	.calendar1 .types { margin-bottom: 12px; }
	.calendar1 .types div { margin:0 6px; font-size:13px;  }
	.calendar1 .types div i { width:12px; height: 12px; }
	.table-calendar1 table thead th { font-size:12px; height: 35px; }	
	.table-calendar1 table tbody td { height: 70px; font-size:11px; padding: 5px 2px; }
	.table-calendar1 table tbody td .num { padding-right:5px;}
	.table-calendar1 table tbody td ul li a { height: 20px; line-height: 20px; font-size:10px; padding:0 2px; }
	
	.board-view .qna .q { padding:20px 20px 20px 50px; }
	.board-view .qna .q .anw { left: 15px; top:16px; font-size:25px;  }
	.board-view .qna .q .txt { font-size:12px; }
	.reserve .tit { font-size:13px; padding: 10px; margin-bottom: 15px; }
	.reserve .msg { padding: 35px 10px; margin-bottom: 30px; }
	.reserve .msg .t1 { font-size:20px; margin-bottom: 15px; }
	.reserve .msg .t2 { font-size:12px; }
	
	.btn-box1 a,
	.btn-box1 button { width:90px; }

	.calendar2 { display: block; margin-bottom: 35px; }
	.calendar2 .left,
	.calendar2 .right { width:auto; }
	.calendar2 h4 { height: 35px; line-height: 33px; border-bottom-width:2px; font-size:14px; }
	.calendar2 .box { padding-bottom: 10px; }
	.calendar2 .box .year { height: 50px; margin-bottom: 10px; }
	.calendar2 .year strong { font-size:22px; margin:0 10px;  }
	.calendar2 .year button { padding:5px 3px 7px;}
	.calendar2 .year button img { width:9px; }
	.table-calendar2 table thead th,
	.table-calendar2 table tbody td { font-size:11px; }
	.table-calendar2 table tbody td { height: 50px; }
	.table-calendar2 table tbody td .num span { width:30px; height: 30px; font-size:11px;}
	.table-calendar2 table tbody td .num:after { font-size:11px; }
	.calendar2 .right .box { padding: 15px; display: flex; flex-wrap: wrap; flex-direction: row; justify-content: flex-start; }
	.calendar2 .right .box label { width:50%; margin-bottom: 10px; }
	.calendar2 .right .checkbox + p span { font-size:11px; }
	.calendar2 .right .checkbox + p em { width:16px; height: 16px; }
	
	.member-wrap { padding:50px 20px; }
	.member-wrap .login-box { border-radius:20px; padding: 30px; }
	.member-wrap .login-box h3 { font-size:20px; margin-bottom: 7px;}
	.member-wrap .login-box .desc { font-size:12px; margin-bottom: 20px; }
	.member-wrap .login-box .inp-member { height: 45px; font-size:12px; padding-left: 10px; }
	.member-wrap .login-box .btn-login { height: 50px; font-size:15px; }
	.member-wrap .login-box .agree { padding:10px 0 10px 10px; }
	.member-wrap .login-box .btn-join { height: 50px; line-height: 44px; border-width:2px; font-size:15px; }
	.member-wrap .login-box .lost { font-size:10px; font-size:12px; margin-bottom: 20px; }
	.member-wrap .login-box h4 strong { padding:0 10px; font-size:14px; }
	.member-wrap .login-box .socials a { width:22%; font-size:11px; }
	.join-end { margin:50px 20px; padding:40px 20px;  }
	.join-end h3 { font-size:20px; }
	.join-end .desc {font-size:12px; }
	.member-wrap .login-box .inp-box { margin-bottom: 5px; }
	.member-wrap .login-box .inp-box.type2 {padding-right:26px; margin-bottom: 15px;}
	.member-wrap .login-box .inp-box.type2 .capt { flex:0 0 90px;  background: #fff;}
	.member-wrap .login-box .inp-box.type2 .capt img { width:100%; height: 100%;}
	.member-wrap .login-box .inp-box.type2 button img { height: 22px; }
	.member-wrap .login-box .alert { font-size:12px; margin-bottom: 30px; }
	.terms { padding: 10px; font-size:12px; }
	
	.guide article { padding:25px 15px; display: block; }
	.guide article .img { margin:0 10px; }
	.guide article .info { padding-top:30px; text-align: center; }
	.guide article .info .step { margin: 0 auto; text-align:left; }
	.guide article .info h5 { font-size:20px; margin:10px 0;}
	.guide article .info p { font-size:12px; width:70%; margin: 0 auto; }
	
	.comment-box { margin:30px 0 15px; padding:15px;  }
	.comment-box .tit { font-size:16px; }
	.comment-box .writes .textarea { height: 120px; }
	.comment-box .writes .btn-submit { width:80px; font-size:13px; }
	.comment-box .list { margin:20px 0 10px; }
	.comment-box .list .article .head .name strong { font-size:14px; }
	.comment-box .list .article .head .name span { font-size:12px; }
	.comment-box .list .article .head .btns a { font-size:12px; }
	.comment-box .list .article .body { font-size:13px; }
	
	.product-tabs .btn-dep1 { font-size:14px; }
	.product-tabs .dep2 .btn-dep2 { font-size:12px; }
	.product-sort h4 { font-size:18px; }
	.product-sort .sort ul li a { font-size:13px; }
	.prd-search-msg { margin:15px 0; font-size:14px; }
	.prd-search { padding:15px 10px; margin-bottom: 20px; }
	.prd-search strong { font-size:14px; }
	.prd-search .inp-box { width:auto; flex: 1; }
	.prd-search .inp-box .inp { height: 40px; font-size:14px;  padding-right:40px;}
	.prd-search .inp-box .btn-srch { right:0; width:40px; height: 40px; font-size:22px; }
	
	
	.product-head { display: block; }
	.product-head .thum { width:auto; margin-bottom: 30px; }
	.product-head .thum .large .label { background-size:70px auto; }
	.product-head .info { width:auto; }
	.product-head .info .t1 { font-size:12px; padding-top:8px;  }
	.product-head .info .t2 { font-size:18px; margin-bottom: 15px;  }
	.product-head .info .opt dl { font-size:12px;  margin-bottom: 10px;}
	.product-head .info .opt dl dt { width:65px; }
	.product-head .info .opt .files li a { width:60px; height: 25px; line-height: 24px; font-size:12px; }
	.product-head .info .btns { margin:0 -2px 20px;}
	.product-head .info .btns a { height: 45px; line-height: 43px; font-size:15px; margin:0 2px; }
	.product-head .info .title { margin-bottom: 5px; }
	.product-head .info .title .right a { width:70px; height: 25px; line-height: 23px; font-size:13px; }
	.product-head .info .list { padding:15px; }
	.product-head .info .list li { font-size:12px; padding-right:70px; }
	.product-detail .tabs2 { margin:30px 0 20px; }
	.product-detail .tabs2 p { flex: 1 1 25%; }
	.product-detail .tabs2 p:nth-child(4) { border-top:0; border-left: 1px solid #e5e5e5;}
	.product-detail .tabs2 a { font-size:12px; }
	.product-detail .tit-head { margin-bottom: 15px; }
	.product-detail .h4-prd { font-size:25px; letter-spacing: 4px; }
	.product-detail .tit-head .right a { width:100px; height: 30px; line-height: 29px; font-size:13px; }
	.prd-reviews ul li > a { padding:10px 10px 10px 100px; line-height: 20px; font-size:12px; }
	.prd-reviews ul li > a .grade { left: 10px; top:15px; transform: translateY(0); }
	.prd-reviews ul li > a .txt-box { display: block; }
	.prd-reviews ul li > a .etc div { padding-left: 15px; margin-left: 14px; }
	.prd-reviews ul li > a .etc div:first-child { padding-left: 0; margin-left: 0; }
	.prd-reviews ul li .a .box { padding:20px; display: block; }
	.prd-reviews ul li .a .slider { width:auto; margin-bottom: 10px;  }
	.prd-reviews ul li .a .text { margin-left: 0; font-size:12px; }
	.prd-reviews .swiper-pagination-bullet { width:6px; height: 6px; }
	.prd-reviews .swiper-pagination-bullet-active { width:20px !important;}
	.product-detail .h4-prd small { display: block; font-size:13px; margin-left: 0;}
	.prd-information .box { display: block; padding:15px 5px; }
	.prd-information .tit { display: block; width:auto; background: none; font-size:15px; font-weight: 600; color: #000; text-align: left; }
	.prd-information .text { padding: 0; font-size:12px; }
	.prd-information .text strong { font-size:15px; }
	.prd-information .text p { padding-left: 8px; text-indent: -8px; }
	.textarea { font-size:13px; }
	.modal-orders .tit { font-size:13px; margin-bottom: 10px; }
	.modal-orders ul li { padding-left: 40px; }
	.modal-orders ul li label { left: 10px; }
	.modal-orders ul li .info { font-size:13px; }
	.modal-orders ul li .info div  p { display: block; }
	.modal-orders ul li .info div  p + p { margin-left: 0; }
	.modal-orders ul li .info div + div { margin-top:0; }
	
	.about .box1 ul li{ width:calc(50% - 10px); margin: 0 5px 20px;; }
	/*.about .box1 ul li:nth-child(n+3) { width:calc(33.33333% - 10px); margin:0 5px 20px; }*/
	.about .box1 ul li .tit { padding:15px; font-size:14px; height: 50px; display: flex;  align-items: center; }
	.about .box1 ul li .info { padding:10px; }
	.about .box1 ul li .info .t2 { font-size:12px; letter-spacing: -1px; margin:10px 0; }
	.about .box1 ul li .info .t3 { font-size:12px; letter-spacing: -1px;  }

	.temp-btns a { padding:0 25px; height:50px; line-height:49px; font-size:16px; }
	.temp-btns a img { height:20px; }
	
}





@media all and (max-width:767px) {
	.gallery-list ul { margin: 0;}
	.gallery-list ul li { width:auto; padding: 0; margin-bottom: 20px;  }
	.gallery-list ul li a .info { padding: 15px; }
	.gallery-list ul li a .info .t1 { font-size:15px; margin-bottom: 8px;}
	.gallery-list ul li a .info .t2{ font-size:12px; line-height: 1.5; height: auto; }
	.gallery-list ul li a .info .t3 { font-size:12px; margin-top:15px; }
	.tabs2 { flex-wrap: wrap;margin:20px 0 15px;  }
	.tabs2 p { flex: 1 1 33.333%; }
	.tabs2 p:nth-child(n+4) { border-top:1px solid #e5e5e5;}
	.tabs2 p:nth-child(4) { border-left: 0; }
	.gallery-list2 ul { margin:0 -10px; }
	.gallery-list2 ul li  { width:50%; padding:0 10px 20px; }
	.gallery-list2 ul li .item .info { padding:10px 15px; }
	.gallery-list2 ul li .item .info .t1 { font-size:13px; }
	.gallery-list2 ul li .item .info .t2 { font-size:12px; padding-bottom: 8px; margin-bottom: 8px;  }
	.gallery-list2 ul li .item .info .t3 { font-size:11px;  overflow: hidden; line-height: 1.4;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-box-orient: vertical;  -webkit-line-clamp: 2;height: auto; }
	.gallery-list2 ul li .item .info .tel { font-size:11px; }
	.gallery-list2 ul li .item .info .btn { height: 30px; line-height: 30px; font-size:12px; }
	.gallery-list2 ul li .item .info .btn:before { background-size:12px auto; width:12px; height: 22px;  background-position: 50% 50%; }
	
	.product-tabs{  position: relative; margin-bottom: 25px; }
	.product-tabs > ul { flex-wrap: wrap; }
	.product-tabs > ul > li { flex:1 1 33.333%}
	.product-tabs > ul > li:nth-child(4) { border-left: 0; }
	.product-tabs > ul > li:nth-child(n+4) .btn-dep1:before { display: none; }
	.product-tabs .btn-dep1 { height: 34px; line-height: 33px; font-size:13px; }
	.product-tabs .dep2 { display: none; }
	.product-tabs .select { margin-top:10px; width:100%; height: 35px; }
	.product-sort { margin-bottom: 20px; }
	.product-sort .sort button { display: inline-block; width:120px; text-align: left; padding-left: 10px; height: 30px; border: 1px solid #e5e5e5; font-size:12px; background: url(../img/common/bu_select.png) no-repeat right 50% ; background-position: right 10px center;}
	.product-sort .sort ul {  position: absolute; right:0; width:120px; top:31px; display: none; padding:10px 0; background: #fff; border: 1px solid #e5e5e5; z-index:2; box-shadow:3px 3px 8px rgba(0,0,0,0.1);  }
	.product-sort .sort ul li { padding-left: 0; margin-left: 0; }
	.product-sort .sort ul li:before { display: none; }
	.product-sort .sort ul li a { display: block; font-size:13px; line-height: 25px;  padding:0 10px; text-align: left; }
	.product-sort .sort ul li a.active { background: #f2f2f2;}
	
	.modal-body { padding:15px; }
	.modal .textarea { height: 150px; }
	.modal .table1 colgroup { display: none;}
	.modal-header h4 { font-size:18px; }
	.cart-msg { padding-left: 0; padding-right:0;}
	.cart-msg .txt { font-size:13px; }
	.cart-msg .txt:before { width:50px; height: 50px; flex: 0 0 50px; background-size:10px auto; }
	.modal-txt1 { font-size:13px; margin-bottom: 15px; }
	.file-up span { display: block; }

	/* 팝업레이어 (반응형) */
	#hd_pop {z-index:1000;position:relative;margin:0 auto;width:100% !important;height: auto !important;}
	.hd_pops {position:absolute;border:1px solid #e9e9e9;background:#fff;top:0px !important;left:0px !important}
	.hd_pops_con {width:100% !important;height: auto !important;}
}





.upload-file .upload-name {display: inline-block;height: 40px;padding: 0 10px;vertical-align: middle;border: 1px solid #dddddd;width: 78%;color: #999999;}
.upload-file .bf_file_label {display: inline-block;padding: 10px 20px;color: #fff;vertical-align: middle;background-color: #999999;cursor: pointer;height: 40px;margin-left: 10px;}
.upload-file input[type="file"] {position: absolute;width: 0;height: 0;padding: 0;overflow: hidden;border: 0;}

.modal textarea{border: 1px solid #e5e5e5;}

.prd-cont1 iframe{width:100%;}

.chk_box {list-style:none;}

#bo_v_con {border-bottom: 1px solid #e5e5e5;}

.fa-folder-open{display:none;}