@charset "utf-8";
/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#fff; font-size:14px; font-weight:bold; color:#000; line-height:1; text-align:center; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {margin-top:0; height:auto; }
/**/
* { padding:0; margin:0; box-sizing: border-box;word-break: keep-all; font-family: 'Mukta', sans-serif;}
body { overflow-x:hidden; font-family: 'Open Sans', sans-serif; font-size: 15px;}
a { text-decoration:none/*; font-size: 15px;*/}
button {cursor:pointer;outline:0; background: transparent;}
ul, li {list-style:none;}
.mobilevisual{display:none}
.pcvisual{display:block}
.col:after {clear: both; content: ""; display: block; visibility: hidden;} 
.col li {float: left;padding: 0 23px;}
.col2 li {width: 50%}
.col3 li {width: 33.33333333%}
.col4 li {width: 25%}
.col5 li {width: 20%}
.col9_1 {width: 11.11111111%}
.col9_2 {width: 22.22222222%}
.col9_3 {width: 33.33333333%}
.col9_4 {width: 44.44444444%}
.col9_5 {width: 55.55555555%}
.col9_6 {width: 66.66666666%}
.col9_7 {width: 77.77777777%}
.col9_8 {width: 88.88888888%}
.col9_9 {width: 100%}
.col12_1 {width: 8.333333333%}         
.col12_2 {width: 16.66666666%}
.col12_3 {width: 25%}
.col12_4 {width: 33.33333333%}
.col12_5 {width: 41.66666666%}
.col12_6 {width: 50%}
.col12_7 {width: 58.33333333%}
.col12_8 {width: 66.66666666%}
.col12_9 {width: 75%}
.col12_10 {width: 83.33333333%}
.col12_11 {width: 91.66666666%}
.col12_12 {width: 100%}
.outer{padding-left:5%;padding-right:5%;transition:0.3s;}
.relative{position:relative;}
.clearfix:after{display:block;content:'';clear:both;}
/*header*/
* {transition: 0.5s;}
.img {text-align: center}
#header {position: relative; width: 100%; height: 100vh; background:linear-gradient( to left top, #3c2404 30%, #a06a37 70%); border: 46px solid #fff;letter-spacing: 0.05em;}
#header h1.logo {position: absolute; top: 50px; left: 60px;}
#header h1.logo a img {width: 100%;}
#header .visual {width: 100%; height: 100%; overflow: hidden; background: url(../images/visual.png) no-repeat ;background-position:center; background-size: 100%}
.newyear{font-size:16px;color:#fff;text-align:left;font-family:'Mukta', sans-serif;font-weight:300;letter-spacing:0.05em;top:7%;right:8.5%;position:absolute;z-index:9}
.navi{position:absolute;z-index:9999;right:3%;top:5%;width:90%;height:100%;transition: .1s  ease-in-out;}
.navi.on{position:absolute;right:0;top:0;width:100%;height:100%;display:block;opacity:1;transition: .1s  ease-in-out}
.navi nav{opacity:0;transition: .1s  ease-in-out;width:100%;height:100%;right:-90%}
.navi.on nav{opacity:1;transition: .1s  ease-in-out ;width:100%;height:100%}
.navi .menu{position:absolute;z-index:99999;right:3%;top:5.7%;display:block;width:110px;height:50px;background:translate;padding:0 0 0 3%;}
.navi .menu ul li:nth-of-type(1){display:inline-block;opacity:1;position:absolute;right:30%;margin-top:2px;}
.navi .menu ul li:nth-of-type(2){display:inline-block;opacity:1;position:absolute;right:0}
.navi .menu button{position:relative;margin-left:5%;color: #fff; font-size: 14px;font-style:normal;margin-right:5%;width:50px;display:inline-block}
.navi .menu button.on{}
.navi .menu span{display:block; width:20px;height:2px;background:#fff;transition: .1s  ease-in-out}
.navi .menu span:nth-of-type(1) {transform:rotate(0deg) translateY(0);transform-origin:left top;text-align:right;margin:3px 0 0 0;color: #fff}
.navi .menu span:nth-of-type(2) {transform: translateX(0);opacity:1;text-align:right;margin:4px 0 0 0;color: #fff}
.navi .menu span:nth-of-type(3) {transform:rotate(0deg);transform-origin:left top;text-align:right;margin:4px 0 0 0;color: #fff}
.navi .menu.on {background:transparent;right:3%;top:6%}
.navi .menu.on span:nth-of-type(1) {transform:rotate(45deg) translateY(-5px) translateX(5px);transform-origin:left top;background:#000}
.navi .menu.on span:nth-of-type(2) {transform: translateX(0) translateX(3px);opacity:0;background:#000}
.navi .menu.on span:nth-of-type(3) {transform:rotate(-45deg) translateY(5px) translateX(2px) ;transform-origin:left top;background:#000}
.navi .article ul{position:relative;top:0;height:100%;width:100%;background:#fff ;padding-top:0;display:block;transition: .1s  ease-in-out}
/*article2*/
.article2 {background: #fff; padding:5% 5% 3% 5%;margin-top:0}
.inner2{width:100%;margin:0 auto}
.article_text2 {text-align: center; margin-top: 10%;margin-left:2%}
.article_text2 span { display: block; padding: 5px 0 }
.article_text2 span.l_title2 {font-size: 18px; color: #000; text-align: left;font-family: 'Mukta', sans-serif;font-weight:700;letter-spacing:0.1em}
.article_text2 span.l_stitle2 {font-size: 13px; color: #7a7a7a; text-align: left; min-height: 45px; line-height: 1.4;letter-spacing:0.02em}
.article_text2 span.l_stitle2 i{font-style:italic; color: #7a7a7a;letter-spacing:0.03em}
.articlelist2{text-align:center;margin: 0 0 3% 0}
.articlelist2 li {display:inline-block;padding: 0 0;margin: 0 2% 3% 2%;vertical-align:top;width:14%/* °¹¼ö¿¡ µû¶ó width 14%, 11%º¯°æ*/ }
.articlelist2 a .cover2 img {width: 100%; text-align: center}
.articlelist2 a .cover2 span {display: inline-block;font-size: 0;padding:0;margin:0;background:#000}
.articlelist2 a:hover .cover2 img {opacity: 0.5;transition:.2s  ease-in-out }
h5 {font-size: 38px;font-weight:700 ;line-height:130%;color:#815b44;font-family:"Playfair Display", serif;margin:0 0 5% 0;}
h6 {font-size: 32px;font-weight:700 ;line-height:130%;color:#1b1b1b;font-family:"Playfair Display", serif;margin:0 0 3% 0;letter-spacing:0.15em;text-align:center}

/*content*/
#content1 {position: relative; padding-top: 50px}
#content1 .Article {position: relative; display: block; text-align: center; padding-bottom: 40px; border-bottom: 1px solid #d4d4d4}
#content1 .Article h2 {font-family: 'Playfair Display', serif; font-size: 42px; color: #000; padding: 25px; letter-spacing: 0.2em;font-weight:700}
#content1 .Article p {font-size: 15px; color: #666; padding: 0 20px; letter-spacing: 0.02rem;line-height:150%}
#content1 .border_r {margin-left: -23px !important; padding-right: 23px}
#content1 .border_l {margin-left: 23px !important; padding-left: 23px}
#content1 .border_rl {}
#content1 .cont_photo {padding-top: 0px}
#content1 .cont_photo ul {margin: 30px 0}
#content1 .cont_photo a {transition: 1s}
#content1 .cont_photo a .img {position: relative;overflow:hidden;display: block;background: #000;font-size: 0;padding:0;margin:0;max-height: 620px}
#content1 .cont_photo a .img img {width: 100%; text-align: center;}
#content1 .cont_photo a .img span {position: absolute;width: 100%;text-align: center;top: 45%;left:0;color: #fff;font-size: 40px;font-family: 'Playfair Display', serif;letter-spacing: 0.05em;;font-weight:700;line-height:120%}
#content1 .cont_photo a .img2 {position: relative;overflow:hidden;display: block;background: #000;font-size: 0;padding:0;margin:0;max-height: 620px}
#content1 .cont_photo a .img2 img {width: 100%; text-align: center;}
#content1 .cont_photo a .img2 span {position: absolute;width: 100%;text-align: center;top: 55%;left:0;color: #fff;font-size: 40px;font-family: 'Playfair Display', serif;letter-spacing: 0.05em;;font-weight:700;line-height:120%}
#content1 .cont_photo a .img2 .time{font-family:'Times New Roman', serif;color: #fff;font-size: 40px}
#content1 .cont_photo a:hover .img img {opacity: 0.5;}
#content1 .cont_photo a .text {position: relative; display: block; border-bottom: 1px solid #d4d4d4; margin-top: 35px;}
#content1 .cont_photo a .text .text0{position: absolute;top: -9px;left:0;color:#666666;font-size:16px;padding: 0 20px 0 45px;font-weight:400;letter-spacing:0.05rem;background: #fff;margin-right:2%}
#content1 .cont_photo a .text .text1{position: absolute;top: -9px;left: 0;color:#666666;font-size:16px;padding: 0 20px 0 0;background: #fff;font-weight:400;letter-spacing:0.03rem;}
#content1 .cont_photo a .text .text2{position: absolute;top: -10px;right: 0;color:#000;font-size: 20px;font-weight:600;letter-spacing:0.1rem;padding: 0 0 0 20px;background: #fff;}
#content1 .cont_photo .cont2,
#content1 .cont_photo .cont4 {margin-left: 23px; margin-right: 23px}
#content2 {position: relative; background: #e5e5e5; padding:6.5% 8% 3% 8%;display:linline-block}
#content2 .text {text-align: center; margin-top: 6%}
#content2 .text span { display: block; padding: 5px 5px; }
#content2 .text span.text1 {font-family: 'Barlow Semi Condensed', sans-serif;font-size: 16px;font-weight:500;letter-spacing:0.2em; color: #a55b2f;text-transform:uppercase;margin-bottom: 1.5%}
#content2 .text span.text2 {font-size: 16px; color: #373737;letter-spacing:0.01rem;font-weight:500;line-height:1.4}
#content2 a .img img {width: 100%; text-align: center;}
#content2 a .img span {display: inline-block;font-size: 0;padding:0 8%;margin:0}
#content2 a:hover .img img {opacity: 0.5;background:#000}
.time{font-family:'Times New Roman', serif}
/*footer*/
/*.b_title {position: relative; display: block; text-align: center; padding: 3% 0 1% 0}
.b_title div {position: absolute; top:95px; left: 50%; width: 12px; height: 12px; background: #000; border-radius: 6px}
.b_title .korea img { width: 70px}
.b_title .text1 {font-size: 17px; color: #1b1b1b; margin-bottom: 2px;margin-left:2px;font-weight:600}
.b_title .text2 {font-size: 13px; color: #909090; margin-bottom: 2px}*/

.b_title {position: relative; display: block; text-align: center; padding: 130px 10px 0}
.b_title div {position: absolute; top:95px; left: 50%; width: 12px; height: 12px; background: #000; border-radius: 6px}
.b_title .korea img { width: 70px}
.b_title .text1 {font-size: 17px; color: #1b1b1b; margin-bottom: 1%;margin-left:2px;font-weight:600}
.b_title .text2 {font-size: 13px; color: #909090; margin-bottom: 1%}
#footer {padding:70px 0;background:#2f2e2e}
#footer .inner {width:98%;margin:0 auto}
#footer .line_link a {display: inline-block; padding:15px 0; margin:3px; border:1px solid rgba(255,255,255,0.2); font-size: 12px; color:#fff;width:150px;text-align:center;letter-spacing:0.05em}
#footer .sns_link {position: absolute;left: 50%;margin-left: -133px}
#footer .sns_link a {display: inline-block;margin : 12px}
#footer .sns_link a img { height: 15px;margin: 5px}
#footer .logo_link {float:right}
#footer .logo_link a {display:inline-block;margin :8px 10px}
@media (max-width:1900px){
	#content1 .cont_photo a .img {height: 620px}
	#content1 .cont_photo a .img2 {height: 620px}
}
@media (max-width:1800px){
	#content1 .cont_photo a .img {height: 550px}
	#content1 .cont_photo a .img2 {height: 550px}
}
@media (max-width:1680px){
	.navi .menu{right:4%}
	.newyear{right:9.5%}
	.navi .menu.on{right:4%}
	#content2 a .img span {padding:0 5%}
}
@media (max-width:1600px){
	.newyear{right:10%}
	#o_article2 {padding:3% 2%}
	#content1 .cont_photo a .img {height: 480px}
	#content1 .cont_photo a .img span {font-size: 36px}
	#content1 .cont_photo a .img2 {height: 480px}
	#content1 .cont_photo a .img2 span {font-size: 36px}
	.col li {float: left;padding: 0 1.5%}	
	#content2 {padding:7% 3% 3% 3%}
	#footer {padding:50px 0}	
	#footer .line_link a {width:140px;letter-spacing:0}
	#footer .sns_link {left:52%}
	#footer .logo_link a{margin:8px 0 0 -10px;text-align:right}
	#footer .logo_link a img{width:90%}
	#content2 a .img img{width:90%}
	#content2 a .img span {padding:0 0}
	#content2 .text span.text2{font-size: 15px;font-weight:600}
	#content1 .cont_photo a .text .text2{font-size: 18px;letter-spacing:0.04rem}
	#content1 .cont_photo a .text .text1{font-size: 15px;letter-spacing:0.02rem}
	#content1 .cont_photo a .text .text0{font-size: 15px;letter-spacing:0.02rem}
}
@media (max-width:1440px){
	.newyear{right:11%}
	#content1 .cont_photo a .img {height: 470px}
	#content1 .cont_photo a .img2 {height: 470px}
	#footer .line_link a{width:120px;font-size: 11px}
	#footer .sns_link{left:52%}
	#footer .sns_link a{margin:8px}
	#footer .logo_link a img{width:85%}	
	#o_article2 a .img img{width:85%}	
	#o_article2 .text span.text1{font-size: 16px}
	#o_article2 .text span.text2{font-size: 13px}
}
@media (max-width:1366px){
#content1 .cont_photo a .img {height: 440px;}
#content1 .cont_photo a .img2 {height: 440px;}
#footer .logo_link a img{width:80%}
}
@media (max-width:1280px){
	.newyear{right:12%}
	#content1 .cont_photo a .img {height: 330px;}
	#content1 .cont_photo a .img2 {height: 330px;}
	#footer .line_link a {padding:10px 15px; font-size: 11px}
	#footer .line_link a {padding:10px 15px; font-size: 11px}
	#content1 .cont_photo a .text .text2{font-size: 17px;letter-spacing:0.03rem}
	#content1 .cont_photo a .text .text1{font-size: 14px;letter-spacing:0.01rem}
	#content1 .cont_photo a .text .text0{font-size: 14px;letter-spacing:0.01rem}
	#content1{padding-top:0}
	#content1 .cont_photo a .img span{font-size: 28px}
	#content1 .cont_photo a .img2 span{font-size: 28px}
	#footer .col li {position: static; clear: both; width: 100%; text-align: center; margin:8px 0}
	#footer .line_link a{width:150px}
	.articlelist2 li{width:25%}
}
@media (max-width:1100px){
	#content1 .cont_photo a .img {height: 310px;/**/}
	#content1 .cont_photo a .img span {font-size: 30px;padding: 0 2%}
	#content1 .cont_photo a .img2 {height: 310px;/**/}
	#content1 .cont_photo a .img2 span {font-size: 30px;padding: 0 2%}
	#content1 .cont_photo a .text {margin-top: 33px;}
}
@media (max-width:1024px){		
	.newyear{right:14%;top:7.1%}
	#header h1.logo{left:30px}
	#content1 .cont_photo a .img {height: 310px}
	#content1 .cont_photo a .img span {font-size: 26px}	
	#content1 .cont_photo a .img2 {height: 310px;}
	#content1 .cont_photo a .img2 span {font-size: 26px}
	#content1 .cont_photo a .text .text2{font-size: 15px;letter-spacing:0.02rem;padding:0 0 0 10px}
	#content1 .cont_photo a .text .text1{font-size: 13px;padding:0 10px 0 0}
	#content1 .cont_photo a .text .text0{font-size: 13px;padding:0 10px 0 45px}
	#o_article2 .text span.text1{font-size: 14px}
	#o_article2 .text span.text2{font-size: 10px}	
	#content2 .text span.text2{font-size: 12px}
}
@media (max-width:960px){
	#content1 .cont_photo a .img {height: 300px}
	#content1 .cont_photo a .img2 {height: 300px}
}
@media (max-width:800px){
	.col li {padding: 20px 2% 0 !important}
	#content1 .border_r {margin-left: 0px !important; padding-left: 23px; padding-right: 23px}
	#content1 .cont_photo ul {margin:0 0}	
	#content1 .cont_photo a .img span {font-size: 23px}
	#content1 .cont_photo a .img2 span {font-size: 23px}
	#content1 .cont_photo a .text {margin-top: 22px}
	#content1 .cont_photo a .text .text0{padding: 0 20px 0 0px}	
	#content2 .text{margin:3% 0 6% 0}
	.col2 li,
	.col3 li,
	.col4 li,
	.col9_1,
	.col9_2,
	.col9_3,
	.col9_4,
	.col9_5,
	.col9_6,
	.col9_7,
	.col9_8,
	.col9_9,
	.col12_1,
	.col12_2,
	.col12_3,
	.col12_4,
	.col12_5,
	.col12_6,
	.col12_7,
	.col12_8,
	.col12_9,
	.col12_10,
	.col12_11,
	.col12_12 {width: 100%}
	body {font-size: 13px;}
}
@media (max-width:768px){
	#header h1.logo {top: 6%; left: 30px}
	#header h1.logo a img {width: 70%}
	#content1 .border_r {margin-left: 0px !important}
	.newyear{top:7%; right:19%}
	.navi{right:7%;top:6%}
	#content1 .Article p{font-size:13px}
	#o_article2 .col5 li {width: 20%}
	#o_article2{height:150%}
	#header{height:920px}
	#content1 .cont_photo a .img {height: 580px}
	#content1{margin-bottom:20px}
	#content2{padding:10% 3% 3% 3%}
	#o_article2 .col5 li {width: 25%}
	#header .visual {background: url(../images/visual_mobile.png) no-repeat center;background-size: cover}
	.articlelist2 li{width:40%}
	#content2 .text span.text2{font-size: 14px}
	.mobilevisual{display:block}
	.pcvisual{display:none}
	#content1 .Article{margin-bottom:10px}
	.b_title div {width: 7px; height: 7px; top: 50px}
	.b_title .korea img {width: 50px}
	.b_title .text1 {font-size: 14px;line-height:2}
	.b_title .text2 {font-size: 12px;line-height:2}
}
@media (max-width:700px){
	#content1 .Article h2 {font-size: 30px}
	#content1 .Article p {font-size: 14px}
}
@media (max-width:650px){
	#header .visual {height: 400px}
	#header .visual p {font-size:16px}	

}
@media (max-width:570px){
	#o_article2 .col5 li {width: 25%}
	#header {height: 600px; border: 0}
	.navi{right:2%;top:-2.5%}
	.newyear{right:22%;top:5.2%}
	#o_article2{padding:7% 2%}	
	#content1 .cont_photo a .img {height:340px;/**/}	
	#content1 .cont_photo a .img span {font-size: 21px}
	#content1 .cont_photo a .img2 {height:340px;/**/}
	#content1 .cont_photo a .img2 span {font-size: 21px}
	#content1 .cont_photo a .text .text2 {font-size: 15px;padding-top: 0px}
	#content1 {padding-top: 30px; padding-bottom: 30px}
	#content1 .Article h2 {font-size: 24px; padding:15px 20px}
	#content1 .Article p {font-size: 12px}
	#header {height: 590px; border: 0}
	#header .visual {height: 590px}
	#header h1.logo {width: 100px;top: 5%; left: 4%}
	#header .menu {top: 13px; right: 15px; font-size: 11px}
	#header .visual p {padding: 15px 20px; font-size: 15px}
	#o_article2 h2{font-size:26px}
	#footer .line_link a{width:200px}	
	#content1 .Article{padding-bottom:10px}
}
@media (max-width:425px){
	#header .visual {background: url(../images/visual_mobile.png) no-repeat center;background-size: 100% auto;background-position:top}
	#o_article2 .col5 li{width:50%}		
	.navi{right:3%;top:-1.8%}
	.b_title { padding: 20% 0 2% 0}
	.b_title .korea img {width: 40px}
	.b_title .text1 {font-size: 12px}
	.b_title .text2 {font-size: 11px}
	.navi .menu button{display:none}
	.newyear{right:14%;top:6%}
	#header {height: 500px; border: 0}
	.article2{height:500%}
	h6{font-size: 22px;letter-spacing:0.05em;margin-bottom:5%}
	#content1 .Article{border-bottom:0px solid #fff}
	#content1 .cont_photo a .text .text2{font-size: 14px;letter-spacing:0.01rem;padding:0 0 0 7px}
	#content1 .cont_photo a .text .text1{font-size: 12px;letter-spacing:0.0rem;padding:0 7px 0 0}
	#content1 .cont_photo a .text .text0{font-size: 12px;letter-spacing:0.0rem;padding:0 7px 0 0}
	.article_text2 span.l_title2{font-size:16px;letter-spacing:0.05em}
	.article_text2 span.l_stitle2{font-size:12px;letter-spacing:0.01em}
	#content1 .cont_photo a .text {margin-top: 15px}
	#content1 .cont_photo a .img{height:100%;max-height:345}
}
@media (max-width:360px){	
	#header {height: 450px; border: 0}
	.navi{right:3%;top:-0.8%}
	.b_title .text2 {display: block; margin-top:5px}
	.newyear{right:15%;top:6.6%}
	h6{font-size: 20px;letter-spacing:0.05em}
	#header h1.logo{top:6.6%}
	#content1 .cont_photo a .img {height:100%;max-height:345}
	#content1 .cont_photo a .img span {font-size: 18px}
	#content1 .cont_photo a .img2 {height:300px;/**/}
	#content1 .cont_photo a .img2 span {font-size: 18px}	
	#content1 .cont_photo a .text .text2{font-size: 13px}
	#content1 .cont_photo a .text .text1{font-size: 11px}
	#content1 .cont_photo a .text .text0{font-size: 11px}
	.article_text2 span.l_title2{font-size:15px;letter-spacing:0.05em}
	.article_text2 span.l_stitle2{font-size:11px;letter-spacing:0.01em}
}