@import url('bbs.css');


@charset "utf-8";
/*color:#1471b4;color:rgb(53,139,130)*/
*{font-family:  'Noto Medium', 'Noto Sans KR', applegothic,sans-serif,arial  ;transition:all 0.3s, font-size none;letter-spacing:-0.05em;border:0;outline:none;font-weight:400;}
html,body{font-size:13px;color:#333;}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:#434343}
a:hover{color:inherit;}
.btnPack.strong, strong {font-weight:300 !important}
img {max-width:100%; vertical-align:top}

/*색상*/
.tcol,.pageNavigation strong,.colorActive,.mobile_menu .btnWrap a:before,.productView .productSaleInfo .mallControlBtn ul li #cartBtn
,.faq_box button,.faq_list dt:before,.faq_list dd span, .History .time 
,.output ul li:nth-child(1), .con0101 h4, section h3.pro span, section h4 span
{color:#1471b4 !important;}
.tcolb,.table_basic,#ajax_body,.productView .productInfo .productImageZoom a:hover,.tmp-select > a:before
,.csBox,.csBox strong i, #leftNaviText ul li .active
{border-color:#1471b4 !important;}
.form-control:focus,.input:focus{border-color:#1471b4 !important;}
.tcolbg,.tb thead tr,#ajax_display .menu_black,.new_login_box .loginbtn,#clNav:hover > div,.subHeader h3,.productTab li.on
,#header .direct li .admin,.fullBan .text a
,.reservation dt,h3.bul:before,.LandInfo .home,.Guide i,.P003 .top span:before, ul.tab_design .on A, section em.round,  #leftNaviText ul li .active, .m_con01 .cell SPAN, .main_tit h4:before
, section .color_box.blue,  .Ochart .boss
{background-color:#0068b7 !important;}
.btnPack.strong,.box:after,.btnPack.blue,.btnPack.red
,.icon li i:before
,.productView .productSaleInfo .mallControlBtn ul li .buyBtn{background-color:#1471b4;}

.tcol2{color:#FFCE08}
.tcolb2{border-color:#FFCE08 !important;}
.tcolbg2
,.banner .bx-pager div a.active,.BanSlide em,{background-color:#FFCE08 !important;}

#wrap {width:100% !important}
#Default .emailContent{background:rgba(53,139,130,0.1);}
#Default .emailContent dt{color:rgba(53,139,130,0.7);}
/*상단메뉴*/
#Menu3 ul li .mlink{color:rgba(255,255,255,1); border-right:1px solid rgba(0,0,0,0.05)}
#Menu3 ul li:first-child .mlink{border-left:1px solid rgba(0,0,0,0.05); }
#Menu3 ul li ul li a{color:rgba(255,255,255,0.8)}

#header:hover .stickmenu{}
#header:hover #Menu3 ul li .mlink{color:rgba(0,0,0,0.8);}
#header:hover #Menu3 ul li:hover .mlink {}
#header:hover #Menu3 ul li:hover ul{}
#header:hover #Menu3 ul li:hover ul li a{ }
#header:hover #Menu3 ul li ul{border-right:1px solid rgba(0,0,0,0.09); }
#header:hover #Menu3 ul li:first-child ul{border-left:1px solid rgba(0,0,0,0.09); }


#header .top_menu {position:absolute; top:-65px; right:15px;}
#header .top_menu a{float:left; margin:0px 7px; color:#777; letter-spacing:0.02em}
.top_menu2 {position:absolute; top:23px; left:15px}
.top_menu2 a{padding:5px 15px;  color:#777; background:#fff; border:1px solid #eee}
.top_menu2 a:first-child{display:none}


.menu_wrap,#header .sticky{background-color:rgba(238,238,238,0.95);}

#footer {background:#4e4e4e; padding:0 !important; position:relative; text-align:center; }
#footer .info { font-size: 14px;  }
#footer .info span:after { display:none }
#footer .info span { padding-right:20px; color: rgba(255,255,255,0.7);}
#footer .info p { line-height:150%}
#footer .info div { padding:20px 0px 20px 0px}
#footer .copy span { padding-right:0px}
#footer .copy_l {position:relative; text-align:center;  padding:1em 0; }
#footer .copy_r {position:relative; float:right;  padding:3em 0}
/*#footer .it p:nth-child(2), #footer .it p:nth-child(3) { display:inline-block; padding-right:10px }*/
#footer .copy_r {padding:2.7em 5%}
#footer .copy_r dt{display:block; font-size:200%; width:200px; font-weight:400; float:left; padding:0em 30px 2em 0}
#footer .copy_r dt span{font-weight:200; color:rgba(255,255,255,0.5); display:block}
#footer .copy_r dd.phone {font-size:150%; font-family:Tahoma; font-weight:600; margin-bottom:10px}
#footer .copy_r dd.phone span {font-size:70%; display:inline-block; width:170px}
#footer .copy_r dd {font-weight:200; }
#footer ul{padding:3em 0 0 0; font-size: 14px;}

/*모바일메뉴*/
.mobile_menu>ul>li>a{}
.mobile_menu>ul>li.open>a,.mobile_menu>ul>li>a:hover{color:#1471b4}
.mobile_menu>ul>li>ul>li>a{}
.mobile_menu>ul>li>ul>li>a:hover{color:}
/*------------------------------------------ Layout ---------------------------------------------------------*/
#wrap, #header, #container, #footer{position:relative;}
#container {background: #fff !important;padding: 0px 0px !important;}

#header{text-align:center; position:absolute; z-index:150}

#header .stickmenu{position:absolute; padding-top:175px;left:0; right:0;text-align:center;background:rgba(255,255,255,1); box-shadow:2px 2px 2px rgba(0,0,0,0.1)}
#header .sticky{padding-top:0px;box-shadow:0 0 5px rgba(0,0,0,0.1);}
#header .stickmenu .logo{display:none}

#header .container{position:relative;z-index:9999;}

#topmn{background:rgba(0,0,0,0.5);overflow:hidden;}
#topmn .container{text-align:right;height:40px;}
#header .direct{overflow:hidden;display:inline-block;height:100%}
#header .direct li{float:left;position:relative;height:100%}
#header .direct li:before{content:'';background:rgba(0,0,0,0.2);width:1px;display:block;position:absolute;top:15px;bottom:15px;left:0;}
#header .direct li:first-child:before{ display:none;}
#header .direct li a{display:block;padding:0 15px;height:100%;line-height:40px;}

#header .logo{position:absolute;width:100%; top:0%; z-index:999; text-align:center; overflow:hidden;}
#header .logo img{vertical-align:middle;max-height:100%;width:auto; padding:33px 0px}
#header .logo:before{content:'';width:120%;height:1px;position:absolute; left:-20%; right:-20%; bottom:0; background:rgba(0,0,0,0.05)}
#header .localNavi:after{content:'';width:153.5%;height:1px;position:absolute; left:-40%; right:-50%; bottom:-66px; background:rgba(0,0,0,0.05)}


#Menu3{ position:relative; width:100%;}
#Menu3 ul{}
#Menu3 ul li {position:relative;text-align:center;}
#Menu3 ul li .mlink {font-size:20px;height:65px;line-height:65px;position:relative;display:block;color:rgba(0,0,0,0.8); padding:0 3px; font-weight:500;  font-family: 'Noto Medium';}
#Menu3 ul li ul,.menu_wrap{width:100%;padding:10px 0;}
#Menu3 ul li ul:after,#Menu3 ul li:first-child ul:before{content:'';position:absolute;right:0;top:0px;bottom:-1px;display:block}
#Menu3 ul li:first-child ul:before{right:auto;left:0}
#Menu3 ul li ul li {display:block;background-image:none;height:30px;text-align:center;}
#Menu3 ul li ul li a {display:block;line-height:30px;padding-left:0px; font-size:16px;height:100%; color:rgba(0,0,0,0.7);font-weight:normal;  font-family: 'Noto Regular';}
#Menu3 ul li ul li a:hover{color:rgba(0,0,0,1);}
#Menu3 ul li em {display:none}

.menu_wrap{box-shadow:0 4px 5px rgba(0,0,0,0.1);} 

#header .Nav{/*position:absolute;left:100%;top:50%;margin-top:-23px;*/text-align:right;display:none;margin:15px 0}
.Nav a{display:inline-block;margin-right:10px;font-size:0;line-height:0;vertical-align:middle; color:#fff}
.Nav a:before{font-family:FontAwesomeS;font-size:23px;line-height:30px;}
.Nav a:nth-child(1):before{content:'\f406'}
.Nav a.logout:nth-child(1):before{content:'\f011'}
.Nav a:nth-child(2):before{content:'\f303'}
.Nav a:nth-child(3):before{content:'\f3ed'}

#header #opNav{position:relative;display:inline-block;margin:0;vertical-align:middle;right:0}
#opNav .bar1, #opNav .bar2, #opNav .bar3{background:#000}

#header.sub #opNav .bar1, #header.sub #opNav .bar2, #header.sub #opNav .bar3{background:#444}

#header .sticky #Menu3 ul li ul, #header .stickmenu.sticky .menu_wrap{display:none }

.mobile_menu>ul>li>a:before{width:1px !important;}
.mobile_menu>ul>li>a:after{height:1px !important; margin-left:-1px;}

/*contents*/
.conts{position:relative;padding-bottom:50px;margin:0 1% 0% 1%; }

#subVisual{background-repeat:no-repeat; -webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size: cover;  height:642px;position:relative;animation-name:scaleIn;animation-duration:0.6s; overflow:hidden}
#subVisual *{vertical-align:middle;}
#subVisual div{ position:relative; padding-top:350px }
#subVisual div:after{content:'';display:table-cell;height:100%;}
#subVisual .container{ text-align:center;}
#subVisual .container:before{content:none;}
#subVisual .container strong{color:#fff;font-size:170%;text-shadow:0 3px 5px rgba(0,0,0,0.3); margin:0 auto;  letter-spacing: 0.3em; }
#subVisual .container h3{color:#fff;  font-weight:600 !important;font-size:400%;  text-shadow:0 3px 5px rgba(0,0,0,0.3); }
#subVisual .container p{color:rgba(255,255,255,0.8); font-size:150%;text-shadow:0 3px 5px rgba(0,0,0,0.3); margin:10px auto}

#subVisual{background:url(../image/sub/sub001.jpg) center center; }
#subVisual.s001{background:url(../image/sub/sub001.jpg) bottom center;}
#subVisual.s002{background:url(../image/sub/sub002.jpg) bottom center;}
#subVisual.s003{background:url(../image/sub/sub003.jpg) bottom center;}
#subVisual.s004{background:url(../image/sub/sub004.jpg) bottom center;}
#subVisual.s005{background:url(../image/sub/sub005.jpg) bottom center;}
#subVisual.s000{background:url(../image/sub/sub001.jpg) bottom center;}

.subTitle{display:block;text-align:left;position:relative;display:block;margin-bottom:1.5em;font-size:350%;padding:80px 0 10px 0;font-weight:500; border-bottom:1px solid #e3e3e3;}
.subTitle p{font-size:14px; float:right;margin-top:35px;}

.sub_menu{position:relative; margin-top:-40px;}
.sub_menu:before{content:"";z-index:1;top:0px;display:block;position:absolute; width:100%;height:80px; background:#1471b4}
.sub_menu ul{position:relative;z-index:2;text-align:center;height:80px; text-align:center; }
.sub_menu ul li{display:inline-block;height:100%; width:auto !important; margin:0 20px; }
.sub_menu ul li a{height: 100%; display:block;font-size:150%;line-height:80px;white-space:nowrap;  color:#cddbea; padding:0px 25px; }

.sub_menu .active{color:#fff;display:block; border-bottom:2px solid #fff; font-weight:600;}

#sub_t002002 .leftNaviSC1, #sub_t002003 .leftNaviSC1, #sub_t002004 .leftNaviSC1, #sub_t002005 .leftNaviSC1, #sub_t002006 .leftNaviSC1, #sub_t002007 .leftNaviSC1{ display:none}
#sub_t002001 .leftNaviSC2, #sub_t002002 .leftNaviSC2, #sub_t002003 .leftNaviSC2, #sub_t002005 .leftNaviSC2, #sub_t002006 .leftNaviSC2, #sub_t002007 .leftNaviSC2{ display:none}
#sub_t002001 .leftNaviSC3, #sub_t002002 .leftNaviSC3, #sub_t002003 .leftNaviSC3, #sub_t002004 .leftNaviSC3, #sub_t002006 .leftNaviSC3, #sub_t002007 .leftNaviSC3{ display:none}



#leftNaviText{display:block; text-align:center;margin-bottom:3em; font-size:120%}
#leftNaviText:after{content:'';display:table; clear:both}
#leftNaviText ul{display:block; text-align:center}
#leftNaviText ul li{display:inline-block; margin:0px 5px}
#leftNaviText ul li a{display:block;border:1px solid #ddd;;padding:15px 40px;font-size:100%; color:#666;font-family:'Noto Regular'}
#leftNaviText ul li .active{color:#fff;}
#leftNaviText #now{display:none;}
#leftNaviText ul a.active #now{display:block;}


/**
 * mdStore 
 */
#mdStore {position:relative;  overflow:hidden;background:#fff; padding:30px 0px 0px 0px}
#mdStore div.contentLeft {float:left; padding-right:10px; background:#fff;}
#mdStore div.searchBox { padding:15px 0px; text-align:center; border:1px solid #ddd; border-top:1px solid #000; background:#fff; background:#fff; margin-bottom:10px}
#mdStore div.searchBox input{height:30px}
#mdStore div.contentLeft p {padding:10px 0}
#mdStore div.contentRight {float:left}
#mdStore div.read .readMap {float:left; width:40% !important; height:330px !important; border:1px solid #777; margin-bottom:2%}
#mdStore div.read .readMap iframe{height:300px !important;}
#mdStore div.read .readContent {float:right;  width:55% !important}
#mdStore div.read .readContent .infoHead {height:250px}
#mdStore div.read .readContent .info {vertical-align:top}
#mdStore div.searchBox .selectBox{ height:30px; display:inline-block}
#mdStore div.searchBox .selectBox .selectValue { height:30px;  line-height:30px; font-size:100%}
#mdStore div.searchBox .selectBox .selectList2, #mdStore div.searchBox .selectBox .selectList2 li  { height:30px; line-height:30px; font-size:100%}
#mdStore div.searchBox .selectBox .selectList2  label { height:30px;line-height:30px; }
#mdStore div.searchBox .selectBox ul{top:30px;}

/*가맹점찾기*/
#mdStore div.franchise_con{position:relative; line-height:1.5; font-size:9pt; color:#444; word-break:break-all; text-align:justify; width:100%; background:#fff; margin:0 auto; overflow:hidden;}
#mdStore div.franchise_left{padding:15px 0 45px 0px;width:40%;float:left;overflow:hidden;}
#mdStore div.franchise_right{width:55%;float:right;padding:15px 0 45px 0px;overflow:hidden;}
#mdStore div.korea_map{ background:#fff; border:1px solid #ddd; text-align:center; box-sizing:border-box;}
#mdStore div.detail_tit{ padding:18px 0px; text-align:center;  border-top:1px solid #000 !important; border:1px solid #ddd; border-collapse:collapse; overflow:hidden; font-size:130%}
#mdStore div.detail_con{ border:1px solid #ddd; border-top:none; border-collapse:collapse; text-align:center;}
#mdStore div.f_contents {position:relative; width:100%; overflow:hidden; }

#mdStore div.read .contentBody img {width:100%}
#mdStore div.f_contents .table_basic strong {font-weight:normal}
#mdStore div.f_contents .table_basic strong.colorBlack{color:#000 !important; font-size:150%; font-family: 'Noto Medium';}
#mdStore div.readContent .table_basic td {line-height:40px !important; vertical-align:middle !important;}

#mdStore div.center a:after{content:'목록보기'; display:inline-block; background:#333; padding:5px 20px; color:#fff; font-size:120%; }
#mdStore div.center a img{display:none}
#mdStore div.store_content {clear:both; padding-top:3%}
#mdStore div.store_content img{margin:1% auto}

/*====================================== Responsive ============================================*/

.f_l {float:left}
.f_r {float:right}

.won1{background:#f5f5f5 url(../image/main/main_bg.png) top center; }




@media only screen and (min-width: 1400px){	
.container {    width: 1370px ;   padding-right: 0px !important;padding-left: 0px !important;}


}

@media only screen and (max-width: 1400px){	
	#footer .copy_l {position:relative; float:none;  padding:1em 0}
	#footer .copy_r {position:relative; float:none;  padding:3em 0}	
}

@media only screen and (max-width: 1200px){	
#header .localNavi:after{display:none}
.top_menu {display:none}
menu#Menu3 {display:none !important}
.container {    width: 95% ;}
.sub_menu {display:none !important}
 #header:hover .stickmenu.sticky .menu_wrap{display:none !important;  }
 #header .Nav{display:block}
	#topmn{display:none;}	

	#header .stickmenu{ padding:5px ;}
	#header .logo{display:none}
	#header .stickmenu .logo{display:block}
	#header .logo{left:0%; width:auto;  text-align:left; }
	#header .logo img{height:60px; padding:0px 0px}
	#header .logo:before{display:none}

	#subVisual{height:220px;}
	#subVisual .container strong{font-size:100%;}
	#subVisual .container h3{font-size:170%;}
	#subVisual .container p{font-size:110%;}
	#subVisual div{ padding-top:100px; }



}

@media only screen and (max-width: 992px){	
.container {  width: 95% ;}
.docThumb .cell {  width: 50%;}


}
@media only screen and (max-width: 767px){	
	.container {  width: 95% ;}
	#leftNaviText ul li{float:left; width:50%; margin:0px 0px}
	#leftNaviText.leftNaviSC1 ul li{ width:33.3333%;}
	#leftNaviText ul li a{padding:15px 0px; }


	.subTitle{font-size:180%; margin-bottom:9%; padding-top:11%}
	.subTitle p{display:none}
	

	#footer:before{ top:48%; }
	#footer ul{display:none;}
	#footer .info{font-size: 1em;}
	#footer .copy_r dt{padding:0.4em 40px 4em 0; font-size:180%; width:160px}
	#footer .copy_r dd.phone {font-size:150%;  font-weight:600; margin-bottom:10px}
	#footer .copy_r dd.phone span {font-size:70%; display:block; width:auto}

}