@import url("https://use.typekit.net/nwa5jmn.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,900;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');
.main_tit_it {font-family: 'Roboto Condensed', sans-serif;}
.text_line {outline: 1px solid #fff; color:#000}
.noto{font-family:'Noto Sans', sans-serif;}
/*reset*/
body{overflow-x: hidden;}
body, h1, h2, h3, h4, h5, h6, p, ul, li,button,dl,dt,dd,form,fieldset,legend,table,thead,tbody,tfoot,tr,td,th,span{ font-family:'Noto Sans', sans-serif;font-weight: 400; margin:0; padding:0; word-break:keep-all; font-size: 20px; line-height:180%;}
em,address{font-style:normal;}
ul, li{list-style:none;}
button{border:0;background:none;cursor:pointer;}
button>span{-ms-transform: translate(0px, -0.5px);}
*{box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-webkit-text-size-adjust:none;/*ios 확대방지*/}
a img{border:0;}
fieldset{border:0;}
legend{display:none;}
body,html,button,select,input{/* font-family: 'Poppins', sans-serif; */font-size:15px;color:#000;line-height: 1.5;letter-spacing: 0;}
a{text-decoration:none;color:#333;}
fieldset{border:0;}
legend{display:none;}
table{width: 100%;table-layout:fixed; margin:0; padding:0; border:0; border-collapse: collapse; border-spacing: 0;}
table caption{display:none;}
a:active, a:focus, button:focus, button:active{outline-style: dotted !important; outline-color: #ccc !important;outline-width: 1px !important;}
.img-responsive {display:block;max-width:100%;height:auto;}
.co_black{color:#000;display:flex;align-items: center;font-size: 16px;font-weight: 600;height: 60px;font-weight: 700;font-family: "roc-grotesk", sans-serif;}

/*공통*/
header{position: absolute;left: 0;top: 0;width: 100%;z-index: 300;}

.logo_new{text-align:center;margin:2% auto;z-index:9}
.vol{position:absolute; left:2%; top:20%; color:#fff;font-family: "roc-grotesk", sans-serif;font-size: 16px;font-weight: 600;text-transform:uppercase;}
.vol_b{position:absolute; left:2%; top:20%; color:#000;font-family: "roc-grotesk", sans-serif;font-size: 16px;font-weight: 600;text-transform:uppercase;}


header .wrap{display: flex;align-items: flex-end;justify-content: space-between;padding: 20px 30px;height: 100%;/* overflow: hidden; */}
header .l_text {color: #fff;display: flex;align-items: center;font-size: 16px;font-weight: 600;height: 60px;text-transform:uppercase;
font-weight: 700;}
header .l_text_b {color: #000;display: flex;align-items: center;font-size: 16px;font-weight: 600;height: 60px;text-transform:uppercase;font-weight: 700;}
.logo{font-size: 0;line-height: 0;width: 150px;height: 60px;background: url(../../img/logo_w.png) no-repeat 40%;}
.logo_b{font-size: 0;line-height: 0;width: 150px;height: 60px;background: url(../../img/logo_b.png) no-repeat 50%;}
.right_menu .p{font-size: 19px;display: block;font-weight: 600;letter-spacing: 0;margin-right: 35px;}
.right_menu .p.nav_black{color: #000;}

.nav_open{position: fixed;right: 33px;top: 20px;font-size: 16px;font-weight: 500;color: #fff;line-heigh:0;width: 60px;height: 60px;display: block;transition:0.4s;}
.nav_open:hover {border:1px solid #fff; transition:0.4s; box-shadow: 2px 5px 5px #00000055 }
.nav_open.bg_c {background:#000; transition:0.4s;}
.nav_open.bg_c:hover {border:none;}
.nav_open.bg_f {background:#fff; transition:0.4s;}
.nav_open.bg_f:hover {border:none;}

.fontb{color:#000;}
.mb5{margin-bottom:5%}
.mb10{margin-bottom:10%}

.underline {text-decoration: underline;}
.fw_100 {font-weight: 100 !important;}
.fw_200 {font-weight: 200 !important;}
.fw_300 {font-weight: 300 !important;}
.fw_400 {font-weight: 400 !important;}
.fw_500 {font-weight: 500 !important;}
.fw_600 {font-weight: 600 !important;}
.fw_700 {font-weight: 700 !important;}
.fw_800 {font-weight: 800 !important;}
.m {display: none;}
.m540{display: none;}
.pc540{display:block}

.navi{position:fixed;z-index:9999;top:0;opacity: 0;transition:right .5s ease-in-out, opacity .1s ease-in-out;width: 100%;height: 100%;right: -100%;}
.navi.on{right:0;top:0;display:block;opacity:1;overflow-y: auto;transition:right .5s ease-in-out, opacity .5s ease-in-out;}
/*article2*/
.article2 {background: #fff;padding: 3% 5% 2% 5%;margin-top:0;box-shadow: 0 0 80px #00000055;min-height: 70vh;}
.nav_close{font-size:0;line-height:0;width: 20px;height: 20px;position:absolute;right: 25px;top: 25px;display: block;padding: 2vw;}
.nav_close:before, .nav_close:after{content:'';width: 100%;height: 2px;background-color: #000;position: absolute;left: 0;}
.nav_close:before{transform: rotate(45deg);}
.nav_close:after{transform: rotate(-45deg);}
.inner2{width:100%;margin:0 auto}

.article_text2 {text-align: center;margin-top: 3%;margin-left:2%}
.article_text2 span { display: block; padding: 5px 0 }
.article_text2 span.l_title2 { font-family: 'futura-pt', sans-serif; font-size: 18px; color: #252525; text-align: left;font-weight:700;}
.article_text2 span.l_stitle2 {font-family: 'Noto Sans', sans-serif;font-size: 13px;color: #555;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;vertical-align:top;margin: 0 2% 2% 2%;width:14%;}
.articlelist2.col6 li {margin: 0 1.5% 3% 1.5%;width: 11.75%;}
.articlelist2 a .cover2 span {display: inline-block;font-size: 0;padding:0;margin:0;width: 100%;/* min-height: 90px; */overflow: hidden;}
.articlelist2 a .cover2 img {width: 100%; text-align: center}
.articlelist2 a:hover .cover2 img {opacity: 0.5;transition:.2s  ease-in-out }
.article-title{font-size: 35px;font-weight: 700;line-height: 130%;color: #4f3118;margin: 0 0 3% 0;letter-spacing: 0em;text-align: center;}



/*footer*/
.footer {overflow: hidden;background: #000000; padding: 5% 0 3% 0;}
.footer .inner_w {width:100%;/*display: flex;justify-content: space-around;gap: 50px;overflow: hidden;align-items: flex-end;*/display:block;padding: 5% 5%;}
.footer .copyright {color: #fff ; float:left;padding: 0 0 3% 0;}
.footer .copyright .f_sns {padding-bottom: 80px;}
.footer .copyright .f_sns a {display:inline-block;padding: 0;margin-right: 10px;margin-bottom:0px;opacity:0.5;}
.footer .copyright .f_sns a:hover {opacity:1;}
.footer .copyright .f_logo {margin-bottom:15px;}
.footer .copyright .f_logo img {display:inline-block; padding: 5px; margin-right:10px; }
.footer .copyright p{font-size:14px; color:#c8c8c8}
.footer .btn {display: flex; gap: 50px; float:right;padding: 0 0 3% 0; }
.footer .btn div {width: 390px;max-width: 40vw;}
.footer .btn h2 { font-family: "paralucent-condensed", sans-serif;font-weight: 700; color: #aaa; font-size: 48px; text-transform: uppercase;  border-bottom: 2px solid #aaa;}
.footer .btn a {position: relative; display: block;color: #fff;font-size: 30px;font-weight: 500;padding:20px 5px;border-bottom: 2px solid #aaa;transition: .4s;
    background: url(../../img/arrow.png) no-repeat right 10px top 50%;transition: .4s;}
.footer .btn a:after {display: block; content: ""; width: 100%; height: 100%; background: #00000066; position: absolute; left: 0; top:0;}
.footer .btn a:hover {color: #fff; background: url(../../img/arrow.png) no-repeat right 5px top 50%;border-bottom: 2px solid #fff;transition: .4s;}
.footer .btn a:hover:after {background: #00000000; transition: .4s}
.flex.flex_lr.flex_col2 {display:flex;justify-content:space-between;gap: 1vw;}



/*RW*/
@media screen and (max-width: 1680px) {
    .flex.flex_lr.flex_col2 {display:flex;justify-content: center;flex-direction: column;}
}
@media screen and (max-width: 1440px) {
    .logo {margin-right: 85px;}
	.footer .btn div {width:320px;}
	.footer .btn h2 {font-size:42px;}
    .footer .btn a,
    .footer .btn a:hover {font-size:24px;background-size: 16px;}
}
@media screen and (max-width: 1280px) {
    .articlelist2 {text-align:left;}
    .nav_close {top: 5vw; right: 5vw;}
    .footer .inner_w {display: flex;flex-direction:column;align-items: center;gap: 2vw;}
    .footer .btn h2 {font-size:20px;}
    .footer .btn a,
    .footer .btn a:hover {font-size:16px;background-size: 16px;}
    .flex.flex_lr.flex_col2 {flex-direction: column;}
	.footer .btn {float:none;margin:0 auto;}
    .footer .copyright{float:none;text-align: center;padding: 0;}
}
/*아이패드 프로*/
@media screen and (max-width: 1180px) {
}
/*아이패드 에어*/
@media screen and (max-width:1024px) {
 .articlelist2.col6 li,
    .articlelist2 li{width: 28%;margin: 0 2% 10% 2%;}
}
@media screen and (max-width: 960px){
    .circle-text {font-size: 20px;min-width: 170px;}
    .pc {display: none;}
    .m {display: block;}
    .footer .copyright{text-align: center;}
}
@media screen and (max-width: 768px) {
    header .right_menu{right: 30px;}
    header .right_menu .p {font-size: 16px;margin-right: 20px;}
    header .nav_open{width: 42px;height: 42px;font-size: 12px;right: 2.8vw;top: 2.8vw;letter-spacing: 0.05em;}
    header .l_text {font-size: 13px;display: none;}
	.vol{font-size: 13px}
    header .wrap {padding: 8px 23px;}
    .articlelist2.col6 li,
    .articlelist2 li {width: 40%;}
    .footer .copyright{font-size:3vw;padding:0 1vw 1vw;text-align: center;}
    .footer .btn a,
    .footer .btn a:hover {font-size:3.5vw;padding: 3vw 1vw;}
}
@media screen and (max-width: 600px) {
    .footer {padding: 10vw 0;border: none;}
	.footer .btn {}
    .footer .btn h2 {font-size:5vw}
    .footer .copyright p{font-size:3vw;padding:0 1vw 1vw;}
    .f_sns a {transform:scale(0.7);}
    .footer .copyright .f_sns { padding-bottom:10vw }
}
@media screen and (max-width: 540px) {
    #aside.show {bottom: -17vw;}
    .sub_visual1 .inner > div {top: 35vh;}
	.footer .btn{gap:20px;}
	.m540{display: block;}
	.pc540{display:none}
}
@media screen and (max-width: 414px) {
    .right_menu .p {font-size: 13px;margin-right: 10px;}
    .nav_open {width: 23px;height: 15px;}
    .article-title{font-size: 22px;letter-spacing: 0.05em;margin-bottom: 5%;}
    .article_text2 span.l_title2 {font-size: 16px;letter-spacing: 0.05em;}
    .article_text2 span.l_stitle2 {font-size: 12px;letter-spacing: 0.01em;}
	.vol, .vol_b{font-size:11px;top:45%}
	.logo_new{margin:5% auto;}
}