@charset "utf-8";
/******** Font ************/
@import url("https://cdn.jsdelivr.net/gh/moonspam/NanumBarunGothic@1.0/nanumbarungothicsubset.css");
@import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&display=swap');
@import url("https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css");
@import url("https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@700&display=swap");

/* page-transition */
#page-transition { opacity:1; position:fixed; top:0; left:0; width:100%; height:100vh; z-index:100000; transition:transform 0.3s 0.1s ease-in-out ; -webkit-transition:transform 0.3s 0.1s ease-in-out ; -moz-transition:transform 0.3s 0.1s ease-in-out ; -ms-transition:transform 0.3s 0.1s ease-in-out ; -o-transition:transform 0.3s 0.1s ease-in-out ; /*background:#343a94; */transform:translate(0, 0) ; -webkit-transform:translate(0, 0) ; -moz-transform:translate(0, 0) ; -ms-transform:translate(0, 0) ; -o-transform:translate(0, 0) ;
}
/* #page-transition.in { opacity:0; visibility:hidden; } */
#page-transition.in { opacity:1; transform:translate(-100vw, 0) ; -webkit-transform:translate(-100vw, 0) ; -moz-transform:translate(-100vw, 0) ; -ms-transform:translate(-100vw, 0) ; -o-transform:translate(-100vw, 0) ; }
/* #page-transition.out { visibility: visible; opacity:100%;  } */
#page-transition.out { opacity:1; transform:translate(0, 0) ; -webkit-transform:translate(0, 0) ; -moz-transform:translate(0, 0) ; -ms-transform:translate(0, 0) ; -o-transform:translate(0, 0) ; }

