@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Muli:400,600');
@import url('reset.css');
@import url('main.css');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:100,300,400,500,700,900');

/*공통*/
.width848{width:54%;margin:0 auto;overflow:hidden}
#wrap02{width:100%;}
/*코너명*/
.written{overflow:hidden;width:100%; border-top:1px solid #b2b2b2;font-size:14px;text-transform:uppercase;font-weight:700;padding-top:20px;font-family:'Open Sans', sans-serif;}
.written span{font-size:12px; color:#818181;text-transform:none; font-weight:300;}
.written span.txt_l{font-weight:300; font-style:italic}
.written span.txt_b{font-weight:600}

/*제목*/
#container h2{width:100%; font-size:65px; font-weight:700;padding:8% 0 2% 0;color:#303030;text-align:center;}
#container h2 i{font-weight:700}
#container h3{width:100%;margin:0 auto; font-size:36px; font-weight:700;padding:12% 0 4% 0;text-align:center}
#container h3 i{font-weight:bold}
#container h3.nextimg{width:100%;margin:0 auto; font-size:36px; font-weight:700;padding:2% 0 4% 0;text-align:center}
#container h4{width:100%;margin:0 auto; font-size:45px; font-weight:700;padding:0 0 4% 0;text-align:center}
#container h5{width:100%;margin:0 auto; font-size:24px; font-weight:700;padding:5% 0 5% 0;text-align:left}
#container h6{width:100%;margin:0 auto; font-size:18px; font-weight:600;padding:0 0 8% 0;text-align:left}

#container02 h2{text-align:left; color:#212121;font-weight:800;font-size:75px;margin-top:13%; line-height:120%}
#container02 h3{width:100%; font-size:65px; font-weight:800;padding:0 0 2% 0;color:#131313;text-align:center;}
#container02 h4{width:100%;font-size:24px; font-weight:800;padding:0 0 7% 0;color:#131313;text-align:left;line-height:200%}
#container02 h4 i{ font-weight:800;}
#container02 h4 img{float:left; margin-right:2%;}
.mtitle{width:100%; font-size:28px; font-weight:500;padding:0 0 3% 0;text-align:center;color:#303030;}

/*발문*/
.txt01{width:100%; font-size:18px;color:#4b4b4b;text-align:center;line-height:180%;padding-bottom:5%}

/*서문*/
.preface{width:54%;margin:0 auto;font-size:16px;line-height:180%;color:#4b4b4b;padding:6% 0 0 0;}
.preface p:first-of-type::first-letter{font-size:72px; font-weight:600; font-style:normal; float:left;padding:15px 7px 12px 0;vertical-align:middle;color:#050505;font-family:'Noto Sans KR', sans-serif;text-transform:uppercase}
.preface p{padding-bottom:8%}

/*본문*/
.txt02{width:100%; font-size:16px;color:#4b4b4b;line-height:180%;padding-bottom:8%;}
.txt03{width:100%; font-size:16px;color:#4b4b4b;line-height:180%;padding-bottom:8%; font-weight:400;}
.txt04{width:100%; font-size:16px;color:#737373;line-height:180%;padding-bottom:8%; font-weight:400;text-align:center}

/*캡션*/
.caption{font-size:12px;color:#a7a7a7;margin-top:10px;line-height:150%}
.caption02{font-size:12px;color:#a7a7a7;margin-top:0px;line-height:150%}


/*다른 기사 보기*/
.other{overflow:hidden;width:100%;border-top:1px solid #b2b2b2;margin-top:8%;padding-top:5%;}
.other h4{font-size:30px;font-weight:600;text-align:center;padding-bottom:2%}
.listWrap01 {text-align:center; margin:2% auto 5% auto; width:100%;}
.listWrap01 a {width:19%; max-width:290px; display:inline-block; text-align:left; padding:0 2%; margin-bottom:4%; vertical-align:top; box-sizing:border-box}
.listWrap01 a .listTitle {font-size:14px; margin:15px 0 10px 0; display:block; color:#000;font-weight:700;}
.listWrap01 a .listTxt {font-size:13px; line-height:150%; display:block; color:#707070;font-weight:400;}
.listWrap01 a div {overflow:hidden; background:#fff}
.listWrap01 a div img {transition: all 0.3s ease-in-out}
.listWrap01 a div img:hover {transform:scale(1.1,1.1)}
/*Glimpse*/
.glimpse_top{overflow:hidden;float:left;width:100%;}
.glimpse_top_txt{float:right;width:35%;margin:0 6% 0 7%;}
.glimpse_top_txt span{display:block;width:1px; height:177px; background-color:#8a8a8a;margin:6% auto;}
.glimpsetxt01{font-size:16px;text-align:left;color:#131313;margin:5% 2% 0 0;line-height:180%}
.glimpse_top_img{float:left;width:51%;padding-top:6%;font-size:12px;color:#a7a7a7;}
.glimpse_top_img img{margin-bottom:10px}
.txt_ko{font-size:97px;text-align:center;color:#d9d9d9;font-weight:100;font-family: 'Noto Sans KR', sans-serif;}
.glimpse01{position:relative;float:right;width:100%;padding:8% 0}
.glimpse01_ri{float:right;width:69%;}
.glimpse01_le{float:left;font-size:12px;color:#a7a7a7;width:30%;text-align:right; position:absolute; right:70%;bottom:13%;}
.glimpse02{position:relative;float:left;width:90%;padding:0 0 8% 8%}
.glimpse02_ri{float:right;width:23%;font-size:12px;color:#a7a7a7;text-align:left; position:absolute; right:6%;bottom:16%;}
.glimpse02_le{float:left;width:67%;}
.essentials{overflow:hidden;float:left;width:76%; background-color:#f3fafe;padding:8% 12%;margin:8% auto}
.ess01{float:left;width:100%;padding:5% 0 5% 0;}
.ess01_le{float:left;width:47%;margin:0 2% 0 0;}
.ess01_ri{float:right;width:45%;}
.ess01_le .esstxt01{font-size:16px;color:#131313;line-height:180%}
.ess02{float:left;width:100%;padding:5% 0 5% 0;}
.ess02_le{float:left;width:41%;margin:0 2% 0 0;}
.ess02_ri{float:right;width:50%;}
.ess02_ri .esstxt02{font-size:16px;color:#131313;line-height:180%}
/*Focus*/
.subimg01{position:relative; width:66%; max-width:1030px; display:block; float:left; margin:0 2% 2% 0;font-size:12px;color:#a7a7a7;}
.subimg02{position:relative; width:32%; max-width:497px; display:block; float:left; margin:0 0 2% 0;font-size:12px;color:#a7a7a7;}
.subimg03{width:100%;margin-bottom:10px}
.subimg01 img{margin-bottom:10px}
.subimg02 img{margin-bottom:10px}
/*Local Taste*/
.subimg_box{width:100%; float:left;}
.subimg04{position:relative; width:38.5%; max-width:597px; display:block; float:left; margin:0 2% 2% 0;font-size:12px;color:#a7a7a7;}
.subimg05{position:relative; width:59.5%; max-width:930px; display:block; float:left; margin:0 0 2% 0;font-size:12px;color:#a7a7a7}
.subimg04 img{margin-bottom:10px}
.subimg05 img{margin-bottom:10px}
/*spotlight*/
.spotlight{overflow:hidden;float:left;width:80%; background-color:#f3fafe;padding:8% 10%;margin:8% auto}
.spot01{float:left;width:100%;padding:6% 0 5% 0;}
.spot01_le{float:left;width:39%;margin:0 6% 0 0;border-top:3px solid #131313}
.spot01_ri{float:right;width:53%;}
.spot02{float:left;width:100%;padding:6% 0 5% 0;}
.spot02_le{float:left;width:53%;margin:0 6% 0 0;}
.spot02_ri{float:right;width:39%;border-top:3px solid #131313}
.subimg06{position:relative; width:49%; max-width:323px; display:block; float:left; margin:0 1.5% 1% 0;font-size:12px;color:#a7a7a7;}
.subimg07{position:relative; width:49%; max-width:323px; display:block; float:left; margin:0 0 1% 0;font-size:12px;color:#a7a7a7;}
.subimg08{width:100%;margin-bottom:10px;max-width:656px;}
/*people*/
.people{overflow:hidden;float:left;width:76%; background-color:#f3fafe;padding:8% 12%;margin:8% auto}
 /*.peo01{float:left;width:100%;padding:5% 0 5% 0;}*/
.peo01_le{float:left;width:47%;margin:0 2% 0 0;}
.peo01_ri{float:right;width:45%;}
.peo01_ri .pt01{font-size:16px;color:#131313;line-height:180%;text-transform:uppercase;text-align:left;font-weight:700}
.peo01_ri .pt02{font-size:36px;color:#131313;line-height:180%;margin-top:-3%;font-style:oblique;font-family:"Times New Roman", serif;margin-top:2%}
.peo01_ri .year{float:left;width:100%;margin-top:7%}
.peo01_ri .year ul{display:inline-block;float:left;}
.peo01_ri .year ul li{font-size:14px;color:#4b4b4b;line-height:200%}
/*people profil*/
.peo01_ri dl{float:left;width:100%;margin-top:5%;}
.peo01_ri dt{float:left;width:7%;display:block;margin:0 3% 1% 0;font-weight:600;}
.peo01_ri dd{float:left;display:block;width:89%;font-size:14px;color:#4b4b4b;margin:0 0 2% 0;}
/*crafts*/
.Process{overflow:hidden;position:relative;float:left;width:80%; background-color:#f5f2ed;padding:8% 10%;margin:8% auto}
.Process_title{width:100%;color:#8a6341;font-size:34px;margin-bottom:4%;text-align:center;font-weight:700}
.Process_title i{font-weight:700}
.Process_txt{width:100%;color:#4b4b4b;font-size:16px;margin-bottom:8%;text-align:center;line-height:180%}
.Process_box{width:100%;position:relative;}
.Pro_outbox{display:flex;width:100%;flex-direction: row;justify-content: center;align-items: flex-start;display:-webkit-flex; display:-moz-flex;}
.Pro_box{width:25%;margin:0 5%;text-align:center;}
.Pro_outbox span{font-size:14px; color:#8a6341;}
.Pro_box img{margin:0 auto 10% auto;width:80%;}
.Pro_box_sub{width:100%;	height:100%;display:flex;position:absolute;justify-content:center; flex-direction: row;align-items: flex-start;top:30%;}
.Pro_box_sub li{margin:0 15.5%}
/*Media Click*/
.media_title01{font-size:24px; text-align:left;padding:10% 0 3% 0;font-weight:700}
.media_title02{font-size:24px; text-align:left;padding:0 0 3% 0;font-weight:700}


.sns_total{display:block; position:fixed; top:35%; right:5%; z-index:200;}
.sns_total li{list-style:none; margin-bottom:10px}

/*동영상*/
.vimeoWrap03{
     position: relative;
    padding-bottom: 54.2%; /* 16/9 ratio */
    padding-top: 32.5px; /* IE6 workaround*/
    height: 0;
    overflow: hidden;
    margin: 0;
  }
.vimeoWrap03 iframe,
.vimeoWrap03 object,
.vimeoWrap03 embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	border: 0px;
}

/*event winners*/
#winners_tb{position:relative;width:100%;border-bottom:1px solid #575757;margin:3% 0 5% 0}
#winners_tb th{border-top:3px solid #575757;border-bottom:1px solid #575757;border-right:1px solid #dadada;text-align:center;font-size:18px; color:#1b1b1b;font-family:'Open Sans', sans-serif;font-weight:600;line-height:180%;padding:1% 0;/*background:#eeeeee*/}
#winners_tb td{border-bottom:1px solid #dadada;border-right:1px solid #dadada;text-align:center;font-size:16px; color:#535353;font-family:'Open Sans', sans-serif;font-weight:400;line-height:180%;padding:1% 0}
#winners_tb .thle{border-right:0;}

@media screen and (max-width:1680px) {
	.listWrap01 a{padding:0 1%;width:19%}
	.preface{width:62%}
	.width848{width:62%}
	#container02 h2{font-size:68px;}
	.glimpse_top_txt span{height:100px}
	.txt_ko{font-size:90px;}
	.glimpsetxt01{font-size:15px}
	.Pro_box_sub{top:25%;}
	.peo01_ri .pt01{font-size:14px;}
	.peo01_ri .pt02{font-size:32px;margin-top:1%}
	.peo01_ri dl{margin-top:3%;}
	.peo01_ri dt{width:7%;font-size:12px;}
	.peo01_ri dd{width:89%;font-size:12px;}
}
@media screen and (max-width:1440px) {
	#container h2{font-size:60px}
	#container h4{font-size:38px}
	#container h5{font-size:20px}
	#container h6{font-size:16px}
	.txt03{font-size:13px}
	#container02 h2{font-size:60px;}
	#container02 h3{font-size:55px;}
	#container02 h4{font-size:20px}
	.preface{width:68%}
	.width848{width:68%}
	.glimpse_top_txt{width:39%;margin:0 5% 0 5%;}
	.txt_ko{font-size:85px;}
	.glimpse_top_txt span{height:80px;margin:3% auto;}
	.ess01_le .esstxt01{font-size:14px}
	.ess02_ri .esstxt02{font-size:14px}
}
/*노트북*/
@media screen and (max-width:1366px) {
	#container h2{font-size:55px}
	#container h3{font-size:34px}
	#container h3.nextimg{font-size:34px}
	#container h4{font-size:32px}
	.txt01{font-size:16px;}
	.listWrap01 a{padding:0 1%;width:19%}
	.glimpsetxt01{font-size:14px}
	.Pro_box_sub{top:23%;}
	.people{padding:8% 8%;width:84%;}
}
@media screen and (max-width:1280px) {
	.sns_total{right:3%}
	#container h2{font-size:50px}
	#container h3{font-size:32px}
	#container h3.nextimg{font-size:32px}
	#container h4{font-size:28px}
	#container h5{font-size:18px}
	#container h6{font-size:14px}
	.txt03, .txt04{font-size:12px}
	#container02 h2{font-size:55px;}
	#container02 h3{font-size:45px;}
	#container02 h4{font-size:18px}
	.width848{width:73%}
	.glimpse02_ri{width:29%;right:0;}
	.txt_ko{font-size:70px;}
	.glimpse_top_txt span{height:70px;margin:5% auto 0 auto;}
	.Pro_box_sub{top:20%;}
	.Pro_box_sub img{width:80%}
	.Pro_box_sub li{margin:0 14.5%}
}
/*아이패드 미니-가로*/
@media screen and (max-width:1024px) {
	#container h2{font-size:45px}
	#container02 h2{font-size:45px;}
	#container02 h3{font-size:35px;}
	#container02 h4{font-size:18px}
	.txt_ko{font-size:60px;}
	.glimpse_top_txt span{height:50px;margin:5% auto 0 auto;}
	.ess01_le, .ess01_ri{float:none;width:80%;margin:3% auto;}
	.ess02_le, .ess02_ri{float:none;width:80%;margin:3% auto;}
	.peo01_le{float:none;width:100%;margin:3% auto;}
	.peo01_ri{float:none;width:100%;margin:5% auto;}
	.Process_txt{font-size:14px}
	.Pro_outbox span{font-size:12px}
	.Pro_box{line-height:120%}
	.Pro_box img{width:90%}
	.Pro_box_sub img{width:70%}
}
@media screen and (max-width:960px) {
	.listWrap01 a {width:30%;margin-bottom:6%;}
	.txt01{font-size:16px;}
	.glimpsetxt01{font-size:13px}
}
/*아이패드 미니-세로, 아이폰 XS-가로*/
@media screen and (max-width:768px) {
	#container02{width:90%;margin:0 auto}
	#container h2{font-size:42px}
	#container h3{font-size:28px}
	#container h3.nextimg{font-size:28px}
	#container h4{font-size:24px}
	#container h5{padding:2% 0 3% 0;}
	#container h6{padding:0 0 5% 0;}
	.txt03{padding-bottom:0;font-size:14px}
	.mtitle{font-size:18px}
	#container02 h2{text-align:center}
	.other h4{font-size:35px}
	.mtitle{font-size:24px}
	.txt01{width:85%; margin:0 auto; font-size:16px;}
	.sns_total{right:8px;}
	.brmobile{display:none}
	.preface{width:80%}
	.width848{width:80%}
	.glimpsetxt01{font-size:16px}
	.glimpse_top_txt{width:100%;float:none;margin:0 auto;}
	.glimpse_top_img{width:100%;margin:3% auto;float:none}
	.glimpse01{width:100%;margin:3% auto;float:none;padding:2% 0}
	.glimpse02{width:100%;margin:3% auto;float:none;padding:2% 0}
	.glimpse01_ri{width:100%;margin:0 auto 10px auto;float:none}
	.glimpse02_le{width:100%;margin:0 auto 10px auto;float:none;}
	.glimpse01_le {width:100%;margin:0 auto;float:none;position:relative;right:0;text-align:left}
	.glimpse02_ri{width:100%;margin:0 auto;float:none;position:relative;right:0;text-align:left}
	.essentials{width:84%;padding:8% 8%;}
	#container02 h4{font-size:22px;text-align:center}
	#container02 h4 img{float:none; margin:0 auto}
	.ess01_le, .ess01_ri{float:none;width:100%;margin:3% auto;}
	.ess02_le, .ess02_ri{float:none;width:100%;margin:3% auto;}
	.ess01_le .esstxt01{font-size:12px;}
	.ess02_ri .esstxt02{font-size:12px;}
	.people{width:84%;padding:8% 8%;}
	.peo01_ri .pt01{font-size:14px}
	.peo01_ri .pt02{font-size:30px}
	.peo01_le{float:none;width:100%;margin:3% auto;}
	.peo01_ri{float:none;width:100%;margin:5% auto;}
	.peo01_ri .year ul li{font-size:10px}
	.Pro_outbox{flex-direction:column;align-items:flex-end;justify-content:space-around;}
	.Pro_box{width:90%; margin: 7% auto;}
	.Pro_box img{width:50%;margin:0 auto 4% auto;}
	.Pro_box_sub{display:none}
	.Process_title{font-size:22px}
	.spot01{padding: 6% 0 5% 0;}
	.spot01_le{width:100%;margin:3% auto;float:none;}
	.spot01_ri{width:100%;margin:0 auto 3% auto;float:none}
	.spot02_ri{width:100%;margin:3% auto;float:none}
	.spot02_le{width:100%;margin:3% auto;float:none}
	.media_title01{font-size:20px}
	.media_title02{font-size:20px}
	.vimeoWrap03{padding-bottom: 50%;}
}

@media screen and (max-width:570px) {
	#container02{width:90%;margin:0 auto}
	#container h2{font-size:28px;}
	#container h3{font-size:24px;}
	#container h3.nextimg{font-size:24px}
	#container02 h2{text-align:center}
	.mtitle{font-size:18px}
	.width848{width:90%}
	.written{font-size:11px}
	.written span{font-size:10px}
	.txt01{font-size:14px;}
	.txt02{font-size:12px;}
	.listWrap01{width:95%;margin:4% auto 5% auto;}
	.listWrap01 a {width:45%;margin-bottom:6%;padding:0 2%;}
	.preface{font-size:12px}
	.caption{font-size:11px}
	.other h4{font-size:22px;}
	.glimpsetxt01{font-size:13px}
	.glimpse_top_txt{width:100%;float:none;margin:0 auto;}
	.glimpse_top_img{width:100%;margin:3% auto;float:none}
	.glimpse01{width:100%;margin:3% auto;float:none;padding:2% 0}
	.glimpse02{width:100%;margin:3% auto;float:none;padding:2% 0}
	.glimpse01_ri{width:100%;margin:0 auto 10px auto;float:none}
	.glimpse02_le{width:100%;margin:0 auto 10px auto;float:none;}
	.glimpse01_le {width:100%;margin:0 auto;float:none;position:relative;right:0;text-align:left}
	.glimpse02_ri{width:100%;margin:0 auto;float:none;position:relative;right:0;text-align:left}
	.essentials{width:84%;padding:8% 8%;}
	#container02 h4{font-size:16px;text-align:center}
	#container02 h4 img{float:none; margin:0 auto}
	.ess01_le, .ess01_ri{float:none;width:100%;margin:3% auto;}
	.ess02_le, .ess02_ri{float:none;width:100%;margin:3% auto;}
	.ess01_le .esstxt01{font-size:12px;}
	.ess02_ri .esstxt02{font-size:12px;}
	.other h4{font-size:24px}
	.Process_txt{font-size:12px}
}
/*아이폰XS*/
@media screen and (max-width:425px) {
	#container h2{font-size:26px;}
	#container h3{font-size:20px;}
	#container h3.nextimg{font-size:20px}
	#container h4{font-size:20px}
	#container h5{font-size:16px;}
	#container h6{font-size:12px}
	.txt03{font-size:12px}
	.mtitle{font-size:16px}
	#container02 h2{text-align:center;font-size:36px;}
	#container h3.nextimg{font-size:20px;}
	.mtitle{font-size:18px}
	.glimpsetxt01{font-size:13px;}
	.txt01{font-size:12px;}
	.sns_total{display:none}
	.peo01_ri .pt01{font-size:12px}
	.peo01_ri .pt02{font-size:25px}
	.peo01_ri .year ul li{font-size:9px}
	.Pro_box{width:90%; margin: 7% auto;}
	.caption{font-size:11px}
	.caption02{font-size:11px;margin-top:10px}
	.subimg04, .subimg05, .subimg06, .subimg07, .subimg08 {font-size:11px}
	.spot01_le, .spot02_ri{margin:5% auto;}
	
}
@media screen and (max-width:360px) {
	#container02 h2{text-align:center;font-size:30px;}
	#container02 h3{font-size:24px;}
	#container02 h4{font-size:14px;}
	.listWrap01 a{width:80%; margin:5% auto}
	.glimpsetxt01{font-size:12px}

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