@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700;900&display=swap');
/*카페24시써라운드,에어*/
@font-face {
    font-family: 'Cafe24Ssurround';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Cafe24SsurroundAir';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24SsurroundAir.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
   font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 300;
   src: url('../font/GmarketSansTTFLight.woff') format('woff'),
		url('../font/GmarketSansLight.otf') format('opentype');
 }
 @font-face {
   font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 500;
   src: url('../font/GmarketSansTTFMedium.woff') format('woff'),
		url('../font/GmarketSansTTFMedium.otf') format('opentype');
 }
@font-face {
   font-family: 'Gmarket Sans';
   font-style: normal;
   font-weight: 700;
   src: url('../font/GmarketSansTTFBold.woff') format('woff'),
		url('../font/GmarketSansBold.otf') format('opentype');
 }

/*reset*/
* {margin:0;padding:0}
body,html {margin:0;padding:0;width:100%;font-family: 'Noto Sans KR', sans-serif;}
li {list-style:none}
a {text-decoration:none;color:#000}
.img-responsive {display:block;width:100%;}
body, h1, h2, h3, h4, h5, h6, p, ul, li, a, span {margin:0; padding:0; word-break:keep-all;}
sup{font-size:0.7em;}
b{color:#000;}
/*폰트적용*/
.logo, header .vol, .lnbline .lnb_tit, .g_menu {font-family:'Cafe24SsurroundAir', sans-serif;}
.con_title, .con_title2, .con_title3, .sub_title, .subcon_tit {font-family:'Gmarket Sans', sans-serif; font-weight: 500;}
.cate .item, .con_stitle, .con_stitle2, .othermenu .left span{font-family:'Gmarket Sans', sans-serif; font-weight:500}
.des {font-family: 'Noto Sans KR', sans-serif;}

/*br class*/
.pc{display:block}
.mobile{display:none}
.br768 {display:none}
.br570 {display:none}
.br428 {display:none}
.br390 {display:none}

/*inside*/
.menubox{display:none}

/*header*/
header {width:100%;padding:1.5% 0 3.5% 0;position:relative;overflow:hidden;margin:0;z-index:99}
header .logo {position:absolute;left:5%;font-size:52px;top:20%;z-index:999;}
header .logo a {color:#ec6867;}
header .logo p {font-size:14px;color:#ec6867;font-family:'Noto Sans KR', sans-serif;font-weight:300;}
header a.vol {position:absolute;z-index:100;right:5%;top:33%;border:1px solid #dd8483;border-radius:30px;font-size:17px;color:#dd8483;width:250px;padding:0.7% 0;text-align:center}
header a.vol02 {position:absolute;z-index:100;right:19%;top:33%;/*border:1px solid #ec6867;*/border-radius:30px;font-size:17px;color:#fff;width:250px;padding:0.7% 0;text-align:center;background:#dd8483;}

#open_btn {position:absolute;right:0;}
header .gnb {margin:0 auto;width:35%;height:100%;text-align:center;overflow:hidden;}
header .gnb ul li {width:33.33%;float:left;font-size:24px;margin-top:3.5%;}
header .gnb ul li a {color:#000}
/*gnb*/
.side {position:absolute;z-index:99;display:none;width:100%;padding-bottom:1.5%;background-color:#fff;} 
.side ul {width:35%;margin-left:32.5%;margin-top:-30px;border-top:1px solid #ccc;padding:1.5% 0} 
.side ul li{width:33.33%;float:left;} 
.side ul li a {display:block;text-align:center;font-size:16px; font-weight:500;color:#000;letter-spacing:-0.5px;padding:4% 0;} 
.side ul li a:hover {color:#ec6867} 
aside {display:none;transition:0.2s;position:fixed;z-index:9998;width:100%;top:0;left:100%;box-shadow:30px 1px 30px #777;border-bottom:1px solid #f1f1f1;z-index:999;background-color:#fff;padding:3% 0} 
/*체크박스지우기+작동css*/
#open_ck {display:none}
#close_ck {display:none;} 
#open_ck:checked + aside { left: 0; }
#close_ck:checked + aside { left: -100%; }
/*open,close버튼셋팅*/
#open_btn {display:none;position:fixed;z-index:99;top:50px;right:5%;text-align:center;}
#close_btn {position:absolute;top:5%;right:5%;text-align:center;}
/*Mobile(aside) menu*/
.lnbline {width:100%;height:100%;text-align:center;margin-left:30px;}
.lnb_tit {display:block;width:85%;margin:2% auto;font-size:20px;text-align:left;line-height:200%;border-bottom:1px solid #ececec }
.lnb_tit a {color:#ec6867;}
.m_subm {margin:2% 0 4% 0;} 
.m_subm li { display:block;text-align:left;line-height:26px;text-indent:20px;}
.m_subm li a {width:90%;display:block;font-size:15px;text-indent:40px;color:#2b2b2b;}
.m_subm li a:active { color:#ec6867;}

/*category*/
.cate{display: flex;justify-content:center;}
.cate.left{display: flex;justify-content:left;float:left}/*카테고리가왼쪽으로갈때*/
.item .white {color:#fff;}
.cate .item{width: auto;font-size:24px;color:#ec6867;margin: 0 0 0 2px;line-height:180%;}
.cate .item span {font-size:24px;}
.cate img {width:80%;height:auto;margin-top:5px}
.catebox{margin-bottom:2%;}
#sec5 .catebox{margin-bottom:0;margin-top:1.5%}

/*공유하기*/
.snsWrap{clear:both; width:100%;margin:5% 0;}
.snsWrap p{text-align:center;margin-bottom:1%;color:#707070}
.share-btn{display: flex;justify-content:center;}
.share-btn img{margin: 0 10px;}

/*top button*/
.top_bt {position:fixed;right:5%;bottom:7%;background:#ec6867;z-index:50;width:50px;height:50px;border-radius:50%;color:#fff;
line-height:300%;text-align:center}

/*footer*/
footer {width:100%;background:#2b2b2b;text-align:center;padding:5% 0}
footer .sns_bt {margin:0 auto;text-align:center}
footer .sns_bt p{width:60px;margin:0 10px;display:inline-block;}
footer .ft_logo {clear:both;display:block;margin:3% auto 1% auto}
footer .copy {color:#afafaf;font-size:14px}






@media screen and (max-width:1680px) {
.side {padding-bottom:3%;} 
.cate .item {line-height:175%}
header a.vol{width:200px;font-size:14px}
header a.vol02{width:200px;font-size:14px}
}

@media screen and (max-width:1440px) {
/*category*/
.cate .item{font-size:24px;margin: 0 0 0 0px;line-height:170%}
.cate .item span {font-size:24px;}
.cate img {width:75%}
	header a.vol02{right:21%}
	header .gnb {margin-left:24%}
}

@media screen and (max-width:1366px) {
}

@media screen and (max-width:1280px) {
/*header*/
header .logo {font-size:35px;}
header .gnb ul {width:40%}  
header a.vol02{right:23%}
/*gnb*/
header .gnb {width:100%;margin-left:22%}
/*side css*/
.side ul {width:45%;margin-left:27.5%} 
/*sub05*/
#sec5 .catebox {margin-top:5px}
}

@media screen and (max-width:1200px) {
/*header*/
header .gnb, .side {display:none}
#open_btn {display:block;top:44px}
#close_btn img{width:80%;}
header{height:70px}
header a.vol {right:10%;top:35px;width:250px}
header a.vol02{right:33%;top:35px;width:250px}

/*aside*/
aside {display:block;}
.lnb_tit {margin:2% 0}
.m_subm {margin:1% 0}
}

@media screen and (max-width:1024px) {
/*category*/
.cate .item{font-size:21px;}
.cate .item span {font-size:21px;line-height:195%}
.cate.left .item span {font-size:21px;margin-left:-5px}
/*aside*/
.m_subm {margin:2% 0 3% 0}
/*header*/
header .logo {font-size:30px}
header a.vol {width:230px;top:40px;right:11%;font-size:13px;}
header a.vol02{right:35%;top:40px;width:230px}

#open_btn {top:47px}
/*footer*/
footer .sns_bt p{width:50px;margin:0 5px}
footer .sns_bt p img {width:100%;display:block}
footer .ft_logo {width:180px;display:block}
}

@media screen and (max-width:900px) {

/*category*/
.cate.left .item{font-size:16px;margin: 0 0 0 -5px;line-height:220%;}
.cate.left .item span {font-size:16px;}
.cate.left img {width:60%}
.cate .item{font-size:16px;margin: 0px;line-height:220%;}
.cate .item span {font-size:16px;}
.cate img {width:60%;height:auto;}
#sec5 .catebox {margin-top:5px}
header a.vol {width:200px;top:40px;right:11%;font-size:13px;}
header a.vol02{right:37%;top:40px;width:200px}
}
/*811px-768px-571px*/
@media screen and (max-width:768px) {
/*br class*/
.br768 {display:block}
/*header*/
header .logo {top:23px}
header a.vol {width:200px;right:11.5%;top:28px;font-size:12px;}
header a.vol02{right:39%;top:28px;width:200px;font-size:12px;}
#open_btn {top:30px}
#close_btn {top:3.8%;}
/*top button*/
.top_bt {bottom:5%;width:40px;height:40px;line-height:250%}
/*cate*/
.cate.left .item{line-height:210%;}
.cate .item{line-height:200%;}
}

@media screen and (max-width:570px) {
/*br class*/
.pc{display:none}
.mobile{display:block}
.br570 {display:block}
/*header*/
header {height:65px;padding:0}
header .logo {padding:0;top:15px;font-size:28px;}
header .logo p {display:none;}
header a.vol {display:none;}
header a.vol02{right:25%;top:15px;width:200px;font-size:13px;}
#open_btn {top:22px;}
.lnb_tit {width:75%;}
.m_subm {margin:1% 0 5% 0}
.m_subm li a {text-indent:10px}
/*category*/
.cate .item {margin:0 0 0 -3px}
.cate.left{justify-content:center;float:none}/*카테고리가왼쪽으로갈때*/
.cate.left .item{font-size:18px;margin:0 0 0 2px;line-height:190%;}
.cate.left .item span {font-size:18px;}
.cate .item{font-size:18px;line-height:190%;}
.cate .item span {font-size:18px;}
/*section3전용 category*/
.catebox.small .cate .item{font-size:18px;margin:0 0 0 -3px;}
.catebox.small .cate .item span  {font-size:18px;line-height:190%;}
.catebox.small .cate img {width:60%;}
/*footer*/
footer .sns_bt p{width:40px;height:40px;margin:0 5px}
footer .ft_logo {width:150px;display:block}
}

@media screen and (max-width:475px) {
/*header .vol {margin-right:17%;padding:1.3% 3%;font-size:12px;}*/
}

@media screen and (max-width:428px) {
/*br class*/
.br428 {display:block}
/*top button*/
.top_bt {width:35px;height:35px;line-height:300%;font-size:12px;right:6%}
.snsWrap {padding:5% 0}
/*footer*/
footer .copy {margin:3% 15% 0 15%}
header a.vol02{right:20%}

}

@media screen and (max-width:390px) {
.br390 {display:block}
}

@media screen and (max-width:375px) {
}

@media screen and (max-width:360px) {
}