/******** Reset ***********/
html{ height:auto; overflow-x:hidden; overflow-y:auto; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
body{ overflow-x:hidden; overflow-y:auto; height:100%; min-height:100%; padding:0; margin:0; font-weight:bold; font-family:"NanumSquare","MalgunGothic",Dotum,Arial,sans-serif; font-size:19px; color:#000; line-height:1.5; letter-spacing:-0.05em;  background:#ffffff; -webkit-overflow-scrolling:touch; }
* {word-break:keep-all;}
body,p,h1,h2,h3,h4,h5,h6,table,caption,form,fieldset,legend,span,div,th,td,address{ margin:0; padding:0; }
ul,ol,li,dl,dt,dd{ list-style:none; margin:0; padding:0px; }
img{ border:none; max-width:100% !important; vertical-align:middle; }
a { color:inherit; text-decoration:none; }
a:hover,a:active,a:focus { color:inherit; text-decoration:none; }
hr { border:0; border-top:1px solid #000; margin:0; height:1px; }
iframe { border:none; }
table{ border-collapse:collapse; border-spacing:0; width:100%; }
button, input, select, textarea { margin:0; font-size:100%; }
button, input { *overflow:visible; line-height:normal; *line-height:12px; }
button::-moz-focus-inner, input::-moz-focus-inner { padding:0; border:0; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { cursor:pointer; -webkit-appearance:button; }
select, button, input[type="button"], input[type="reset"], input[type="submit"], input[type="radio"], input[type="checkbox"] { cursor:pointer; }
input[type="search"] { -webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; -webkit-appearance:textfield; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance:none; }
textarea { overflow:auto; vertical-align:top; }
*,*:before,*:after { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -ms-box-sizing:border-box; }
:lang(en) { letter-spacing:0px; word-break:Keep-all; }

#skipnavi{ }
#skipnavi li a{ display:block; font-size:16px; width:100%; position:absolute; top:-10000px; left:0; text-align:center; z-index:999999; }
#skipnavi li a:focus{ position:absolute; top:0; left:0; font-weight:bold; color:#fff; background:#272727; padding:20px 0; height:14px; }
/* selectbox 디자인만 */
select:not(.no-style) { font-family:inherit; border-radius:0px; -webkit-appearance:none; -moz-appearance:none; appearance:none; outline:0; }
select::-ms-expand { display:none; }
.input-box { position:relative; }
.input-box label { position:absolute; top:1px; left:1px; padding:.5em .8em; color:#999; cursor:text; }
/*input*/
input[type="text"],
input[type="password"],
input[type="tel"] { height:auto; line-height:normal; padding:8px 10px; border:none; width:auto; border-bottom:1px solid #dfdfdf; font-size:18px; color:#333; font-weight:normal; font-family:inherit; border-radius:0; outline-style:none; -webkit-appearance:none; -moz-appearance:none; appearance:none; }

/******* Common Class ***************/
.clearfix { *zoom:1; }
.clearfix:before, .clearfix:after { display:table; line-height:0; content:""; }
.clearfix:after { clear:both; }
.hidden { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; }
.of-hi{ overflow:hidden; }
.vi-hi { visibility:hidden; }
.blind{ width:0; height:0; text-indent:-10000px; font-size:0px; line-height:0px; position:absolute; left:-99999px; }
.fl-l { float:left; }
.fl-r { float:right; }
.cl-b { width:0; height:0; font-size:0; line-height:0; clear:both; }
.ta-c { text-align:center; }
.ta-l { text-align:left; }
.ta-r { text-align:right; }
.f-bold { font-weight:800 !important; }
.f-medium { font-weight: 500 !important; }
.pos-rel { position:relative; }

.img-box { width:100%; margin:0; padding:0; position:relative; float:left; }
.img-box img { width:100%; height:auto; float:left; }
.img-box > [class*="col-"]{ padding-left:0; padding-right:0; position:relative; float:left; }
.img-box > [class*="col-"] img { width:100%; height:auto; float:left; }

.nmt10 { margin-top:-10px; }
.nmt20{ margin-top:-20px; }
.nmt50 { margin-top:-50px; }
.nmt80{ margin-top:-80px; }

.mt0 { margin-top:0; }
.mt5 { margin-top:5px; }
.mt10 { margin-top:10px; }
.mt15 { margin-top:15px; }
.mt20 { margin-top:20px; }
.mt25 { margin-top:25px; }
.mt30 { margin-top:30px; }
.mt35 { margin-top:35px; }
.mt40 { margin-top:40px; }
.mt45 { margin-top:45px; }
.mt50 { margin-top:50px; }
.mt55 { margin-top:55px; }
.mt60 { margin-top:60px; }
.mt65 { margin-top:65px; }
.mt70 { margin-top:70px; }
.mt75 { margin-top:75px; }
.mt80 { margin-top:80px; }
.mt85 { margin-top:85px; }
.mt90 { margin-top:90px; }
.mt95 { margin-top:95px; }
.mt100 { margin-top:100px; }
.mt105 { margin-top:105px; }
.mt110 { margin-top:110px; }
.mt115 { margin-top:115px; }
.mt120 { margin-top:120px; }
.mt140 { margin-top:140px; }
.mt160 { margin-top:160px; }

.mb0 { margin-bottom:0; }
.mb5 { margin-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb25 { margin-bottom:25px; }
.mb30 { margin-bottom:30px; }
.mb35 { margin-bottom:35px; }
.mb40 { margin-bottom:40px; }
.mb45 { margin-bottom:45px; }
.mb50 { margin-bottom:50px; }
.mb55 { margin-bottom:55px; }
.mb60 { margin-bottom:60px; }
.mb65 { margin-bottom:65px; }
.mb70 { margin-bottom:70px; }
.mb75 { margin-bottom:75px; }
.mb80 { margin-bottom:80px; }
.mb85 { margin-bottom:85px; }
.mb90 { margin-bottom:90px; }
.mb95 { margin-bottom:95px; }
.mb100 { margin-bottom:100px; }
.mb105 { margin-bottom:105px; }
.mb110 { margin-bottom:110px; }
.mb115 { margin-bottom:115px; }
.mb120 { margin-bottom:120px; }
.mb140 { margin-bottom:140px; }

.pt0 { padding-top:0; }
.pt10 { padding-top:10px; }
.pt15 { padding-top:15px; }
.pt20 { padding-top:20px; }
.pt25 { padding-top:25px; }
.pt30 { padding-top:30px; }
.pt35 { padding-top:35px; }
.pt40 { padding-top:40px; }
.pt45 { padding-top:45px; }
.pt50 { padding-top:50px; }
.pt55 { padding-top:55px; }
.pt60 { padding-top:60px; }
.pt65 { padding-top:65px; }
.pt70 { padding-top:70px; }
.pt75 { padding-top:75px; }
.pt80 { padding-top:80px; }
.pt85 { padding-top:85px; }
.pt90 { padding-top:90px; }
.pt95 { padding-top:95px; }
.pt100 { padding-top:100px; }
.pt120 { padding-top:120px; }
.pt130 { padding-top:130px; }
.pt140 { padding-top:140px; }
.pt150 { padding-top:150px; }

.pt0 { padding-bottom:0; }
.pb10 { padding-bottom:10px; }
.pb15 { padding-bottom:15px; }
.pb20 { padding-bottom:20px; }
.pb25 { padding-bottom:25px; }
.pb30 { padding-bottom:30px; }
.pb35 { padding-bottom:35px; }
.pb40 { padding-bottom:40px; }
.pb45 { padding-bottom:45px; }
.pb50 { padding-bottom:50px; }
.pb55 { padding-bottom:55px; }
.pb60 { padding-bottom:60px; }
.pb65 { padding-bottom:65px; }
.pb70 { padding-bottom:70px; }
.pb75 { padding-bottom:75px; }
.pb80 { padding-bottom:80px; }
.pb85 { padding-bottom:85px; }
.pb90 { padding-bottom:90px; }
.pb95 { padding-bottom:95px; }
.pb100 { padding-bottom:100px; }
.pb120 { padding-bottom:120px; }
.pb140 { padding-bottom:140px !important; }
.pb150 { padding-bottom:150px; }

.pd0 { padding:0; }
.pdl0 { padding-left:0; }
.pdr0 { padding-right:0; }
.mg0 { margin:0 }

.w100 { width:100%; }

/************** Layout *******************/
body.block::after { content:''; position:fixed; width:100%; height:100%; background-color:rgba(0,0,0,.3); left:0px; top:0px; z-index:9997; }

#header { color:#ebebeb; position:fixed; width:100%; height:80px; z-index:9998; transition:all ease-in-out 0.315s; -webkit-transition:all ease-in-out 0.315s; -moz-transition:all ease-in-out 0.315s; -ms-transition:all ease-in-out 0.315s; -o-transition:all ease-in-out 0.315s; }
#header.active { background-color:rgba(0,0,0,0.8); }
#header > div,#footer > div { max-width:1280px; margin:0 auto; position:relative; }
#header .logo { position:absolute; float:left; left:0px; top:0px; height:80px; line-height:80px; }

#header .webzine-tit { margin-left:110px; padding-top:24px; }
#header .webzine-tit .tit { font-size:14px; }
#header .webzine-tit .month { font-size:24px; font-weight:bold; text-transform:uppercase; }
#header .menu { position:absolute; z-index:5; top:0px; right:0px; width:80px; text-indent:-9999px; }
#header .menu a { display:block; margin:auto; z-index:3; padding:40px 20px; transition:all ease-out 0.3s; -webkit-transition:all ease-out 0.3s; }
#header .menu a span{ position:absolute; right:25%; top:50%; width:28px; height:2px; background:#ffffff; transition:all ease-out 0.3s; -webkit-transition:all ease-out 0.3s; }
#header .menu a span:first-child{ margin-top:-10px; }
#header .menu a span.last { margin-top:10px;}
#header .menu.active a span{ transform:rotate(45deg); -webkit-transform:rotate(45deg); background-color:#c40d3f; }
#header .menu.active a span:first-child { transform:rotate(135deg); -webkit-transform:rotate(135deg); margin-top:0 ; }
#header .menu.active a span.last { display:none;}
#header .select-wrap { overflow:hidden; position:absolute; right:80px; top:27px; width:220px; }
#header .select-box { float:left; width:160px; height:100%; position:relative; z-index:1; margin:auto; background:none; }
#header .select-box select { width:100%; vertical-align:middle; height:38px; line-height:38px; border:1px solid #dcdcdc; border-right:none; background-color:#fff; font-size:14px; color:#6c6c6c; letter-spacing:-0.025em; padding:0px 25px 0px 12px; background-repeat:no-repeat; background-image:url('/webzine/202303/img/common/icon_select.png'); background-position:right center; }
#header .select-box select option { color:#333333; }
#header .select-wrap button { float:left; width:60px; height:38px; font-size:15px; line-height:38px; border:none; background:#393939; color:#fff; letter-spacing:-0.05em; }
.fluid-max-1280 { max-width:1280px; }
/* .article-wrap .container { padding-left:20px; padding-right:20px; } */

#footer { overflow:hidden; background-color:#fff; padding:60px 28px 70px 28px; width:100%; border-top:1px solid #bfbfbf; letter-spacing:0.5px; position:relative; }

#footer > .container > .row > div:first-child { float:left; }
#footer > .container > .row > div:last-child { float:right; }
#footer > .container > .row > div:last-child > div { float:left; }
#footer > .container > .row > div:last-child > div:first-child { margin-right:57px; }
#footer > .container .preview > div {  }
#footer > .container .preview a { display:inline-block; vertical-align: top; padding-bottom:3px; }
#footer > .container .preview .go-btn { margin-left:5px; }
#footer > .container .preview .newsletter-btn { border-bottom:1px solid #ffffff; }
#footer > .container .preview  a > * { float:left; }
#footer > .container .preview  a > p { font-size:16px; margin-left:8px; }
#footer > .container .preview div:last-child a > p { margin-top:-1px; }
#footer > .container .preview div:last-child a > img { margin-top:2px; }
#footer > .container .preview .select-box select { background:url('/webzine/202303/img/common/icon_last.png') no-repeat left top; color:#ffffff; padding-left:40px; padding-bottom:2px; font-size:16px; border:none; border-bottom:1px solid #ffffff; }
#footer > .container .preview .select-box select option { color:#333333; }
#footer > .container .preview .select-box select * { font-size:12px; }


#footer p { font-size:12px; color:#ffffff; }
#footer .copyright .copy { font-size:16px; margin-bottom:9px; text-transform:uppercase; }
#footer .copyright .copy span { font-size:16px; margin-bottom:9px; text-transform: none;  }
#footer .copyright .explain { font-size:14px; color:#b8b8b8; font-weight:400; }

#gnbWrap { position:fixed; z-index:9999; top:80px; width:100%; display:none; }
#gnbWrap > div { position:absolute; right:0;  width:100%; padding-top:70px; padding-bottom:90px; overflow:hidden; background-color:rgba(0,0,0,0.8); display:block; }
#gnbWrap .container { width:100%; max-width:1100px; }
#gnbWrap .container .row { margin-left:0; margin-right:-50px; }
#gnbWrap .tit, #gnbWrap ul { float:left; }
#gnbWrap .tit { position:relative; padding-left:64px; }
#gnbWrap .tit:before { content:""; display:block; width:51px; height:38px; position:absolute; left:0; top:0; }
#gnbWrap .container .row:nth-child(1) .tit { color:#6d9fe2; }
#gnbWrap .container .row:nth-child(1) .tit:before { background:url("/webzine/202303/img/common/icon_gnbtit01.png") left top/contain no-repeat; }
#gnbWrap .container .row:nth-child(2) .tit { color:#f582a0; }
#gnbWrap .container .row:nth-child(2) .tit:before { background:url("/webzine/202303/img/common/icon_gnbtit02.png") left top/contain no-repeat; }
#gnbWrap .container .row:nth-child(3) .tit { color:#73bd78; }
#gnbWrap .container .row:nth-child(3) .tit:before { background:url("/webzine/202303/img/common/icon_gnbtit03.png") left top/contain no-repeat; }
#gnbWrap ul { padding-bottom:47px; }

#gnbWrap ul li { float:left;  }
#gnbWrap ul li a { position:relative; }
#gnbWrap ul li a.newAvil:after { content:""; background:url("/webzine/202303/img/common/icon_new.png") left top/contain no-repeat; width:20px; height:20px; position:absolute; top:-10px; right:-20px; }
#gnbWrap .gnb-list .tit, #gnbWrap .gnb-list .tit a { font-weight:400; font-size:23px; color:#fff; padding-bottom:15px; padding-left:32px; font-weight:900; line-height:1.7; letter-spacing:-0.025em; }
#gnbWrap .gnb-list .tit:before { content:''; display:block; width:35px; height:2px; background:#b7b7b7; margin-bottom:10px; margin-left:1px; }
#gnbWrap .gnb-list .tit a { padding-left:0; }
#gnbWrap .gnb-list .tit a:hover { color:#c40d3f; }
#gnbWrap .gnb-list .tit.alone a { padding-bottom:0; margin-bottom:0; }
#gnbWrap .gnb-list { position:relative; overflow:hidden; float:left; width:33.33333333%; min-height:286px; }
#gnbWrap .gnb-list:before { content:''; position:absolute; display:block; top:0; left:0; width:1px; height:100%; background:#565656; }
#gnbWrap .gnb-list .border { overflow:hidden; width:100%; }

#gnbWrap > div .gnb-close { position:absolute; top:25px; right:5.5%; z-index:10; }
#gnbWrap > div #scroll { overflow-y:auto; overflow:visible !important; }
#gnbWrap > div h2 { color:#fff; font-size:24px; margin:40px; line-height:1.5; }
#gnbWrap > div h2 span { font-size:16px; display:block; }
#gnbWrap > div ul li > .tit:active { color:#c40d3f; }
#gnbWrap .border > ul { overflow:hidden; display:inline-block; float:left; position:relative; width:50%; margin-top:18px; margin-bottom:16px; padding-left:8px; padding-right:8px; }
#gnbWrap > div ul li span { color:#838383; font-size:14px; letter-spacing:-0.025em; -webkit-transition:all 0.25s; -moz-transition:all 0.25s; -ms-transition:all 0.25s; -o-transition:all 0.25s; }
#gnbWrap > div ul li a { font-family:"NanumBarunGothic","MalgunGothic",Dotum,Arial,sans-serif; width:fit-content; box-sizing:border-box; color:#fff; font-size:20px; margin:0 23px; display:block; line-height:1.7; letter-spacing:-0.025em; -webkit-transition:all 0.25s; -moz-transition:all 0.25s; -ms-transition:all 0.25s; -o-transition:all 0.25s; font-weight:500; }
#gnbWrap .gnb-list li.active a, #gnbWrap .gnb-list .tit.active { color:#fff; }
#gnbWrap .gnb-list .tit.active:before { background:#fff; }
#gnbWrap > div .gnb-box { width:100%; height:100%; }

#gnbWrap .tit { width:280px; font-size:26px; line-height:1.35; color:#ffffff; font-family:"Black Han Sans","MalgunGothic",Dotum,Arial,sans-serif; font-weight:normal; }
#gnbWrap .tit.item1 { background-image:url('/webzine/202303/img/common/icon_kumho.png'); }
#gnbWrap .tit.item2 { background-image:url('/webzine/202303/img/common/icon_story.png'); }
#gnbWrap .tit.item3 { background-image:url('/webzine/202303/img/common/icon_luckybox.png'); }
#gnbWrap .tit.item4 { background-image:url('/webzine/202303/img/common/icon_arthall.png'); }
#gnbWrap .tit.item5 { background-image:url('/webzine/202303/img/common/icon_notice.png'); }
#gnbWrap .col-sm-3 { min-height:475px; border-left:1px solid #323030; }
#gnbWrap .col-sm-3:first-child { border-left:none; }
#gnbWrap .tit.active,#gnbWrap > div ul li span.active, #gnbWrap li.active a, #gnbWrap .col-sm-3 li.active a:hover { box-shadow:0 -2px 0 0 #c4183f inset; }
#gnbWrap > div ul li.active span { color:#c40d3f !important; }
#gnbWrap .tit.active.item1 { background-image:url('/webzine/202303/img/common/icon_kumho_active.png'); }
#gnbWrap .tit.active.item2 { background-image:url('/webzine/202303/img/common/icon_story_active.png'); }
#gnbWrap .tit.active.item3 { background-image:url('/webzine/202303/img/common/icon_luckybox_active.png'); }
#gnbWrap .tit.active.item4 { background-image:url('/webzine/202303/img/common/icon_arthall_active.png'); }
#gnbWrap .tit.active.item5 { background-image:url('/webzine/202303/img/common/icon_notice_active.png'); }

/******** Sub Common ***************/
.article-wrap { width:100%; 	height:100%; background:#fff; margin:0 auto; position:relative; overflow:hidden; }
#headline { width:100%; position:relative; overflow:hidden; }
#headline .headline-container { max-width:1280px; margin:0 auto; text-align:center; }
#lead { width:100%; word-break:break-all; padding:60px 0; padding-top:0; }
#lead p { font-size:20px; line-height:32px; }
.article-navi { position:fixed; bottom:25%; right:50%; margin-right:-640px; z-index:11; }
.article-navi div { margin-bottom:5px; }
.article-navi a { display:block; background-repeat:no-repeat; background-color:#eeeeee; background-position:center center; }
.prev-article { position:relative; }
.prev-article a { background-image:url('/webzine/202303/img/common/btn_prev_article.png'); }
.next-article { position:relative; }
.next-article a { background-image:url('/webzine/202303/img/common/btn_next_article.png'); }
.article-navi div a:first-child { width:55px; height:55px; display:block; border-radius:50% ; -webkit-border-radius:50% ; -moz-border-radius:50% ; -ms-border-radius:50% ; -o-border-radius:50% ; float:right; }
.top-article { position:relative; }
.article-navi .top-article a { background-image:url('/webzine/202303/img/common/btn_top.png'); }
.share-article { position:relative; background-color:#dc748c; width:55px; height:55px; border-radius:28px ; -webkit-border-radius:28px ; -moz-border-radius:28px ; -ms-border-radius:28px ; -o-border-radius:28px ; overflow:hidden; transition:all 0.4s ease-out ; -webkit-transition:all 0.4s ease-out ; -moz-transition:all 0.4s ease-out ; -ms-transition:all 0.4s ease-out ; -o-transition:all 0.4s ease-out ; }
.article-navi .share-article.active { background-color:#c4183f; width:193px; }
.article-navi .share-article a { background-color:transparent; float:right; width:39px; height:55px; } 
.article-navi .share-article a.share { border-radius:unset; background-image:url('/webzine/202303/img/common/btn_share.png'); -webkit-border-radius:unset; -moz-border-radius:unset; -ms-border-radius:unset; -o-border-radius:unset; }
.article-navi .share-article a.link { background-image:url('/webzine/202303/img/common/btn_link.png'); }
.article-navi .share-article a.twiter { background-image:url('/webzine/202303/img/common/btn_twiter.png'); }
.article-navi .share-article a.facebook { background-image:url('/webzine/202303/img/common/btn_facebook.png'); }

/******** newsletter popup *********/
#newsletter-popup-layer { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:1000; }
#newsletter-popup-layer .newsletter-popup { width:300px; height:320px; background:#ffffff; position:absolute; bottom:25%; left:calc(50% - (300px / 2)); border-radius:0 20px 20px 20px ; -webkit-border-radius:0 20px 20px 20px ; -moz-border-radius:0 20px 20px 20px ; -ms-border-radius:0 20px 20px 20px ; -o-border-radius:0 20px 20px 20px ; padding:32px 40px;  }
#newsletter-popup-layer p { text-align:center; line-height:1.2; color:#3e3e3e; }
#newsletter-popup-layer .close-btn { position:absolute; right:16px; top:16px; cursor:pointer; padding:24px; }
#newsletter-popup-layer .close-btn > div { margin:-10px; margin-top:-6px; transform:rotate(-45deg) ; -webkit-transform:rotate(-45deg) ; -moz-transform:rotate(-45deg) ; -ms-transform:rotate(-45deg) ; -o-transform:rotate(-45deg) ; }
#newsletter-popup-layer .close-btn span { position:absolute; right:0; top:0; display:inline-block; width:31px; height:3px; background:#c4183f; }
#newsletter-popup-layer .close-btn span:first-child { transform:rotate(90deg) ; -webkit-transform:rotate(90deg) ; -moz-transform:rotate(90deg) ; -ms-transform:rotate(90deg) ; -o-transform:rotate(90deg) ; }

#newsletter-popup-layer .ip-wrap input { width:171px; height:34px; border:none; background:#eeeeee; }
#newsletter-popup-layer .ip-wrap a { display:inline-block; width:40px; height:34px; background:#3e3e3e; font-size:14px; vertical-align: top; line-height:34px; color:#ffffff; }

.clear:after { content:""; display:block; clear:both; }

@media all and (min-width:769px) {
  /* #footer .select-box:hover { background:#ffffff; } */
  #gnbWrap > div ul li a:hover { box-shadow:0 -2px 0 0 #c4183f inset; }
}
/********* Media *********/
@media (max-width:1500px) {
  .article-navi { position:fixed; bottom:25%; right:16px; left:inherit; margin-left:0px; margin-right:0; }
 }
@media (max-width:1280px) {

 }
@media (min-width:1201px){
  #gnbWrap .row:last-child ul { padding-bottom:0; }
}
@media (max-width:1200px) {
  #header .logo { left:20px; }
  #header .webzine-tit { margin-left:130px; }
  #gnbWrap .container .row { margin:0 calc( 10% - 20px ); padding:0 20px; border-bottom:1px solid rgba(255,255,255,.5); }
  #gnbWrap .container .row:last-child { border-bottom:none; }
  #gnbWrap .tit { width:100%; margin-bottom:calc(46px - 37px); margin-top:41px; }
  #gnbWrap > div ul li a { margin:37px 3.6vw 0 0; }
  #gnbWrap .row ul li:first-child a { margin-left:0; }
  #gnbWrap .row ul li:last-child  a{ margin-right:0; }
  
  #footer p { text-align:center; }
  #footer > .container > .row > div:first-child { float:none; }
  #footer > .container > .row > div:last-child { float:none; width:fit-content; margin:44px auto 0 auto; }
  #footer > .container > .row > div:last-child > div { float:left; }

  #footer .copyright .copy { font-size:18px; }
  #footer .copyright .explain { font-size:16px;}

}
@media all and (max-width:991px) {
  #footer .select-wrap { position:relative; display:inline-block; right:0; top:0; margin-top:15px; }
  #header .menu a span:first-child{ margin-top:-10px; }
#header .menu a span.last { margin-top:10px;}
  #header .select-wrap { display: none; }
}
@media all and (max-width:768px) {
  .mt5 { margin-top:3px; }
  .mt10 { margin-top:5px; }
  .mt15 { margin-top:8px; }
  .mt20 { margin-top:10px; }
  .mt25 { margin-top:13px; }
  .mt30 { margin-top:15px; }
  .mt35 { margin-top:18px; }
  .mt40 { margin-top:20px; }
  .mt45 { margin-top:23px; }
  .mt50 { margin-top:25px; }
  .mt55 { margin-top:28px; }
  .mt60 { margin-top:30px; }
  .mt65 { margin-top:33px; }
  .mt70 { margin-top:35px; }
  .mt75 { margin-top:38px; }
  .mt80 { margin-top:40px; }
  .mt85 { margin-top:43px; }
  .mt90 { margin-top:45px; }
  .mt95 { margin-top:48px; }
  .mt100 { margin-top:50px; }
  .mt105 { margin-top:53px; }
  .mt110 { margin-top:55px; }
  .mt115 { margin-top:58px; }
  .mt120 { margin-top:60px; }
  .mt160 { margin-top:80px; }

  .mb5 { margin-bottom:3px; }
  .mb10 { margin-bottom:5px; }
  .mb15 { margin-bottom:8px; }
  .mb20 { margin-bottom:10px; }
  .mb25 { margin-bottom:13px; }
  .mb30 { margin-bottom:15px; }
  .mb35 { margin-bottom:18px; }
  .mb40 { margin-bottom:20px; }
  .mb45 { margin-bottom:23px; }
  .mb50 { margin-bottom:25px; }
  .mb55 { margin-bottom:28px; }
  .mb60 { margin-bottom:30px; }
  .mb65 { margin-bottom:33px; }
  .mb70 { margin-bottom:35px; }
  .mb75 { margin-bottom:38px; }
  .mb80 { margin-bottom:40px; }
  .mb85 { margin-bottom:43px; }
  .mb90 { margin-bottom:45px; }
  .mb95 { margin-bottom:48px; }
  .mb100 { margin-bottom:50px; }
  .mb105 { margin-bottom:53px; }
  .mb110 { margin-bottom:55px; }
  .mb115 { margin-bottom:58px; }
  .mb120 { margin-bottom:60px; }
  .mb140 { margin-bottom:80px; }

  .pt5 { padding-top:3px; }
  .pt10 { padding-top:5px; }
  .pt15 { padding-top:8px; }
  .pt20 { padding-top:10px; }
  .pt25 { padding-top:13px; }
  .pt30 { padding-top:15px; }
  .pt35 { padding-top:18px; }
  .pt40 { padding-top:20px; }
  .pt45 { padding-top:23px; }
  .pt50 { padding-top:25px; }
  .pt55 { padding-top:28px; }
  .pt60 { padding-top:30px; }
  .pt65 { padding-top:33px; }
  .pt70 { padding-top:35px; }
  .pt75 { padding-top:38px; }
  .pt80 { padding-top:40px; }
  .pt85 { padding-top:43px; }
  .pt90 { padding-top:45px; }
  .pt95 { padding-top:48px; }
  .pt100 { padding-top:50px; }
  .pt130 { padding-top:65px; }
  .pt140 { padding-top:70px; }
  .pt150 { padding-top:75px; }

  .pb5 { padding-bottom:3px; }
  .pb10 { padding-bottom:5px; }
  .pb15 { padding-bottom:8px; }
  .pb20 { padding-bottom:10px; }
  .pb25 { padding-bottom:13px; }
  .pb30 { padding-bottom:15px; }
  .pb35 { padding-bottom:18px; }
  .pb40 { padding-bottom:20px; }
  .pb45 { padding-bottom:23px; }
  .pb50 { padding-bottom:25px; }
  .pb55 { padding-bottom:28px; }
  .pb60 { padding-bottom:30px; }
  .pb65 { padding-bottom:33px; }
  .pb70 { padding-bottom:35px; }
  .pb75 { padding-bottom:38px; }
  .pb80 { padding-bottom:40px; }
  .pb85 { padding-bottom:43px; }
  .pb90 { padding-bottom:45px; }
  .pb95 { padding-bottom:48px; }
  .pb100 { padding-bottom:50px; }
  .pb120 { padding-bottom:60px; }
  .pb130 { padding-bottom:65px; }
  .pb140 { padding-bottom:70px; }
  .pb150 { padding-bottom:75px; }

  .mo-hidden { display:none; }

  #header { height:80px; }
  #header .logo { width:18.2291%; height:80px; }
  /* #header > div { text-align:center; } */
  
  #header .webzine-tit { margin-left:27%; }
  #header .webzine-tit > span { display:block; line-height:1.5; }
  #header .webzine-tit .tit { width:55%; }
  #header .webzine-tit .month { font-size:18px; }
  #header .logo { left:5.2%; }
  #gnbWrap { height:100%; top:80px; }
  #gnbWrap > div { top:0; padding-top:0; border-bottom:none; }
  #gnbWrap .border > ul { padding-left:0; padding-right:0; margin-bottom:0; }
  #gnbWrap ul li { width:100%; }
  #gnbWrap .row ul li a { margin:37px 0 0 0; }
  #gnbWrap .gnb-list { float:none; width:100%; min-height:inherit; }
  #gnbWrap .gnb-list:before { display:none; }
  #gnbWrap .gnb-list .tit { float:none; width:100%; padding-right:0; padding-top:35px; padding-left:0; font-size:18px; }
  #gnbWrap .gnb-list .tit.exp { margin-top:0; }
  #gnbWrap .gnb-list .tit, #gnbWrap .gnb-list .tit a { font-size:18px; }
  #gnbWrap .gnb-list .tit:before { margin-bottom:15px; }
  #gnbWrap .gnb-list .border { position:relative; height:auto; padding-bottom:35px; }
  #gnbWrap .gnb-list .border:before { position:absolute; content:''; top:0; left:0; display:block; width:100%; height:1px; background:#ebebeb; }
  #gnbWrap .gnb-list:first-child .border:first-child:before { display:none; }
  #gnbWrap > div ul li:first-child .border:before { display:none; }
  #gnbWrap .col-sm-3 { min-height:inherit; margin-top:30px; padding-bottom:30px; border-left:none; border-bottom:1px solid #323030; }
  #gnbWrap .col-sm-3:last-child { border:none; }

  #gnbWrap > div #scroll { overflow:hidden !important; }
  .article-navi { bottom:7%; }
  .article-navi a { background-color:rgba(238,238,238,.6); }
 
  #footer > .container > .row > div:last-child > div { float:none; margin:0 auto; width:fit-content; }
  #footer > .container > .row > div:last-child > div:first-child { margin-right:auto; margin-bottom:24px; }
 }
@media all and (max-width:480px) {
  #gnbWrap > div { width:100%; margin-left:0%; }
  /* .article-navi { bottom:170px; transform:scale(0.6); right:4.4444%; } */
 }