@charset "UTF-8";
body {background:#fff;}
/* common style */
.row{display: flex;flex-wrap: wrap;}
.row_nowrap{display: flex;}
.col{display: flex;align-items: center;}
.subheading {font-size: 20px;color: #222;letter-spacing: -0.05em;font-weight: 500;}
.heading {font-size: 40px;color: #222;font-weight: 300;letter-spacing: -0.05em;}
.heading_b {font-size: 46px;color: #222;font-weight: 300;letter-spacing: -0.05em;font-family: 'Noto Serif', serif;font-family: 'Noto Serif KR', serif;}
.sub_tit {font-size: 40px;font-weight: 500;color: #333;line-height: 1.4;letter-spacing: -0.05em;font-family: 'AritaBuri', serif;}
.txts {font-size: 17px;line-height: 1.7;color: #666;letter-spacing: -0.025em;font-family: "Noto Sans KR", sans-serif;}
.txt_tit {font-size: 20px;}
.info {font-size: 14px;color: #999999;letter-spacing: -0.025em;}
.center {text-align: center;margin: 0 auto;}
.button {
	border: 1px solid #fff;width: 220px;height: 60px;border-radius: 0.1rem;position: relative;
	font-size: 16px;font-weight: 500;display: flex;justify-content: center;align-items: center;overflow: hidden;
}
/* media query */
@media screen and (max-width: 768px){
	.cont_tit{font-size: 22px;}
	.subheading{/* font-size: 17px; */font-size: 15px;}
	.heading{font-size: 22px;line-height: 1.7;}
	.heading_b {font-size: 30px !important;}
	.sub_tit {font-size: 22px; }
	.txt_tit {font-size: 17px;}
	.date{/* font-size: 14px; */font-size: 13px;}
	.info {font-size: 13px;}
	.main-visual_wrap{height: 320px;}
	.txts {font-size: 14px;}
	.contents_tit {font-size: 14px; }
}
@media screen and (max-width:480px) {
	.button {width: 160px;height: 50px;font-size: 15px;}
	.center .txts br{display: none;}
}

/* 서브헤더 */
@media all and (max-width:1024px) {
	header.on {background:#fff !important;border-bottom:1px solid #e5e5e5 !important;}
	header.on.hover .logo {background:url("/images/logo_c.png") no-repeat center top !important;}
	header.on.hover .sidenav-control-left {background:url("/images/top_menu.png") no-repeat center center !important;}
}
@media all and (max-width:768px) {
	header {height:60px;}
	header .logo {top:10px;}
}
@media all and (max-width:480px) {
	header {height:50px;}
	header .logo {top:6px; left:20px; width:136px; height:37px; background-size:cover;}
	header.hover .logo {top:10px; left:20px; width:136px; height:32px; background-size:cover !important;}
	header.on.hover .logo {top:10px; left:20px; width:136px; height:32px; background-size:cover !important;}
}

/* 서브공통 */
.subVisual {position:relative; overflow:hidden; padding-top:210px; height:480px; text-align:center; background-size:cover;}
.subVisual::after{position:absolute;top:-10%;left:0;width:100%;height:110%;content:'';z-index:-1; background-repeat:no-repeat;background-position:center top;background:#000;background-size:auto 100%;
-webkit-animation: mymove 15s; 
animation: mymove 15s;
/*-webkit-animation-fill-mode:forwards;
animation-fill-mode: forwards;*/}
.subVisual.bg1::after {background:#000 url('/images/sub_visual1.jpg'); background-position:center center;}
.subVisual.bg2::after {background:#000 url('/images/sub_visual2.jpg'); background-position:center center;}
.subVisual.bg3::after {background:#000 url('/images/sub_visual3.jpg'); background-position:center center;}
.subVisual.bg4::after {background:#000 url('/images/sub_visual4.jpg'); background-position:center center;}
.subVisual.bg5::after {background:#000 url('/images/sub_visual5.jpg'); background-position:center center;}
.subVisual.bg6::after {background:#000 url('/images/sub_visual6.jpg'); background-position:center center;}

@-webkit-keyframes mymove{
	 0% {top:-10%;}
	 50% {top:0}
	 100% {top:0}
}
@keyframes mymove{
	 0% {top:-10%;}
	 50% {top:0}
	 100% {top:0}
}

.subVisual h2 {position:relative; font-weight:500; font-size:44px; line-height:100%; color:#fff; font-family: 'AritaBuri', serif; margin-bottom:20px;}
.subVisual .page_navi {font-size:17px; color:#fff; z-index:3; font-family: 'Noto Sans KR', sans-serif; font-weight: 400;}
.subVisual .page_navi img {margin:0 5px;}

.subCon .subTab { position:relative; width: 660px;  z-index:2; margin:0 auto 62px;font-size:0; display: block;}
.subCon .subTab.col1 {width: 220px;}
.subCon .subTab.col2 {width: 440px;}
.subCon .subTab.col4 {width: 880px;}
.subCon .subTab li {display:inline-block; width:33.3333%; height:68px; border: 1px solid #ddd; border-right: 0;}
.subCon .subTab.col1 li{width: 100%;}
.subCon .subTab.col2 li {width: 50%;}
.subCon .subTab.col4 li {width: 25%;}
.subCon .subTab.col2 li:last-child {border-right: 1px solid #ddd;}
.subCon .subTab.col3 li:last-child {border-right: 1px solid #ddd;}
.subCon .subTab.col4 li:last-child {border-right: 1px solid #ddd;}
.subCon .subTab.col5 li {display:inline-block; width:33.3333%; height:68px; border: 1px solid #ddd; border-bottom: 0;border-right: 0;}
.subCon .subTab.col5 li:nth-of-type(3){border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;}
/* .subCon .subTab li + li {margin-left:-3px;} */
.subCon .subTab.col5 li:nth-of-type(3)~li{ border-bottom: 1px solid #ddd;} 
.subCon .subTab.col5 li:last-child{border-right:1px solid #ddd;}
.subCon .subTab li a {display:block; font-size:17px; font-weight: 500; color:#666; line-height: 68px; display:flex; align-items:center; justify-content:center;}
.subCon .subTab li a br {display:none;}
.subCon .subTab li.on {background:#9e5032; border-color: #9e5032 !important;}
/* .subCon .subTab li:nth-of-type(4)~li{ border-color: #9e5032;}  */
.subCon .subTab li.on a {color: #fff;}


.tab {width:100%; padding:0; overflow: hidden; text-align:center; margin:0 0 62px;} 
.tab button {background:none; display:inline-block; text-align:Center; border:2px solid #9e5032; border-left:0px; outline:none; cursor:pointer; width:200px; height:60px; line-height:56px; font-size:20px; color:#666666; font-weight:500;} 
.tab button + button {margin-left:-3px;}
.tab button:first-child {border-left:2px solid #9e5032;}
.tab button.active {background:#9e5032; color:#fff;}
.tabcontent {display:none; padding:0;}



.subCon {position:relative; width:100%; margin:0 auto; padding:76px 0 0;}
.subCon h2 {font-size:40px; line-height:100%; margin-bottom:46px; text-align:center; color:#222;font-family: 'AritaBuri', serif; font-weight:500; letter-spacing: -0.05em;} 
.inc {width:1200px; margin:0 auto;}

@media all and (max-width:1200px) {
	.subVisual {padding-top:140px; height:350px;}
	.subVisual h2 {font-size:36px;}
	.subCon {padding:50px 0 0;}
	.inc {width:100% !important; padding:50px 20px;}
}
@media all and (max-width:768px) {
	.subCon .subTab { width: 100%;}
	.subCon .subTab.col4 {width: 100%; padding: 0 20px;}
	.subCon .subTab.col2 {width: 100%; padding: 0 20px;}
	.subCon h2 {font-size:30px;}
	/* .subCon .subTab li {float:left; display:block; width:33.33333%;} */
	.subCon .subTab.col4 li {width:25%;}
	.subCon .subTab.col5 li {height: 58px;}
	.subCon .subTab.col5 li a {font-size: 16px; line-height: 58px;}
}
@media all and (max-width:580px) {
	.subCon .subTab li a br {display:block;}
}

/* 탭메뉴 */
.tab {width:100%; padding:0; overflow: hidden; text-align:center; margin:0 0 62px;} 
.tab button {background:none; display:inline-block; text-align:Center; border:2px solid #9e5032; border-left:0px; outline:none; cursor:pointer; width:200px; height:60px; line-height:56px; font-size:20px; color:#666666; font-weight:500;} 
.tab button + button {margin-left:-3px;}
.tab button:first-child {border-left:2px solid #9e5032;}
.tab button.active {background:#9e5032; color:#fff;}
.tabcontent {display:none; padding:0;}

@media all and (max-width:768px) {
	.tab button {width:30%; font-size:16px;}
}

/********************** 1. brand *********************************/
/***************** 1. brand : brand1 브랜드스토리 ****************/
#brand1 {position: relative;padding: 0 0 140px;}
#brand1 .wide_bg {position: relative;}
#brand1 .frame {width: 1200px; margin: -280px auto 140px; position: relative;}
#brand1 iframe {width: 100%; height: 580px;}
#brand1 .center .sub_tit {position: relative; text-align: center !important;}

#brand1 .wide_bg1 {width: 60%;padding: 334px 0;/* background: url(/images/bs_bg.jpg) no-repeat; */background: #f9f6ec;background-size: cover;position: absolute;top: 13%;right: 0;z-index: 1;}
#brand1 .wide_bg2 {width: 63%;padding: 334px 0;/* background: url(/images/bs_bg.jpg) no-repeat; */background: #f9f6ec;background-size: cover;position: absolute;bottom: 9%;left: 0;z-index: 1;}
#brand1 .center {padding: 2rem 0 6rem;}
#brand1 .center .txts {padding: 1rem 0 0 0;}
#brand1 .content-box {border-bottom:1px solid #ddd;padding-bottom: 3rem;}
#brand1 .content-box .info {text-align: right; padding-bottom: 8px;}
#brand1 .content-box .center .sub_tit {padding: 4rem 0 2rem;}
#brand1 .content-box .frame {border: 1px solid #dddddd;width: 100%;height: 534px;display: flex;background: url(/images/logo_bg.gif) repeat;}
#brand1 .content-box .frame .row {width: 100%;}
#brand1 .content-box .frame .col {width: 50%;justify-content: center;align-items: center;}
#brand1 .content-box .frame .col img {width: auto;}
#brand1 ul.list {position:relative; width:1200px; margin:0 auto; z-index: 5;}
#brand1 ul.list li {overflow:hidden;display:flex; align-items:center;}
#brand1 ul.list li .img {float:left; width:50%;}
/* #brand1 ul.list li .img img {max-width:100%;} */
#brand1 ul.list li .img.mob {display:none;}
#brand1 ul.list li .desc {float:left; padding: 90px 120px;background: #fff;margin-left: -100px;}
#brand1 ul.list li .desc span {display: block; font-family: 'Noto Serif KR', serif; font-style: italic; text-transform: capitalize ; color:#9e5032; font-size: 18px; padding: 0 0 20px; font-weight: 500;}
#brand1 ul.list li .desc h4 { margin:0 0 24px; letter-spacing:-1.4px; line-height:130%;word-break:keep-all;}
#brand1 ul.list li .desc p {font-size:17px; word-break:keep-all; line-height:180%; letter-spacing:-0.4px;}
#brand1 ul.list li:nth-of-type(2) .desc {padding:0 120px 0 0; margin-left: 0;width: 80%;}

@media all and (max-width:1200px) {
	#brand1  ul.list { width:100%; padding: 0 20px;}
	#brand1  ul.list li {}
	#brand1  ul.list li .desc {width: 60%;}
	#brand1  ul.list li .desc h4 {font-size:30px;}
	#brand1  ul.list li .desc p { line-height:160%;}
	#brand1  ul.list li:nth-of-type(2) .desc {padding:0 40px 0 0;}
}
@media all and (max-width: 1024px) {
	#brand1 {padding: 0 0 80px;}
	#brand1 .wide_bg2{bottom: 11%; padding: 300px 0;}
}
@media all and (max-width:1048px) {
	#brand1 ul.list li .desc{padding: 60px 90px;}
}
@media all and (max-width:768px) {
	#brand1 {padding: 0 0 50px;}
	#brand1 .center {padding: 0rem 0 3rem;}
	#brand1 ul.list li {padding-bottom: 50px;}
	#brand1  ul.list li .img.wide {display:none;}
	#brand1  ul.list li .img.mob {display:block;}
	#brand1  ul.list li .img {float:none; width:100%;}
	#brand1  ul.list li .img img {width:100%;}
	#brand1  ul.list li .desc {float:none; width:100%;padding: 40px 60px;}
	#brand1 ul.list li .desc .sub_tit br {display: none;}
	#brand1  ul.list li .desc p br {display:none;}
	#brand1  ul.list li:nth-of-type(2) .desc {padding: 40px 60px;margin-left: -100px;width: 100%;}
}
@media all and (max-width:766px) {
	#brand1 ul.list li {display:block; padding-bottom: 50px;}
	#brand1 ul.list li .desc{margin-left: 0 !important; background: none;}
}
@media all and (max-width:480px) {
	#brand1  ul.list li {padding-bottom:30px;}
	#brand1  ul.list li .desc {text-align:center; padding:20px 30px 0;}
	#brand1  ul.list li:nth-of-type(2) .desc {padding:20px 0 0;}
	#brand1  ul.list li .desc h4 {font-size:22px; margin-bottom:10px;}
	#brand1 ul.list li .desc span {padding: 0 0 10px; font-size: 16px;}
	#brand1 ul.list li .desc p {font-size:14px;}
	#brand1 .wide_bg1,#brand1 .wide_bg2 {display: none;}
}
  

/***************** 1. brand : brand2 BI ****************/

#brand2 .center {padding: 2rem 0 6rem;}
#brand2 .center .txts {padding-top: 2rem;}
#brand2 .content-box {border-bottom:1px solid #ddd;padding-bottom: 3rem;}
#brand2 .content-box .info {text-align: right; padding-bottom: 8px;}
#brand2 .content-box .center .sub_tit {padding: 4rem 0 2rem;}
#brand2 .content-box .frame {border: 1px solid #dddddd;width: 100%;height: 534px;display: flex;background: url(../images/logo_bg.gif) repeat;}
#brand2 .content-box .frame .row {width: 100%;}
#brand2 .content-box .frame .col {width: 50%;justify-content: center;align-items: center;}
#brand2 .content-box .frame .col img {width: auto;}
#brand2 .content-box2 {padding: 3rem 0 140px;}
#brand2 .content-box2 .row {width: 100%;justify-content: space-between;}
#brand2 .content-box2 .col {width: 22.5%;}
#brand2 .content-box2 .col_box {width: 100%;margin: 0 auto;}
#brand2 .content-box2 .color {width: 100%;height: 140px;color: #fff;padding: 1rem;}
#brand2 .content-box2 .yellow {background-color: #f5cb6d;}
#brand2 .content-box2 .beige {background-color: #eee1d0;}
#brand2 .content-box2 .grey {background-color: #f6f6f6;}
#brand2 .content-box2 .dark_brown {background-color: #684130;}
#brand2 .content-box2 .txts_wrap {padding: 1.3rem 0 0 0;}
#brand2 .content-box2 .txts {color: #666;}
#brand2 .content-box2 .txts span {font-weight: 500;color: #222;text-transform: uppercase;padding-right: 1rem;}

/* media query */
@media all and (max-width: 1200px) {
	#brand2 .inc{padding: 0 20px;width: 100%;}
	#brand2 img {max-width: 100%;}
}
@media all and (max-width:1024px) {
	#brand2 {padding: 0 0 80px;}
}
@media screen and (max-width: 768px) {
	#brand2 .content-box .frame .col {width: 100%;}
	#brand2 .content-box1 {padding: 1.5rem 0;}
	#brand2 ul.section li a  {padding: 80px 0;}
}
@media screen and (max-width: 497px) {
	#brand2 .content-box2 .txts_wrap {height: 90px;}
}
@media screen and (max-width: 480px) {
	#brand2 {padding: 0 0 50px;}
	#brand2 .content-box .frame {height: 360px;}
	#brand2 .content-box2 .col {width: 100%;}
	#brand2 .content-box2 .txts_wrap {text-align: center;}
	#brand2 img {max-width: 60%;}
	#brand2 .content-box2 .color {height: 90px;font-size: 14px;}
	#brand2 .content-box {padding-bottom: 2rem;}
	#brand2 .content-box2 {padding: 2rem 0 0;}
	#brand2 .content-box0 .row-2 {padding: 1rem 0;}
	#brand2 .content-box1 {padding-top: 1rem;}
}


/* 2 메뉴소개 */
#menu {}
#menu1 {padding: 0 0 140px;}
#menu5 {padding: 0 0 140px;}
#menu .tab a {background:none; display:inline-block; text-align:Center; border:2px solid #9e5032; border-left:0px; outline:none; cursor:pointer; width:200px; height:60px; line-height:56px; font-size:20px; color:#666666; font-weight:500;} 
#menu .tab a {width:200px;} 
#menu .tab a + a {margin-left:-3px;}
#menu .tab a:first-child {border-left:2px solid #9e5032;}
#menu .tab a.active {background:#9e5032; color:#fff;}
#menu .tabcontent {display:block;}

#menu ul {/*overflow:hidden;*/ text-align:center;}
#menu ul::after{content:'';display:block;clear:both;}
#menu ul li {float:left; width:380px; margin:0 0 30px 0; background-color: #f6f6f6;}
#menu5 ul li {margin:0 0 20px 0;}
#menu ul li+li {margin-left:28px;}
#menu5 ul li+li {margin-left:20px;}
#menu ul li .img {position:relative; width:100%; height:260px; text-align:center; overflow:hidden; margin-bottom:25px;}
#menu5 ul li .img {height:220px; margin-bottom:23px;}
#menu ul li .img img {-webkit-transition:all .5s; transition:all .5s;}
#menu ul li .img .tag {position:absolute; height:30px; z-index:2;}
#menu ul li .img .tag span {display:inline-block; width:70px; height:34px; font-family: 'Noto Serif KR', serif; font-style:italic; line-height:32px; font-size:15px; padding:0; text-align:center; color:#fff;}
#menu ul li .img .tag .best {background:#3d5f3d;}
#menu ul li .img .tag .new {background:#ff9933;}
#menu ul li .title {display:block; height:78px; font-size:22px; color:#666666; font-weight:500; text-align:center; line-height:140%;}
#menu5 ul li .title {font-size:18px;}
#menu ul li .title small {font-size:16px; color:#aaa;display:block; font-family: 'Noto Serif KR', serif; font-style:italic;}

#menu ul li .img .bg {cursor: auto; opacity:0; position:absolute; background:rgba(255,153,51,0.9); width:100%; height:100%; z-index:3; -webkit-transition:all .3s; transition:all .3s;display:flex; align-items:center;}
#menu ul li .img .bg .txt {width:100%; font-size:22px; color:#fff; font-weight:500; text-align:center; line-height:120%; -webkit-transition:all .3s; transition:all .3s;}
#menu ul li .img .bg .txt small {font-size:14px; color:#fff; display:block; font-family: 'Noto Serif KR', serif; font-style:italic; opacity:0.5; margin-bottom:56px;}

#menu5 ul li {width: 224px;}

#menu  .lb-overlay {width:0px; height:0px; position:fixed; overflow:hidden; left:0px; top:0px; padding:0px; z-index:999; background:rgba(0,0,0,0.4);-webkit-transition:all .3s; transition:all .3s;}
#menu  .lb-overlay .subject span {text-transform: capitalize;}
#menu  .lb-overlay .frame {position:relative; width:867px; height:380px; background:#fff; margin:calc(10%) auto 0; border:1px solid #9e5032; overflow:hidden; -webkit-transition:all .3s; transition:all .3s;}
#menu  .lb-overlay .frame .photo {width:400px; height:100%; float:left; padding:0px;display:flex; align-items:center; justify-content:center;}
#menu  .lb-overlay .frame .photo img {width:100%; height:100%;}
#menu  .lb-overlay .frame .desc {width:465px; height:100%; float:left; padding:60px 0 0 60px; text-align:left; background:#fbfbfb;}
#menu  .lb-overlay .frame .desc .tag {overflow:hidden; height:30px;margin-bottom:25px;}
#menu  .lb-overlay .frame .desc .tag span {display:inline-block; width:64px; height:30px; font-family: 'Noto Serif KR', serif; font-style:italic; line-height:28px; font-size:15px; padding:0; text-align:center; color:#fff; }
#menu  .lb-overlay .frame .desc .best {background:#3d5f3d;}
#menu  .lb-overlay .frame .desc .new {background:#ff9933;}
#menu  .lb-overlay .frame .desc .subject {line-height:100%; font-size:30px; color:#000; font-family: 'Noto Serif KR', serif; margin-bottom:20px; font-weight:300;word-break:keep-all; }
#menu  .lb-overlay .frame .desc .subject span {display:block; font-size:16px; color:#c7bfb6; font-style:italic; letter-spacing:1px; font-family: 'Noto Serif KR', serif; font-weight:500;}
#menu  .lb-overlay .frame .desc .txt {width:340px; margin-bottom:60px; font-size:16px; color:#666666;word-break:keep-all; letter-spacing:0; }
#menu  .lb-overlay .frame .arrow {position:absolute; bottom:40px; right:38px; text-align:right;}
#menu  .lb-overlay .frame .arrow a {display:inline-block; margin-left:8px;}
#menu  .lb-overlay .lb-close {z-index:1001; position:absolute; top:32px; right:38px;}
#menu  .lb-overlay:target {width:auto; height:auto; bottom:0px; right:0px;}

@media all and (min-width:1201px) {
	#menu ul li:nth-child(4), #menu ul li:nth-child(7), #menu ul li:nth-child(10), #menu ul li:nth-child(13) {margin-left:0;}
	#menu5 > ul li:nth-child(6), #menu5 > ul li:nth-child(11), #menu5 > ul li:nth-child(16) {margin-left:0;}
	#menu5 > ul li:nth-child(4), #menu5 > ul li:nth-child(7), #menu5 > ul li:nth-child(10) {margin-left: 20px;}
}

@media all and (max-width:1200px) {
	#menu1 {padding: 0;}
	#menu5 {padding: 0;}
	#menu ul li {float:none; display:inline-block;}
	#menu ul li+li {margin-left:auto;}
	#menu ul li:nth-child(even) {margin-left:28px;}
	#menu5 ul li:nth-child(odd) {margin-left:28px;}
	#menu ul li .img {height:auto;}
}

@media all and (max-width:890px) {
	#menu  .lb-overlay .frame {width:80%; height:340px; margin:calc(20%) auto 0;}
	#menu  .lb-overlay .frame .photo {width:50%;}
	#menu  .lb-overlay .frame .photo img {width:100%;}
	#menu  .lb-overlay .frame .desc {width:50%; padding:40px 20px 0 30px; text-align:left;}
	#menu  .lb-overlay .frame .desc .tag {margin-bottom:20px;}
	#menu  .lb-overlay .frame .desc .subject {font-size:25px; margin-bottom:20px;}
	#menu  .lb-overlay .frame .desc .txt {width:100%; margin-bottom:60px;}
	#menu  .lb-overlay .frame .arrow {bottom:30px; right:30px;}
	#menu  .lb-overlay .lb-close {top:40px; right:40px;}
}
@media all and (max-width:850px) {
	#menu ul li {width:48%; float:left; display:block;}
	#menu ul li:nth-child(even) {margin-left:4%;}
	#menu5 ul li:nth-child(odd) {margin-left:0;}
	#menu ul li .img img {width:100%;}

	#menu ul li .img .bg .txt:after {top:160px; width:38px;margin-left:-19px;}
	#menu ul li .img .bg .txt:before {top:144px;}
	#menu ul li .img:hover .bg .txt:after {top:160px;}
	#menu ul li .img:hover .bg .txt:before {top:144px;}

}
@media all and (max-width:768px) {
	#menu .tab a {width:33.333%; font-size:16px; height:50px; line-height:46px; font-weight:400;}
	
	#menu ul li .img:hover .bg {opacity:0;}
	#menu ul li .img:hover img {transform:scale(1);}

	#menu  .lb-overlay .frame {height:auto; margin:20px auto 0;}
	#menu  .lb-overlay .frame .photo {width:100%; text-align:center; /*padding:60px 20px 20px;*/}
	#menu  .lb-overlay .frame .photo img {max-width:100%;}
	#menu  .lb-overlay .frame .desc {width:100%; padding:20px 0 20px; text-align:center; /*height: 260px;*/}
	#menu  .lb-overlay .frame .desc .tag {display:inline-block; height:auto;}
	#menu  .lb-overlay .frame .desc .subject {text-align:center; font-size:24px;}
	#menu  .lb-overlay .frame .desc .subject  span {font-size:14px;}
	#menu  .lb-overlay .frame .desc .txt {text-align:center; margin-bottom:24px; height:auto; font-size:15px; padding:0 20px;}

	#menu  .lb-overlay .frame .arrow {position:relative; display:block; bottom:auto; left:auto; right:auto; text-align:center; padding:0 0 20px;}
	#menu  .lb-overlay .lb-close {top:20px; right:20px;}
}
@media all and (max-width:480px) {
	.tab {margin:0 0 20px;} 
	.tab a {height:44px; line-height:42px; font-weight:300;}
	
	#menu ul li:nth-child(even) {margin-left: 0;}
	#menu5 ul li:nth-child(even) {margin-left: 4%;}
	#menu ul li .title {height:58px; font-size:18px;}
	#menu ul li .title small {font-size:15px; letter-spacing:0;}

	#menu ul li .img:hover .bg {opacity:0;}
	#menu ul li .img:hover img {transform:scale(1);}

	#menu  .lb-overlay .frame .desc .subject {font-size:20px;}
	#menu  .lb-overlay .frame .desc .subject  span {font-size:12px;}
	#menu  .lb-overlay .frame .desc .txt { font-size:14px;}
	#menu  .lb-overlay .frame .arrow a img {width:40px; height:40px;}
	
}
@media all and (max-width:400px) {
	#menu ul li {width:100%;}
	#menu5 ul li {width:48%;}
	#menu ul li .img {height:auto; margin-bottom:10px;}
	#menu ul li .img .tag span {width:60px; height:28px; line-height:26px; font-size:12px;}
	#menu ul li img {width:100%;}
}


/* 3. 매장안내 - 1. 매장찾기 */
#store {} 
#store h2 {font-size:46px; line-height:100%; margin-bottom:60px; text-align:center; color:#222;font-family: 'Noto Serif KR', serif; font-weight:300; letter-spacing:-4px;}

#store .new {width:1200px; margin:0 auto 100px;}
#store .new .box {}
#store .new .box .img {position:relative;}
#store .new .box .img span {position:absolute; top:0; left:0; width:100%; height:100%; background: #f9f6ec url(/images/store_logo.png) no-repeat center center;}
#store .new .box .img img {max-width:100%;}
#store .new .box .desc {background:#9e5032; padding:30px 20px; text-align:center;}
#store .new .box .desc a{color: #fff;}
#store .new .box .desc h4 {font-size:22px; color:#222222; font-weight:500; margin-bottom:8px;}
#store .new .box .desc span {font-size:17px; color:#9e5032; font-style:italic;;font-family: 'Noto Serif KR', serif;}

#store .new .slick-slide {margin:0 15px;}
#store .new .slick-slide img {width:100%;}
#store .new .slick-slide {transition: all ease-in-out .3s; opacity: .2;}
#store .new .slick-active {opacity: 1;}
#store .new .slick-current {opacity: 1;}
#store .new .slick-prev, #store .new .slick-next {display:none;}
#store .new .slick-dots {margin-top:30px;}
#store .new .slick-dots li {width:13px; height:13px; margin:0 12px; opacity:1;}
#store .new .slick-dots li button {width:100%; height:100%; padding:0px; background:#dfd2c1; -moz-border-radius:50%;-webkit-border-radius:50%; border-radius:50%; opacity:1;}
#store .new .slick-dots li.slick-active button {background:#9e5032; opacity:1;}
@media all and (max-width:1200px) {
	#store {padding: 0 20px;}
	#store .new {width:100%;}
}
@media all and (max-width:768px) {
	#store h2 {font-size:24px; margin-bottom:30px;}
	#store .new .box .desc h4 {font-size:20px;}
	#store .new .box .desc span {font-size:14px; }
	
	#store .new .slick-dots {margin-top:10px;}
	#store .new .slick-dots li {width:10px; height:10px; margin:0 6px;}
}
@media all and (max-width:480px) {
	#store .tab button {/*width:50%;*/}

	#store .new .box .desc h4 {font-size:16px;}
	#store .new .box .desc span {font-size:12px; }

	#store .new .slick-slide {margin:0;}
	#store .new .slick-dots {margin-top:0px;}
	#store .new .slick-dots li {width:8px; height:8px; margin:0 4px;}
}

#oversea {width:1200px; margin:0 auto; min-height:600px;}


/* 4. 창업안내 - 1. 창업안내 */
#franchise1 {} 
#franchise1 h2 {font-size:40px; margin-bottom:58px; margin-top: 0;}
#franchise1 h4 {font-size:22px; color:#222; line-height:100%; font-weight:500;} 
#franchise1 p {font-size:17px; color:#666; line-height:150%;} 

@media all and (max-width:1200px) {
	#franchise1 h2 {font-size:36px;}
}

@media all and (max-width:768px) {
	#franchise1 h2 {font-size:30px; margin-bottom:30px;}
	#franchise1 h4 {font-size:20px;}
	#franchise1 p {font-size:14px; letter-spacing:0;}
}

@media all and (max-width:480px) {
	#franchise1 h2 {font-size:24px;}
	#franchise1 h4 {font-size:16px;}
	#franchise1 p {font-size:12px;}
}

#franchise1 .section {position:relative; width:1200px; overflow:hidden; margin:0 auto; padding:78px 0 80px;}

@media all and (max-width:1200px) {
	#franchise1 .section {width:100%;}
}
@media all and (max-width:768px) {
	#franchise1 .section {padding:50px 20px;}
}

#franchise1 .center {padding: 2rem 0 4.5rem;}
#franchise1 .center .txts {padding: 1rem 0 0 0;}
#franchise1 .section3 {width:100%; height: 500px; background: url(/images/franchise1_bg.jpg) no-repeat; background-size: cover;}

@media all and (max-width:768px) {
	#franchise1 .section3 {height: 250px;}
}

#franchise1 .section4 {width:100%; background:#f6f4ee;}
#franchise1 .section4 h2 {color:#333333; margin-bottom:86px;}
#franchise1 .section4 ul {}
#franchise1 .section4 ul li {float:left; width:49%; text-align:center; background: #fff; padding:50px 20px; margin-bottom: 2%;}
#franchise1 .section4 ul li:nth-child(even){margin-left: 2%;}
#franchise1 .section4 ul li .desc {}
#franchise1 .section4 ul li .desc h4 {font-size:26px; color:#333; margin: 35px 0 25px 0;}
#franchise1 .section4 ul li .desc p {color:#666;}
@media all and (max-width:1200px) {
	#franchise1 .section4 ul {padding:0 20px;}
}
@media all and (max-width:1140px) {
	#franchise1 .section4 { height:auto; padding:60px 0 40px;}
	#franchise1 .section4 h2 {margin-bottom:60px;}
	#franchise1 .section4 ul li .img {width:160px; height:160px;}
	#franchise1 .section4 ul li .img img {width:60px;}
	#franchise1 .section4 ul li .desc p br {display:none;}
}
@media all and (max-width:940px) {
	#franchise1 .section4 ul li .img {width:140px; height:140px;}
	#franchise1 .section4 ul li .img img {width:60px;}
}
@media all and (max-width:768px) {
	#franchise1 .section4 h2 { margin-bottom:50px;}
	#franchise1 .section4 ul li {height: 360px;}
	#franchise1 .section4 ul li .img {margin-bottom:16px;}
	#franchise1 .section4 ul li .desc h4 {font-size:20px;}
}
@media all and (max-width:550px) {
	#franchise1 .section4 ul li {height: auto; float:none; width:100%;margin-bottom: 4%;padding: 40px 10px;}
	#franchise1 .section4 ul li:nth-child(even){margin-left: 0;}
}
@media all and (max-width:480px) {
	#franchise1 .section4 ul li .desc h4 {font-size:16px; margin-bottom:12px;}
	#franchise1 .section4 ul li img {width: 100px;}
}

#franchise1 .section7 {}
#franchise1 .section7 .tab {margin-bottom:42px;}
#franchise1 .section7 .tab button {width:252px; height:70px; line-height:66px; border-top:none; border-left:none; border-right:none; border-bottom:2px solid #ddd; text-align:center; color:#666; font-size:22px; font-weight:500;}
#franchise1 .section7 .tab button.active {border-color:#9e5032; background: #fff; color: #222;}
#franchise1 .section7 .tabcontent {}
#franchise1 .section7 .txts{text-align: right; padding-bottom: 10px;font-size: 16px;}
#franchise1 .section7 table#table1 {width:100%; border-collapse:collapse; border-spacing:0; margin-bottom:26px;}
#franchise1 .section7 table#table1 tr {text-align:center;}
#franchise1 .section7 table#table1 tr:last-child td {background:#f6f4ee;}
#franchise1 .section7 table#table1 tr th {padding:18px 10px; background:#9e5032; color:#fff; font-weight:500; font-size:17px;}
#franchise1 .section7 table#table1 tr td {font-size:18px; color:#666666; line-height:150%; padding:15px 10px; border-bottom:1px solid #e5e5e5; background:#fff;}
#franchise1 .section7 table#table1 tr td:nth-of-type(1) {width:254px; border-left:1px solid #e5e5e5;}
#franchise1 .section7 table#table1 tr td:nth-of-type(1) br {display:none;}
#franchise1 .section7 table#table1 tr td:nth-of-type(3) {width:220px;}
#franchise1 .section7 table#table1 tr td:nth-of-type(4) {width:260px;}
#franchise1 .section7 table#table1 tr:nth-of-type(2) td:last-child {border-left:1px solid #e5e5e5;}
#franchise1 .section7 p.cautoin {font-size:16px; color:#777777;}
@media all and (max-width:1200px) {
	#franchise1 .section7 table#table1 tr td:nth-of-type(1) {width:20%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(3) {width:14%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(4) {width:14%;}
	#franchise1 .section7 table#table1 tr:nth-of-type(2) td:last-child br {display:none;}
}
@media all and (max-width:768px) {
	#franchise1 .section7 .txts {font-size: 14px;}
	#franchise1 .section7 .tab button {width:50%; height:60px; line-height:56px; font-size:18px; font-weight:400;}
	#franchise1 .section7 table#table1 tr{border-left: 1px solid #e5e5e5;border-right: 1px solid #e5e5e5;}
	#franchise1 .section7 table#table1 tr th {padding:12px 5px;font-size:16px;}
	#franchise1 .section7 table#table1 tr td {padding:10px 5px;font-size:14px;line-height:140%;border-left:1px solid #e5e5e5;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(1) {width:20%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(3) {width:14%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(4) {width:14%;}
	#franchise1 .section7 p.cautoin {font-size:14px;}
}
@media all and (max-width:480px) {
	#franchise1 .section7 .txts {font-size: 12px;}
	#franchise1 .section7 .tab {margin-bottom:12px;}
	#franchise1 .section7 .tab button {height:50px; line-height:46px; font-size:16px; font-weight:400;}
	#franchise1 .section7 table#table1 {margin-bottom:10px;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(1) br {display:block;}
	#franchise1 .section7 table#table1 tr th {font-size:13px;padding:12px 4px;}
	#franchise1 .section7 table#table1 tr td {font-size:12px; padding:10px 4px;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(1) {width:10%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(3) {width:10%;}
	#franchise1 .section7 table#table1 tr td:nth-of-type(4) {width:12%;}
	#franchise1 .section7 p.cautoin {font-size:12px;}
}

#franchise1 .section8 {}
#franchise1 .section8 ul {}
#franchise1 .section8 ul li {position:relative; float:left; width:32%; height:236px; background:#f6f4ee; border:1px solid #e3dacc; text-align:center; padding:90px 20px; margin-bottom:18px;}
#franchise1 .section8 ul li + li {margin-left:2%;}
#franchise1 .section8 ul li:nth-of-type(4), #franchise1 .section8 ul li:nth-of-type(7) {margin-left:0;}
#franchise1 .section8 ul li:last-child {background:#9e5032; display:flex; align-items:center; justify-content:center;}
#franchise1 .section8 ul li:last-child .step {color:#fff;}
#franchise1 .section8 ul li:last-child h4 {color:#fff;}
#franchise1 .section8 ul li .step {position:absolute; top:26px; left:30px; font-size:17px; color:#9e5032; font-family:'Noto Serif KR', serif; font-style:italic;}
#franchise1 .section8 ul li .icon {position:absolute; top:20px; right:20px;}
#franchise1 .section8 ul li h4 {font-size:24px; margin-bottom:16px;}
#franchise1 .section8 ul li p {font-size:16px;}
@media all and (max-width:860px) {
	#franchise1 .section8 ul li .icon img {width:40px;}
	#franchise1 .section8 ul li h4 {font-size:22px;}
	#franchise1 .section8 ul li p br {display:none;}
}
@media all and (max-width:768px) {
	#franchise1 .section8 ul li {width:48%; height:236px;}
	#franchise1 .section8 ul li + li {margin-left:4%;}
	#franchise1 .section8 ul li .step {font-size:15px;}
	#franchise1 .section8 ul li h4 {font-size:20px;}
	#franchise1 .section8 ul li p {font-size:14px;}
	#franchise1 .section8 ul li:nth-of-type(4) {margin-left:4%;}
	#franchise1 .section8 ul li:nth-of-type(odd) {margin-left:0;}
	#franchise1 .section8 ul li:nth-of-type(7) {margin-left:0;}
}
@media all and (max-width:480px) {
	#franchise1 .section8 ul li {width:100%; height:auto; padding:40px 20px 30px;}
	#franchise1 .section8 ul li + li {margin-left:0%;}
	#franchise1 .section8 ul li .step {font-size:12px; top:20px; letter-spacing:0;}
	#franchise1 .section8 ul li h4 {font-size:18px;}
	#franchise1 .section8 ul li:nth-of-type(4) {margin-left:0%;}
	#franchise1 .section8 ul li p {font-size:12px;}
	#franchise1 .section8 ul li p br {display:block;}
}

#franchise1 .section10 {width:100%; background:#e49b3a; padding:30px 0;position: relative; bottom: 0; z-index: 9;}
#franchise1 .section10.on {position: fixed;bottom: 0;width: 100%;}
#franchise1 .section10 .inquiry {width:1200px; margin:0 auto; overflow:hidden;}
#franchise1 .section10 .inquiry .tel {float:left; height:65px; line-height:63px; font-size:41px; font-weight:600; color:#fff; font-style:italic; font-family:'Noto Serif KR', serif;}
#franchise1 .section10 .inquiry .tel img {vertical-align:top;}
#franchise1 .section10 .inquiry form {float:left; padding:6px 0 0 30px; overflow:hidden;}
#franchise1 .section10 .inquiry form input, #franchise1 .section10 .inquiry form select {display:block; float:left; background:none; width:180px; height:50px; line-height:48px; padding:0 0 0 20px;  font-size:17px; border:1px solid #fff; margin-left:-1px;}
#franchise1 .section10 .inquiry form input {}
#franchise1 .section10 .inquiry form select {color:#fff;box-sizing:border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: url('/images/icon_inq_arrow.png') no-repeat 95% 50%;}
#franchise1 .section10 .inquiry form select option{color:#222;}
#franchise1 .section10 .inquiry form select::-ms-expand {display: none;}
#franchise1 .section10 .inquiry form input::-ms-input-placeholder { color: #fff; }
#franchise1 .section10 .inquiry form input::-webkit-input-placeholder { color: #fff; }
#franchise1 .section10 .inquiry form input::-moz-placeholder { color: #fff;}

#franchise1 .section10 .inquiry .click {float:left; line-height:63px; padding:0 12px 0 16px; overflow:hidden;}
#franchise1 .section10 .inquiry .click input + label {float:left; cursor:pointer; margin-top:6px; display:inline-block; width:35px; height:35px;  background:url(/images/franchise1_check.png) no-repeat center center; background-size:cover;} 
#franchise1 .section10 .inquiry .click input:checked + label {background:url(/images/franchise1_check_on.png) no-repeat center center; background-size:cover;}
#franchise1 .section10 .inquiry .click input {display:none;} 
#franchise1 .section10 .inquiry .click span {float:left; font-size:15px; color:#fff; display:inline-block; line-height:120%; padding:4px 14px 0 12px;}
#franchise1 .section10 .inquiry .click button {float:left; width:160px; height:50px; line-height:48px; color:#fff; font-size:17px; text-align:center; border:1px solid #000; background:#333;}
@media all and (max-width:1200px) {
	#franchise1 .section10 {padding:30px 20px;}
	#franchise1 .section10 .inquiry {width:100%;}
	#franchise1 .section10 .inquiry .tel {float:none; width:100%; text-align:center; margin-bottom:20px;}
	#franchise1 .section10 .inquiry form {float:none; width:100%; padding:0; text-align:center;}
	#franchise1 .section10 .inquiry form input, #franchise1 .section10 .inquiry form select {display:inline-block; float:none; width:32%; margin-left:0;}

	#franchise1 .section10 .inquiry .click {float:none;padding:20px 0 0; width:100%; text-align:center; display:flex; align-items:center; justify-content:center;}
	#franchise1 .section10 .inquiry .click img {float:none; display:inline-block; margin-top:0px; vertical-align:center; line-height:50px}
	#franchise1 .section10 .inquiry .click span {float:none; font-size:15px; padding:0 30px 0 10px; line-height:50px;}
	#franchise1 .section10 .inquiry .click span br {display:none;}
	#franchise1 .section10 .inquiry .click button {float:none; display:inline-block; width:160px;}
}
@media all and (max-width:768px) {
	#franchise1 .section10 .inquiry .tel {height:40px; line-height:40px; font-size:30px;}
	#franchise1 .section10 .inquiry .tel img {width:44px;}
	#franchise1 .section10 .inquiry .click input + label {margin-top:0; width:24px; height:24px;}
	#franchise1 .section10 .inquiry form input, #franchise1 .section10 .inquiry form select  {font-size:14px;}
	#franchise1 .section10 .inquiry .click span {line-height:40px;}
	#franchise1 .section10 .inquiry .click button {font-size:14px;height:40px; line-height:38px;}

}
@media all and (max-width:480px) {
	#franchise1 .section10 .inquiry form input, #franchise1 .section10 .inquiry form select {width:100%; margin-bottom:4px;}
	#franchise1 .section10 .inquiry .click span {font-size:14px; padding:0 10px 0 4px;}
	#franchise1 .section10 .inquiry .click button {width:60px;}
	#franchise1 .section10 {position: relative;}
}

/***************** 4. 창업안내 - 2. 창업상담 ****************/
#franchise2 {margin-top: -50px;}
/* #franchise2 .inc{padding: 0 0 100px 0;} */
#franchise2 .center {padding: 0 0 4rem 0;}
#franchise2 .txts {color: #222;}
#franchise2 .button {background-color: #e49b3a; color: #fff; margin: 3rem auto;}
#franchise2 .table_wrap {overflow-x:hidden;}
#franchise2 input, #franchise2 select, #franchise2 textarea {border: 1px solid #ddd;}
#franchise2 caption {display:none;}
#franchise2 textarea {width: 100%; height: 200px;-ms-overflow-style: none; overflow: auto;}
select {-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: solid 1px #ccc;
    padding: 0 40px 0 12px;
    color: #666;
    height: 50px;
    background: url(/images/btn/ico_select.png) right center no-repeat #fff;
	box-sizing: border-box;
}
select::-ms-expand {display:none}
.tbl-join{border-top:solid 3px #9e5032 ; margin: 0 auto;}
#franchise2  .tbl-join > tbody > tr > th {font-weight:400;padding:15px 0 15px 20px;text-align:left;border-bottom:solid 1px #DDD;line-height: 1.7; width: 20%;}
.tbl-join.cs th{font-size:16px;}
.tbl-join .tmg15 {margin-top: 15px;}
.tbl-join .gift-option label {padding-right: 16px;}
.tbl-join > tbody > tr > td{color:#222;border-bottom:solid 1px #DDD;padding:15px 0;height:90px;box-sizing:border-box;}
.tbl-join th .essential{color:#e49b3a;padding-left:2px;position:absolute;margin-top:-9px;}
.tbl-join td input[type="text"], .tbl-join td input[type="password"], .tbl-join td select{height:50px;padding:0 20px;vertical-align:middle;}
.tbl-join td input[type="text"] + a{margin-left:6px;width:140px;padding:0;vertical-align:top;}
#franchise2 .tbl-join .spoqa {width: 100px;}
#franchise2 .tbl-join td .name {width: 320px;}
.tbl-join td select + input, .tbl-join td input + input, .tbl-join td input + select, .tbl-join td select + select{margin-left:6px;}
.tbl-join td .correct-check{margin-left:6px;color:#962639;display:inline-block;}
.tbl-join td .input-gap{margin:0 5px;}
.tbl-join td .radio-label{padding-right:100px;}
.tbl-join td .option-form{padding:15px 0;}
.tbl-join td .option-form p + p{margin-top:10px;}
.tbl-join td .option-form02 .radio-label{padding-right:30px;}
.option-form.cs{text-align:Center;padding-bottom:0;padding-top:15px;}
.option-form.cs.notbl{padding-bottom:15px;border-bottom:solid 1px #DDD;}
.tbl-join td.no-brd{border-bottom:0;padding-bottom:0;}
.option-form.cs label{margin:0 25px;}
.tbl-join td.noborder, .tbl-join th.noborder{border-bottom:0;}
.tbl-join.mypage th{font-size:16px;}
.tbl-join.mypage td{height:auto;}
.tbl-join.info th, .tbl-join.info td{line-height:1em;height:auto;}
.tbl-join td .join-rule-text{border:solid 1px #DDD;width:645px;}
.tbl-join tr.darkline td, .tbl-join tr.darkline th{border-color:#222;}
.tbl-join td .calendar{display:inline-block;margin-right:6px}
.tbl-join td .calendar input[type=text]{width:150px;height:50px !important;background:#FFF;}
.tbl-join td .calendar .ui-datepicker-trigger{margin-top:15px;}
.tbl-join .txt{margin-left:12px;font-size:16px;color:#999}
.joinCompleteBox{margin-top:40px;background:#F4F4F4;text-align:center;position:relative;font-size:20px;line-height:30px;padding:280px 0 47px 0;}
.joinCompleteBox:before{content:"";width:200px;height:200px;background:url(images/bg_join_auth.png) center -600px no-repeat;position:absolute;left:50%;top:50px;margin-left:-100px;}
.popnews_viewBox.popJoin{padding:45px 100px 50px 100px;}
.tbl-join .address-box select{width:170px}
.tbl-join .address-box input[type='text']{width:570px;}
.comment-box{background: #fff; border:solid 1px #ddd;padding:15px 20px;font-size:14px;color:#999;line-height:25px;margin-top:20px;}
.comment-box.tbl{padding-right:0;margin-top:0;}
.comment-box.tbl .comment{color:#999;font-size:16px;}
.comment-box > .scrollbar-inner{max-height:160px;}

input[type="checkbox"].check {position:absolute;overflow:hidden;height:0;width:0;left:-999px;}
input[type="checkbox"].check + label.check-label {display:inline-block;width:auto;height:auto;position:relative;padding-left:30px;}
input[type="checkbox"].check + label.check-label:before {content:"";position:absolute;left:0;top:50%;margin-top:-10px;width:20px;height:20px;background:url(/images/btn/input_box.png) no-repeat;}
input[type="checkbox"].check:checked + label.check-label:before {background-position:-20px 0;}
input[type="checkbox"].check:checked + label.check-label.type02:before {background-position:-80px -40px;}
input[type="checkbox"].check + label.check-label.hidden {width:20px;height:20px;overflow:hidden;text-indent:-999em;padding:0;}
input[type="checkbox"].check:disabled + label.check-label:before {background-position:-120px -40px;}
input[type="checkbox"].check + label.check-label.right {padding-left:0;padding-right:30px;color:#666;}
input[type="checkbox"].check + label.check-label.right:before {right:0;left:auto;}

input[type="radio"].radio {position:absolute;overflow:hidden;height:0;width:0;left:-999px;}
input[type="radio"].radio + label.radio-label {display:inline-block;width:auto;height:auto;position:relative;padding-left:30px;padding-right:16px;}
input[type="radio"].radio + label.radio-label:before {content:"";position:absolute;left:0;top:50%;margin-top:-9px;width:20px;height:20px;background:url(/images/btn/input.png) no-repeat;}
input[type="radio"].radio:checked + label.radio-label:before {background-position: -20px 0;}
input[type="radio"].radio + label.radio-label.hidden {width:22px;height:22px;overflow:hidden;text-indent:-999em;padding:0;}
input[type="radio"].radio:disabled + label.radio-label:before {background-position:0 -80px;}

input[type="radio"].radiobox {position:absolute;overflow:hidden;height:0;width:0;left:-999px;}
input[type="radio"].radiobox + label {display:block;width:82px;;height:40px;box-sizing:border-box;border:solid 1px #ccc;color:#666;background:#fff;line-height:38px;float:left;text-align:center;margin-left:-1px;}
input[type="radio"].radiobox + label.small {width:60px;}
input[type="radio"].radiobox:checked + label {color:#fff;background:#444;border-color:#444;}

input[type="radio"].radio + label.radio-label02 {display:inline-block;width:50px;height:50px;position:relative;text-align:center;line-height:50px;box-sizing:border-box;font-size:18px;color:#999;background:#f4f4f4;border:solid 1px #f4f4f4;float:left;}
input[type="radio"].radio:checked + label.radio-label02 {background:#fff;border-color:#962639;color:#962639;}
@media all and (max-width:1200px) {

}
@media all and (max-width:868px) {
}
@media all and (max-width:768px) {
	#franchise2 .tbl-join td input::placeholder{font-size: 14px;}
	#franchise2 input[type="checkbox"].check + label.check-label {font-size: 14px;}
	#franchise2 input, #franchise2 select, #franchise2 textarea {font-size: 14px;}
	#franchise2 .tbl-join > tbody > tr > td {padding: 20px 0 20px 20px;}
	#franchise2 .inc {padding: 0 20px}
	#franchise2 .q-box {padding: 15px 10px;}
	#franchise2 .q-box .tit-cell {padding: 0 0 0 30px;}
	#franchise2 .a-box {padding: 15px 10px;}
	#franchise2 .a-box p {padding-left: 30px;}
}
@media all and (max-width:580px) {
	#franchise2 h5 {font-size:30px; padding:90px 0 40px; letter-spacing:1px;}
}

@media all and (max-width:480px) {
	/* #franchise2 .inc{padding: 0 0 40px 0;} */
	#franchise2 .center {padding: 0px 0 2rem 0;}
	#franchise2 .tbl-join td .name {width: 150px; padding:0 10px}
	#franchise2 .tbl-join .spoqa {width: 30.3333%; padding: 0 7px;}
	#franchise2 .tbl-join > tbody > tr > td {padding: 20px 0 20px 10px;}
	#franchise2 .tbl-join > tbody > tr > th {padding: 15px 0 15px 0px;}
}
/*************** SCROLLBAR BASE CSS ***************/
.scroll-wrapper {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}
.scroll-wrapper > .scroll-content {
    border: none !important;
    box-sizing: content-box !important;
    height: auto;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none !important;
    overflow: scroll !important;
    padding: 0;
    position: relative !important;
    top: 0;
	width: auto !important;
	overflow-x: hidden !important;
	/* -ms-overflow-style: none; */
	overflow: auto;
}

.scroll-wrapper > .scroll-content::-webkit-scrollbar {
    height: 0;
    width: 0;
}

.scroll-element {
    display: none;
}
.scroll-element, .scroll-element div {
    box-sizing: content-box;
}

.scroll-element.scroll-x.scroll-scrollx_visible,
.scroll-element.scroll-y.scroll-scrolly_visible {
    display: block;
}

.scroll-element .scroll-bar,
.scroll-element .scroll-arrow {
    cursor: default;
}

.scroll-textarea {
    border: 1px solid #cccccc;
    border-top-color: #999999;
}
.scroll-textarea > .scroll-content {
    overflow: hidden !important;
}
.scroll-textarea > .scroll-content > textarea {
    border: none !important;
    box-sizing: border-box;
    height: 100% !important;
    margin: 0;
    max-height: none !important;
    max-width: none !important;
    overflow: scroll !important;
    outline: none;
    padding: 2px;
    position: relative !important;
    top: 0;
    width: 100% !important;
}
.scroll-textarea > .scroll-content > textarea::-webkit-scrollbar {
    height: 0;
    width: 0;
}
/************************************************************************/
/*************** SIMPLE INNER SCROLLBAR ***************/
/* .scrollbar-inner {overflow-y: scroll;} */

.scrollbar-inner > .scroll-element,
.scrollbar-inner > .scroll-element div
{
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
}

.scrollbar-inner > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scrollbar-inner > .scroll-element.scroll-x {
    bottom: 2px;
    height: 8px;
    left: 0;
    width: 100%;
}

.scrollbar-inner > .scroll-element.scroll-y {
    height: 100%;
    right: 0;
    top: 0;
    width: 3px;
}

.scrollbar-inner > .scroll-element .scroll-element_outer {
    overflow: hidden;
}

.scrollbar-inner > .scroll-element .scroll-element_outer,
.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.scrollbar-inner > .scroll-element .scroll-element_track,
.scrollbar-inner > .scroll-element .scroll-bar {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    opacity: 0.4;
}

.scrollbar-inner > .scroll-element .scroll-element_track { background-color: #e0e0e0; }
.scrollbar-inner > .scroll-element .scroll-bar { background-color: #c2c2c2; }
.scrollbar-inner > .scroll-element:hover .scroll-bar { background-color: #919191; }
.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }

.cart-scroll-wrap .scrollbar-inner > .scroll-element .scroll-element_track { background-color:transparent; }
.cart-scroll-wrap .scrollbar-inner > .scroll-element .scroll-bar { background-color: #222; }
.cart-scroll-wrap .scrollbar-inner > .scroll-element .scroll-element_track,
.cart-scroll-wrap .scrollbar-inner > .scroll-element .scroll-bar {opacity:1;}
.cart-scroll-wrap .scrollbar-inner > .scroll-element div {height:3px;}

.blackScroll .scrollbar-inner > .scroll-element .scroll-element_track { background-color:transparent; }
.blackScroll .scrollbar-inner > .scroll-element .scroll-bar { background-color: #222; }
.blackScroll .scrollbar-inner > .scroll-element .scroll-element_track,
.blackScroll .scrollbar-inner > .scroll-element .scroll-bar {opacity:1;}
.blackScroll .scrollbar-inner > .scroll-element div {width:3px;}

/* update scrollbar offset if both scrolls are visible */

.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -12px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -12px; }


.scrollbar-inner > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -12px; }
.scrollbar-inner > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -12px; }

/*************** SIMPLE OUTER SCROLLBAR ***************/

.scrollbar-outer > .scroll-element,
.scrollbar-outer > .scroll-element div
{
    border: none;
    margin: 0;
    padding: 0;
    position: absolute;
    z-index: 10;
}

.scrollbar-outer > .scroll-element {
    background-color: #ffffff;
}

.scrollbar-outer > .scroll-element div {
    display: block;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}

.scrollbar-outer > .scroll-element.scroll-x {
    bottom: 0;
    height: 12px;
    left: 0;
    width: 100%;
}

.scrollbar-outer > .scroll-element.scroll-y {
    height: 100%;
    right: 0;
    top: 0;
    width: 12px;
}

.scrollbar-outer > .scroll-element.scroll-x .scroll-element_outer { height: 8px; top: 2px; }
.scrollbar-outer > .scroll-element.scroll-y .scroll-element_outer { left: 2px; width: 8px; }

.scrollbar-outer > .scroll-element .scroll-element_outer { overflow: hidden; }
.scrollbar-outer > .scroll-element .scroll-element_track { background-color: #eeeeee; }

.scrollbar-outer > .scroll-element .scroll-element_outer,
.scrollbar-outer > .scroll-element .scroll-element_track,
.scrollbar-outer > .scroll-element .scroll-bar {
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}

.scrollbar-outer > .scroll-element .scroll-bar { background-color: #d9d9d9; }
.scrollbar-outer > .scroll-element .scroll-bar:hover { background-color: #c2c2c2; }
.scrollbar-outer > .scroll-element.scroll-draggable .scroll-bar { background-color: #919191; }


/* scrollbar height/width & offset from container borders */

.scrollbar-outer > .scroll-content.scroll-scrolly_visible { left: -12px; margin-left: 12px; }
.scrollbar-outer > .scroll-content.scroll-scrollx_visible { top:  -12px; margin-top:  12px; }

.scrollbar-outer > .scroll-element.scroll-x .scroll-bar { min-width: 10px; }
.scrollbar-outer > .scroll-element.scroll-y .scroll-bar { min-height: 10px; }


/* update scrollbar offset if both scrolls are visible */

.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_track { left: -14px; }
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_track { top: -14px; }

.scrollbar-outer > .scroll-element.scroll-x.scroll-scrolly_visible .scroll-element_size { left: -14px; }
.scrollbar-outer > .scroll-element.scroll-y.scroll-scrollx_visible .scroll-element_size { top: -14px; }


/* 5. 커뮤니티 - 3. sns후기 */
#sns {min-height:800px;}
#sns {padding-bottom: 120px}
#sns  .tab button {width:252px; height:70px; line-height:66px; border-top:none; border-left:none; border-right:none; border-bottom:2px solid #ddd; text-align:center; color:#666; font-size:22px; font-weight:500;}
#sns  .tab button.active {border-color:#9e5032; background: #fff; color: #222;}
.f_left{float: left;} 
.rela {position: relative;}
#sns .blog_ul{max-width:1080px;margin:0 auto;}
#sns .blog_ul li{float: left; width:calc(33.3333333333% - 13.3333333333px);margin-left:20px;padding:30px;border:1px solid #e7e7e7;margin-bottom:20px;}
#sns .blog_ul li:nth-child(3n+1){margin-left:0;clear:both;}
#sns .blog_ul li .top span{display:block;position:absolute;width:14%;top:20px;right:20px;}
#sns .blog_ul li .title{color:#20030a;}
#sns .blog_ul li .text b{font-weight:500;}
#sns .blog_ul li:hover{box-shadow:5px 5px 5px rgba(0,0,0,0.1);}
#sns .blog_ul li.none{width:100%;}

.mgt20 {margin-top: 20px;}
#insta_ul{overflow:hidden;position:relative;width:100%;z-index:1;}
#insta_ul li{position:relative;float:left;width:calc(25% - 15px);padding-bottom:calc(25% - 15px);margin-left:20px;margin-bottom:20px;}
#insta_ul li:nth-child(4n+1){margin-left:0;clear:both;}
#insta_ul li a{display:block;width:100%;height:100%;background-repeat:no-repeat;background-position:center;background-size:cover;position:absolute;}
#insta_ul li a::after{display:block;content:'';position:absolute;right:10px;bottom:10px;width:30px;height:30px;background:url(/images/insta_c.png) 50% 50%/cover no-repeat;z-index:2;}
#insta_ul li a .bg_insta{width:100%;height:100%;padding:30px;position:relative;position:absolute;left:0;top:0;background:url(/images/bg_insta.png);background-size:cover;display:none;z-index:3;}
#insta_ul li a:hover .bg_insta{display:block;}
#insta_ul li a .bg_insta .textarea{width:100%;color:#fff;line-height:140%;max-height:135px;overflow:hidden;}
#btn_insta_more{display:block;width:100%;height:50px;margin-top:20px;background:#f5f0ea;text-align:center;}
.load_text{line-height:50px;}
.load_img{padding-top:20px;}
#btn_insta_more .load_text{display:block;}
#btn_insta_more.loading .load_text{display:none;}
#btn_insta_more .load_img{display:none;}
#btn_insta_more.loading .load_img{display:block;}

@media (max-width: 1080px){
  #insta_ul li{width:calc(33.3333333333% - 13.3333333333px);padding-bottom:calc(33.3333333333% - 13.3333333333px);}
  #insta_ul li:nth-child(4n+1){margin-left:20px;clear:none;}
  #insta_ul li:nth-child(3n+1){margin-left:0;clear:both;}
}


@media (max-width: 800px){
  #sns .blog_ul li{width:calc(32.3333333333% - 6.66666666667px);}
  #insta_ul li{width:calc(33.3333333333% - 6.66666666667px);padding-bottom:calc(33.3333333333% - 6.66666666667px);margin-left:10px;margin-bottom:10px;}
  #insta_ul li:nth-child(4n+1){margin-left:10px;clear:none;}
  #insta_ul li:nth-child(3n+1){margin-left:0;clear:both;}
  #sns .tab button {width:50%;height: 60px;line-height: 56px;font-size: 18px;font-weight: 400;}
}

@media (max-width: 680px){
  #insta_ul li{width:calc(50% - 5px);padding-bottom:calc(50% - 5px);}
  #insta_ul li:nth-child(4n+1){margin-left:10px;clear:none;}
  #insta_ul li:nth-child(3n+1){margin-left:10px;clear:none;}
  #insta_ul li:nth-child(2n+1){margin-left:0;clear:both;}
  #sns .blog_ul li{width:calc(50% - 10px);}
  #sns .blog_ul li:first-child{margin-left: 0 !important;}
  #sns .blog_ul li:nth-child(2n+1) {margin-left: 0 !important; clear: both;}
  #sns .blog_ul li:nth-child(3n+1){margin-left:20px;clear: none;}

}
@media (max-width: 580px){
	#sns .blog_ul li{width:calc(100% - 10px); margin-left: 0;}
	#sns .blog_ul li:nth-child(3n+1){margin-left:0; clear: none;} 
  
}