@charset "utf-8";

/* 프로그램리스트 모바일 버전 */
.all_m_btn {padding:10px; background:#323337;}
.all_m_btn img {position:absolute; top:28%; left:15px; width:10%; max-width:40px; cursor:pointer;}
.all_m_btn .mutit {text-align:center; font-weight:900; font-size:26px; color:#fff;}
.pro_m_wrap {display:none; font-family:'Nanum Gothic', sans-serif; transition:all 0.3s linear;}

.pro_m_wrap .m_menu {width:200px;}
.pro_m_wrap .bg_black {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.7); z-index:-1;}



.pro_m_wrap .subleftmenu {
	list-style:none;
	margin:0;
	padding:0;
}
.pro_m_wrap .subleftmenu li {
	border-bottom:1px solid #515155;
	background:#323337;
}
.pro_m_wrap .subleftmenu a {
	display:block;
	color:#b5b2b2;
	font-size:14px;
	padding:11px 5px 11px 15px;
	font-family:'Noto Sans KR';
}
.sub_title_m{
	font-size:28px !important;
	font-weight:bold;
	color:#fff !important;
	padding:12px 5px 12px 15px !important;
}
.pro_m_wrap .subleftmenu a:hover {
	background:#307dd4;
	color:#fff;
}
.sub_title_m:hover {
	background:#323337 !important;
	cursor:default;
}

@media all and (max-width:999px){
	.pro_m_wrap {display:block; position:absolute; left:-100%; top:0; z-index:999;}
	.pro_m_wrap.view {left:0;}
}



/* ==========================================================================
	테마공통 inner, 폰트
========================================================================== */
.inner {width:100%; max-width:1400px; margin:0 auto; position:relative;}

@media all and (max-width:1400px){
	.inner {width:93.75%;}
}

.muil{font-family: 'Muil';}
.notoSerif{font-family: 'Noto Serif KR', sans-serif;}
.sans{font-family: 'Noto Sans KR';}
.robo{font-family: 'Roboto', sans-serif;}
/* ==========================================================================
	bakery
========================================================================== */

/* header */
#header{position:relative; margin: 0 auto; padding: 0 50px; box-sizing: border-box; width:100%; max-width:1920px; height:110px; display: flex; align-items: center; justify-content: flex-end; z-index:100; background:rgba(255,255,255,1);}
#header a.logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#header a.logo img{scale: 1.3; }
#header .left{z-index:2; position:absolute; left:50px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#header .m_btn{display:inline-block ; vertical-align: middle; margin-left: 20px; width: 30px;}
#header .m_btn i{display: block; background-color:  #222; width: 100%; height: 3px;}
#header .m_btn i + i{margin-top: 7px; width: 85%; }
#header .gnb ul:after{clear:both; content:""; display:block; height:0; visibility:hidden}
#header .gnb ul li{float:left; margin-right:20px;}
#header .gnb ul li a{padding:0 10px; display:block; font-size:18px ;color:#222; letter-spacing:0em; font-weight:500;}
#header .right{position: relative;}
#header .right ul{font-size:0; letter-spacing:-4px; display:inline-block; vertical-align:middle;}
#header .right ul li{display:inline-block; vertical-align:middle;}
#header .right ul li a{position:relative;}
#header .right ul.text_btn li a{display:block; font-size:16px; color:#aaa; letter-spacing:-0.025em; font-weight:300; padding:0 15px;}
#header .right ul.text_btn li a img{display:inline-block; vertical-align:middle; position:relative; top:-2px; margin-left:4px;}
#header .right ul.icon_btn li{padding:0 10px;}
#header .right ul.icon_btn li a{display:block;}
#header .right ul.icon_btn li a span{position:absolute; right:-4px; bottom:-4px; text-align:center; line-height:17px; min-width:17px; max-width:25px; height:17px; background:#fff; border-radius:100px; font-size:16px; color:#444444; letter-spacing:-0.205em; font-weight:400; padding:0 2px 0 0}

#header .hide,
#m_menu .hide{display: none;}

@media all and (max-width:1400px){
	#header .left{left:20px;}
	#header .left .gnb ul li{margin-right:10px;}
}
@media all and (max-width:1000px){
	#header{padding: 0 30px;}
	#header .left .gnb{display:none}
	#header .left .m_btn{display:block}
	#header .right ul.text_btn{display:none}
}


/* bakery_header_m_menu */
.m_menu_bg{width: 100%; z-index: 100; display: none; height: 100vh; background-color: rgba(0,0,0,0.3); position: fixed; top: 0; left: 0;}
#m_menu{position:fixed; right: -100vh; top:0; width:100%; max-width: 520px; height:100%; z-index:101; background:#fff; overflow-y:auto;}
#m_menu .top{background:#fff; height:110px; position:relative;}
#m_menu .top a.x_btn{z-index:2; position:absolute; left:20px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#m_menu .top a.x_btn img{filter: invert(1);}
#m_menu .top a.setting_btn img{filter: invert(1);}
#m_menu .top a.logo{z-index:2; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%);}
#m_menu .top a.setting_btn{z-index:2; position:absolute; right:20px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#m_menu .btn_wrap{display: none; border-top:1px solid #eee; border-bottom:1px solid #eee;}
#m_menu .btn_wrap ul:after{clear:both; content:""; display:block; height:0; visibility:hidden}
#m_menu .btn_wrap li{width:50%; float:left;}
#m_menu .btn_wrap li a{display:block; border-right:1px solid #eee; height:80px; line-height:80px; text-align:center; font-size:18px; color:#aaa; letter-spacing:-0.025em ;font-weight:400;}
#m_menu .btn_wrap li:last-child a{border-right:0;}
#m_menu .search_box{width:100%; height:80px; background:#fff; position:relative; box-shadow:0px 9px 16px rgba(28,24,20,0.1)}
#m_menu .search_box input{border:0; width:100%; height:100%; padding:0 20px; box-sizing:border-box; font-size:18px; color:#444; letter-spacing:-0.045em;}
#m_menu .search_box input::placeholder{color:#888888}
#m_menu .search_box a{display:block; position:absolute; right:20px; top:50%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#m_menu .gnb{padding:40px 20px; box-sizing:border-box;}
#m_menu .gnb > ul > li{margin-bottom:10px;}
#m_menu .gnb > ul > li > a{display:block; border:1px solid #eee; font-size:24px; color:#444444; height:75px; line-height:73px; letter-spacing:0em; font-weight:500; padding-left:20px; box-sizing:border-box; position:relative;}
#m_menu .gnb > ul > li > a span{width:75px; height:75px; position:absolute; right:0; top:0; background:#eee;}
#m_menu .gnb > ul > li > a span i{display:block; width:28px; height:2px; background:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%)}
#m_menu .gnb > ul > li > a span i:before{display:block; content:""; width:2px; height:28px; background:#fff; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%)}
#m_menu .gnb > ul > li ul.depth02{margin-top:-1px; display:none; background:#f9f6f2; border:1px solid #b97d34; padding:10px 20px; box-sizing:border-box;}
#m_menu .gnb > ul > li ul.depth02 li{margin:20px 0;}
#m_menu .gnb > ul > li ul.depth02 li a{display:block; padding:10px 0; font-size:20px; color:#666666; letter-spacing:0em; font-weight:400;}
#m_menu .gnb > ul > li.on > a{border-color:#b97d34; color:#b97d34;}
#m_menu .gnb > ul > li.on > a span{background:#b97d34;}
#m_menu .gnb > ul > li.on > a span i:before{display:none}

#m_menu .gnb > ul > li ul.depth02.hide{display: none;}

@media all and (max-width:1000px){
	#m_menu .btn_wrap{display: block; }
}

/* footer */
#footer{background:#000; padding:70px 0; text-align:center; font-family: 'Noto Sans KR';}
#footer img{filter: invert(1);}
#footer a.ft_logo{display:inline-block; vertical-align:top; margin-bottom:40px;}
#footer ul{font-size:0; letter-spacing:-4px; text-align:center;}
#footer ul li{display:inline-block; vertical-align:top; padding:0 10px; font-size:16px; color:#757575; letter-spacing:-0.025em; font-weight:300; position:relative;}
#footer ul li:before{content:""; display:block; width:1px; height:10px; background:#686868; position:absolute; right:0; top:54%; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -o-transform:translateY(-50%); -moz-transform:translateY(-50%);}
#footer ul li:last-child:before{display:none}
#footer .bot_btn{margin:50px 0 40px;; font-size:0; letter-spacing:-4px;}
#footer .bot_btn a{display:inline-block; vertical-align:top; width:154px; height:42px; border:1px solid #626262; font-size:14px; color:#b8b8b8; letter-spacing:0em; font-weight:300; line-height:40px; margin:0 5px;}
#footer p{font-size:14px; color:#4a4a4a; letter-spacing:0em; font-weight:200;}

@media all and (max-width:640px){
	#sub_footer ul .slick-prev{left:0;}
	#sub_footer ul .slick-next{right:0;}
}