@charset "utf-8";




/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 소개
	연관단어 : intro

////////////////////////////////////////////////////////////////////////////// */
#intro .intro_box{position:relative;}
#intro .intro_box,
#intro .intro_box .txts{transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}

#intro .intro_box{overflow:hidden; position:relative; margin-bottom:25px; padding-bottom:20px; background:url(/img/craftlab/sub/intro_img.jpg) no-repeat left top;}
#intro .intro_box .txts{float:right; width:52%; height:auto; margin-top:40px; padding:50px; background:#ba2933; color:#fff; box-sizing:border-box;}
#intro .intro_box .txts strong{display:block; margin-bottom:18px; font-size:27px;}
#intro .intro_box .txts p{line-height:25px; font-size:17px; color:rgba(255,255,255,0.8);}

@media screen and (max-width:840px){
	#intro .intro_box{background-size:480px;}
	#intro .intro_box .txts{width:55%; margin-top:30px; padding:42px;}
	#intro .intro_box .txts strong{margin-bottom:15px; font-size:24px;}
	#intro .intro_box .txts p{line-height:23px; font-size:16px;}
}
@media screen and (max-width:640px){
	#intro .intro_box{padding-bottom:0; padding-top:250px; background-size:100%; background-position:center top -20px;}
	#intro .intro_box .txts{float:none; width:100%; margin-top:0; padding:30px;}
	#intro .intro_box .txts strong{margin-bottom:10px; font-size:21px;}
	#intro .intro_box .txts p{line-height:21px; font-size:15px;}
}
@media screen and (max-width:480px){
	#intro .intro_box{padding-top:200px; background-size:480px;}
	#intro .intro_box .txts{padding:25px;}
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 주요연혁
	연관단어 : history

////////////////////////////////////////////////////////////////////////////// */
#history > ul > li,
#history > ul > li strong,
#history > ul > li > ul{transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}

#history > ul > li{padding:0 0 35px; margin:0;}
#history > ul > li > strong{display:block; float:left; width:115px; line-height:22px; font-size:30px;}
#history > ul > li .his-title01{background:url(/img/craftlab/sub/history_bul01.png) no-repeat right 0; color:#d52935;}
#history > ul > li .his-title02{background:url(/img/craftlab/sub/history_bul02.png) no-repeat right 0; color:#8a8a8a;}
#history > ul > li.history-bg01{background:url(/img/craftlab/sub/history_bg01.gif) repeat-y 104px 0;}
#history > ul > li.history-bg02{background:url(/img/craftlab/sub/history_bg02.gif) repeat-y 104px 0;}
#history > ul > li:last-child{background: none; padding-bottom:10px !important;}
#history > ul > li > ul{margin-left:140px;}
#history > ul > li > ul > li > strong{float:left; color:#303030;}
#history > ul > li > ul > li > ul{margin-left:140px;}
#history > ul > li > ul > li{margin-bottom:5px;}
#history .list_01{margin-top:0;}

@media screen and (max-width:640px){
	#history > ul > li{padding:0 0 20px;}
	#history > ul > li > strong{width:80px; font-size:20px;}
	#history > ul > li > ul{margin-left:100px;}
	#history > ul > li > ul > li > strong{float:none;}
	#history > ul > li > ul > li > ul{margin-left:0;}
	#history .history li{margin-bottom:10px;}
	#history > ul > li.history-bg01,
	#history > ul > li.history-bg02{background-position:70px 0;}
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 조직및업무
	연관단어 : organ

////////////////////////////////////////////////////////////////////////////// */
#organization .organ{text-align:center;}
#organization .organ ul{display:inline-block;}
#organization .organ ul li .univ{
	display:table; table-layout:fixed; width:210px; height:60px; background:#ba2933 url(/img/craftlab/sub/organ_bg01.jpg) no-repeat top right;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
#organization .organ ul li .univ strong{display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle; font-weight:400; font-size:20px; color:#fff;}
#organization .organ ul li ul li.b_box{position:relative; display:table; table-layout:fixed; width:164px; height:42px; margin-top:65px; background:#836f55 url(/img/craftlab/sub/organ_bg02.jpg) repeat left top;}
#organization .organ ul li ul li.b_box:before{content:""; position:absolute; top:-65px; left:50%; width:1px; height:65px; background:#d9d9d9;}
#organization .organ ul li ul li.b_box span{display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle; color:#fff;}

@media screen and (max-width:640px){
	#organization .organ ul li .univ{width:200px; height:50px;}
	#organization .organ ul li .univ strong{font-size:18px;}
	#organization .organ ul li ul li.b_box{margin-top:50px;}
	#organization .organ ul li ul li.b_box:before{top:-50px; height:50px;}
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 작가별소개
	연관단어 : creator

////////////////////////////////////////////////////////////////////////////// */
#creat_soge .creator .soge,
#creat_soge .creator .soge .photos,
#creat_soge .creator .soge .txts,
#creat_soge .creator .product{transition:all 0.3s ease; -webkit-transition:all 0.3s ease;}
#creat_soge .creator{width:100%; height:auto; margin-bottom:15px; padding:28px 30px; background:url(/img/craftlab/sub/gray_pattern.jpg) repeat left top; box-sizing:border-box;}
#creat_soge .creator .soge{position:relative; width:100%; height:auto; padding-left:345px; background:#7a6851 url(/img/craftlab/sub/creator_soge_bg.png) no-repeat top 15px right 15px; box-sizing:border-box;}
#creat_soge .creator .soge .photos{overflow:hidden; position:absolute; top:0; left:0; width:345px;}
#creat_soge .creator .soge .txts{width:100%; min-height:410px; padding:30px; box-sizing:border-box;}
#creat_soge .creator .soge .txts .names{display:block; width:100%; font-size:21px; font-weight:400; color:#fff;}
#creat_soge .creator .soge .txts .names:after{content:""; display:block; width:25px; height:1px; margin:20px 0; background:#dda55a;}
#creat_soge .creator .soge .txts .lst strong{display:block; margin-bottom:5px; font-size:16px; color:#dda55a;}
#creat_soge .creator .soge .txts .lst:first-child strong{margin-top:0;}
#creat_soge .creator .soge .txts .lst ul li{margin-top:2px; color:#e1e1e1;}
#creat_soge .creator .soge .txts .lst ul li:first-child{margin-top:0;}
#creat_soge .creator .soge .txts .lst ul li:before{content:"- ";}

#creat_soge .creator .product{margin-top:30px;}
#creat_soge .creator .product ul{overflow:hidden;}
#creat_soge .creator .product ul li{float:left; width:33.33%; box-sizing:border-box;}
#creat_soge .creator .product ul li:first-child{padding:0 20px 0 0;}
#creat_soge .creator .product ul li:nth-child(2){padding:0 10px;}
#creat_soge .creator .product ul li:nth-child(3){padding:0 0 0 20px;}
#creat_soge .creator .product ul li div{overflow:hidden; position:relative; width:100%; height:180px; background:#fff;}
#creat_soge .creator .product ul li div span{position:absolute; top:0; left:50%; width:10000px; height:100%; margin-left:-5000px; text-align:center;}
#creat_soge .creator .product ul li div span img{display:inline-block; max-height:100%;}
/*모바일롤링*/
#creat_soge .creator .product_mob{display:none;}

@media screen and (max-width:1280px){
	#creat_soge .creator .soge{padding-left:270px;}
	#creat_soge .creator .soge .photos{top:30px; left:30px; width:240px;}
}
@media screen and (max-width:1140px) and (min-width:1024px){
	#creat_soge .creator .soge{padding-left:200px;}
	#creat_soge .creator .soge .photos{width:170px;}
}
@media screen and (max-width:840px){
	#creat_soge .creator{padding:25px;}
	#creat_soge .creator .soge{padding-left:195px;}
	#creat_soge .creator .soge .photos{top:25px; left:25px; width:170px;}
	#creat_soge .creator .soge .txts{padding:25px;}
	
	#creat_soge .creator .product ul li:first-child{padding:0 13px 0 0;}
	#creat_soge .creator .product ul li:nth-child(2){padding:0 7px;}
	#creat_soge .creator .product ul li:nth-child(3){padding:0 0 0 13px;}
	#creat_soge .creator .product ul li div{height:140px;}
}
@media screen and (max-width:740px){
	#creat_soge .creator .soge{padding-left:145px;}
	#creat_soge .creator .soge .photos{width:120px;}
}
@media screen and (max-width:640px){
	#creat_soge .creator .soge{padding-left:0; padding-top:168px;}
	#creat_soge .creator .soge .txts{min-height:auto;}
	#creat_soge .creator .soge .txts .names{font-size:18px;}
	#creat_soge .creator .soge .txts .names:after{margin:15px 0;}
	
	#creat_soge .creator .product ul li:first-child{padding:0 7px 0 0;}
	#creat_soge .creator .product ul li:nth-child(2){padding:0 3px;}
	#creat_soge .creator .product ul li:nth-child(3){padding:0 0 0 7px;}
	#creat_soge .creator .product ul li div{height:115px;}
}
@media screen and (max-width:540px){
	#creat_soge .creator .product{display:none;}
	#creat_soge .creator .product_mob{display:block; margin-top:30px;}
	#creat_soge .creator .product_mob .js_slide.type_03{height:auto;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control{position:static; height:auto; margin-top:12px;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control a.btn_left,
	#creat_soge .creator .product_mob .js_slide.type_03 .control a.btn_right,
	#creat_soge .creator .product_mob .js_slide.type_03 .control a.btn_play,
	#creat_soge .creator .product_mob .js_slide.type_03 .control a.btn_stop{display:none !important;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control ul{position:static; text-align:center;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control ul li:first-child{margin-left:0;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control ul li a{width:12px; height:12px; background:#fff; border:1px solid #7a6851; box-shadow:none;}
	#creat_soge .creator .product_mob .js_slide.type_03 .control ul li a.on{background:#7a6851;}
	#creat_soge .creator .product_mob .js_slide.type_03 .move{position:relative; height:170px;}
	#creat_soge .creator .product_mob .js_slide.type_03 .move ul li{background:#fff; text-align:center;}
	#creat_soge .creator .product_mob .js_slide.type_03 .move ul li div{overflow:hidden; position:relative; width:100%; height:100%;}
	#creat_soge .creator .product_mob .js_slide.type_03 .move ul li div span{position:absolute; top:0; left:50%; width:10000px; height:100%; margin-left:-5000px; text-align:center;}
	#creat_soge .creator .product_mob .js_slide.type_03 .move ul li div span img{height:100%;}
}
@media screen and (max-width:480px){
	#creat_soge .creator,
	#creat_soge .creator .soge .txts{padding:20px;}
	#creat_soge .creator .soge{padding-top:163px; background-position:top 10px right 10px; background-size:100px;}
	#creat_soge .creator .soge .photos{top:20px; left:20px;}
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 작가별소개-도자,섬유, 조각, 회화
	연관단어 : creator_wrap

////////////////////////////////////////////////////////////////////////////// */
.creator_wrap{position:relative; padding:30px 30px 0 30px; box-sizing:border-box;background: url(/img/craftlab/sub/gray_pattern.jpg) repeat left top;}
.creator_intro_box{background:#7a6851; padding:30px; box-sizing:border-box;}
.creator_intro_box h4{margin:0;color:#fff; font-size:23px;padding:0;}
.creator_intro_box h4:before{display:none;}
.creator_intro_box h5{position:relative;padding-top:15px;font-size:16px; margin:15px 0 5px 0; color:#dda55a;}
.creator_intro_box h5:before{content:""; display:block; position:absolute; left:0;top:0; width:25px; height:1px; background:#dda55a;}
.creator_intro_box ul li{color:#e1e1e1;margin-bottom:5px;}
.creator_intro_box ul li:last-child{margin-bottom:0;}
.creator_product_list{padding:30px 0; border-top:1px dashed #bebebe;box-sizing:border-box;}
.creator_product_list.first{border-top:0;}
.creator_product_list .info{position:relative;padding-left:290px; box-sizing:border-box;transition : all 0.3s ease;  -webkit-transition : all 0.3s ease; }
.creator_product_list .info .photos{position:absolute; top:0; left:0; width:260px; height:196px; transition : all 0.3s ease;  -webkit-transition : all 0.3s ease; }
.creator_product_list .info .photos span{display:block; width:100%; height:100%; background:#fff; border:1px solid #d9d9d9; text-align:center; box-sizing:border-box;}
.creator_product_list .info .photos span img{display:inline-block; height:100%;}
.creator_product_list .info .txts{min-height:196px;}
.creator_product_list .info .txts h4{position:relative; margin:0;padding-top:10px;padding-left:0;background:none; font-size:21px; color:#404040; }
.creator_product_list .info .txts h4:before{content:""; display:block; position:absolute; left:0;top:0;width:40px; height:3px; background:#997b41;}
.creator_product_list .info .txts h5{margin:18px 0 1px 0; color:#997b41; font-size:18px;}
.creator_intro_box h5.second{padding-top:0;}
.creator_intro_box h5.second:before{background:none;}
.creator_product_list .info .txts p{line-height:21px;}

@media screen and (max-width:840px){
	.creator_intro_box{padding:25px;}
	.creator_intro_box h4{font-size:21px;}
	.creator_product_list .info{padding-left:270px;}
	.creator_product_list .info .photos{width:240px;height:182px;}
	.creator_product_list .info .txts { min-height: 182px;}
	.creator_product_list .info .txts h4{font-size:19px;}
	.creator_product_list .info .txts h5{margin: 15px 0 1px 0;font-size:17px;}
}


@media screen and (max-width:640px){
	.creator_wrap{padding: 20px 20px 0 20px;}
	.creator_intro_box{padding:20px;}
	.creator_intro_box h4{font-size:19px;}
	.creator_product_list .info{padding-left:240px;}
	.creator_product_list .info .photos{width:220px;height:167px;}
	.creator_product_list .info .txts { min-height: 167px;}
	.creator_product_list{padding:20px 0;}
	.creator_product_list .info .txts h4{font-size:18px;}
	.creator_product_list .info .txts h5{margin: 12px 0 1px 0;font-size:16px;}
}

@media screen and (max-width:540px){
	.creator_product_list .info {padding-left: 0;}
	.creator_product_list .info .photos{position:relative; margin:0 auto;}
	.creator_product_list .info .txts{margin-top:20px;min-height:auto;}
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 전시안내 / 교육안내 (통합)
	연관단어 : exhibition

////////////////////////////////////////////////////////////////////////////// */
#exhibition .exhibox{position:relative; width:100%; height:auto; min-height: 458px; padding:30px;margin-bottom:30px; background:url(/img/craftlab/sub/gray_pattern.jpg) repeat left top; box-sizing:border-box;}
#exhibition .exhibox .info{position:relative; padding-left:300px;min-height:400px; box-sizing:border-box;transition : all 0.3s ease;  -webkit-transition : all 0.3s ease; }
#exhibition .exhibox .info .photos{position:absolute; top:0; left:0; z-index:10; width:270px; height:400px;transition : all 0.3s ease;  -webkit-transition : all 0.3s ease; }
#exhibition .exhibox .info .photos span{display:block; width:100%; height:100%; border:1px solid #d9d9d9; text-align:center;box-sizing: border-box;}
#exhibition .exhibox .info .photos span img{display:inline-block; height:100%;}
#exhibition .exhibox .info .txts{width:100%; box-sizing:border-box;}
#exhibition .exhibox .info .txts h4{position:relative; padding:13px 0 0 0; margin:0;background:none; font-weight:700;color:#404040;font-size:23px; }
#exhibition .exhibox .info .txts h4:before{content:""; display:block; position:absolute; top:0; left:0; width:40px; height:2px; background:#997b41;}
#exhibition .exhibox h5{font-size:18px; color:#997b41;margin: 20px 0px 5px 0px;}
#exhibition .exhibox h5.mt_ex{margin-top:50px;margin-bottom:15px;}
#exhibition .exhibox p{line-height:21px;}

#exhibition .pic_mob .js_slide {padding:0; height:368px; transition: all 0.3s ease; -webkit-transition: all 0.3s ease;}
#exhibition .pic_mob ul{overflow:hidden;}
#exhibition .pic_mob ul li{float:left;margin-left:20px;padding:0; box-sizing:border-box;}
#exhibition .pic_mob ul li:first-child{margin-left:0;}
#exhibition .pic_mob ul li span img{display:inline-block;width:100%; height:100%;}
#exhibition .pic_mob .js_slide .control{ width:100%; height:100%; bottom:auto;top:0;}
#exhibition .pic_mob .js_slide .control a.btn_play,
#exhibition .pic_mob .js_slide .control a.btn_stop{display:none !important;}
#exhibition .pic_mob .js_slide .control a[class*="btn_"] {position:absolute;top:50%;margin-top:-26px; border:0;width:89px;height:53px;background-color:#7a6851;opacity:0.8;-webkit-opacity:0.8;background-position:center center; background-repeat:no-repeat;}
#exhibition .pic_mob .js_slide .control a.btn_left {left:-30px; background-image:url(/img/craftlab/sub/arrow_left.png); }
#exhibition .pic_mob .js_slide .control a.btn_right {right:-30px; background-image:url(/img/craftlab/sub/arrow_right.png); }
.edu_guide_list li{position:relative; padding-left:80px !important;}
.edu_guide_list.second li{ padding-left:60px !important;}
.edu_guide_list em{position:absolute; top:0; left:11px; display:inline-block; font-style:normal;}


@media screen and (max-width:1140px) and (min-width:1024px){
	#exhibition .pic_mob .js_slide {height:310px;}
}
@media screen and (max-width:840px){
	#exhibition .exhibox .info{min-height:330px; padding-left:255px;}
	#exhibition .exhibox .info .photos{width:223px; height:330px;}
	#exhibition .exhibox .info .photos span img{width:100%;}
	#exhibition .exhibox .info .txts h4{font-size:21px;}
	#exhibition .exhibox h5{font-size:17px;margin-top:17px;}
	#exhibition .exhibox h5.mt_ex { margin-top: 30px; margin-bottom: 10px;}	
	#exhibition .pic_mob .js_slide {height:325px;}
	#exhibition .pic_mob .js_slide .control a[class*="btn_"] {width:77px; height:44px; margin-top:-22px;}
}
@media screen and (max-width:740px){
	#exhibition .exhibox .info{min-height:290px; padding-left:225px;}
	#exhibition .exhibox .info .photos{width:196px; height:290px;}
	
	#exhibition .pic_mob .js_slide {height:280px;}
}
@media screen and (max-width:640px){
	#exhibition .exhibox{padding:25px;margin-bottom:20px;}
	#exhibition .exhibox .info{ padding-left:0; padding-top:260px;}
	#exhibition .exhibox .info .photos{left:50%; margin-left:-98px;}
	#exhibition .exhibox .info .photos span {margin-left:0px;}
	#exhibition .exhibox .info .txts{padding:50px 0 0 0;}
	#exhibition .exhibox .info .txts ul li{position:relative; padding-left:65px; margin-top:12px; box-sizing:border-box;}
	#exhibition .exhibox .info .txts ul li h5{position:absolute; top:1px; left:0; line-height:18px; margin:0 !important; font-size:16px;}
	#exhibition .exhibox .info .txts h4{padding-top:10px; font-size:19px;}
	#exhibition .exhibox .info .txts ul li:nth-child(3){padding-left:0;}
	#exhibition .exhibox .info .txts ul li:nth-child(3) h5{position:relative;}
	#exhibition .exhibox .info .txts ul li:nth-child(3) p {margin-top:5px;}
	#exhibition .exhibox .info .txts ul li:nth-child(3) ul {margin-top:5px;}
	
	#exhibition .pic_mob .js_slide .control a.btn_left {left:20px; }
	#exhibition .pic_mob .js_slide .control a.btn_right {right:20px; }
	#exhibition .pic_mob .js_slide {height:258px;}
	#exhibition .pic_mob ul li{margin-left:0;}
	#exhibition .pic_mob ul li span {display: block; width: 100%;  height: 100%; text-align: center; box-sizing: border-box; }
    #exhibition .pic_mob ul li span img { width:auto;}
    #exhibition .pic_mob .js_slide .control a[class*="btn_"] {width: 50px; height: 36px; margin-top: -18px; background-size: 25px auto;}
}
@media screen and (max-width:480px){
	#exhibition .pic_mob .js_slide .control a.btn_left {left:0px; }
	#exhibition .pic_mob .js_slide .control a.btn_right {right:0px; }
}


/* //////////////////////////////////////////////////////////////////////////////

	페이지정보 : 사이트맵
	연관단어 : sitemap

////////////////////////////////////////////////////////////////////////////// */
#sitemap{}
#sitemap > ul > li{display:inline-block; width:30.3%; margin-top:50px; vertical-align:top;}
#sitemap > ul > li:first-child,
#sitemap > ul > li:nth-child(2),
#sitemap > ul > li:nth-child(3){margin-top:0;}
#sitemap > ul > li:nth-child(3n+1){padding:0 2% 0 0;}
#sitemap > ul > li:nth-child(3n+2){padding:0 2%;}
#sitemap > ul > li:nth-child(3n+3){padding:0 0 0 2%;}
#sitemap > ul > li:last-child{display:none;}
#sitemap > ul > li a{display:block; width:100%; height:100%; padding:10px 0; border-bottom:2px solid #555; color:#555; box-sizing:border-box;}
#sitemap > ul > li a:hover,
#sitemap > ul > li a:visited,
#sitemap > ul > li a:active{text-decoration:none;}
#sitemap > ul > li a span{line-height:28px; font-size:24px;}
#sitemap ul li ul li{width:100%;}
#sitemap ul li ul li a{line-height:20px; padding:13px 10px; border-bottom:1px solid #e6e6e6; font-size:17px;}
#sitemap ul li ul li a:hover,
#sitemap ul li ul li a:visited,
#sitemap ul li ul li a:active{text-decoration:underline !important;}

@media screen and (max-width:1140px) and (min-width:1024px){
	#sitemap > ul > li a span{font-size:22px;}
}
@media screen and (max-width:840px){
	#sitemap > ul > li a span{font-size:22px;}
}
@media screen and (max-width:740px){
	#sitemap > ul > li:nth-child(3n+1){padding:0 1.5% 0 0;}
	#sitemap > ul > li:nth-child(3n+2){padding:0 1.5%;}
	#sitemap > ul > li:nth-child(3n+3){padding:0 0 0 1.5%;}
}
@media screen and (max-width:640px){
	#sitemap > ul > li{width:47.3%; margin-top:40px;}
	#sitemap > ul > li:nth-child(3){margin-top:40px;}
	#sitemap > ul > li:nth-child(odd){padding:0 1.5% 0 0;}
	#sitemap > ul > li:nth-child(even){padding:0 0 0 1.5%;}
	#sitemap > ul > li a{padding:8px 0;}
	#sitemap > ul > li a span{line-height:22px; font-size:19px;}
	#sitemap ul li ul li a{padding:10px; font-size:15px;}
}
@media screen and (max-width:480px){
	#sitemap > ul > li{width:100%; margin-top:20px; padding:0 !important;}
	#sitemap > ul > li:nth-child(2),
	#sitemap > ul > li:nth-child(3){margin-top:20px;}
	#sitemap > ul > li a{padding:8px 0;}
	#sitemap > ul > li a span{line-height:22px; font-size:19px;}
	#sitemap ul li ul li a{padding:10px; font-size:15px;}
}