@charset 'utf-8';

/*
    IPAD PRO : 1280 * 1024
    IPAD     : 1024 * 768
    IPHONE X : 812 * 375
    IPHONE PRO : 667 * 375
    GALAXY S5 : 640 * 360
    GALAXY NOTE 10 : 705 * 412
*/
@media (max-width: 1024px) {
    .innerWrap { width:1000px; margin:0 12px; }
    #tnb { display:none; }
    #wrap { min-width:1024px; }

    div#contents.home div.sideAds { display:none; }
    #container div#contents.home { width:644px; }
    div#contents.home div#content { margin-left:0; width:auto; float:none; }

    #container div#contents { width:644px; }

    div#content div.recents div.section div.gallery div.item a { height:10em; }
    div#content div.recents div.section div.gallery div.item span.subject { line-height: 1.5em; }

    div.cmtWrite input { width:100px; box-sizing: border-box; }
    div.cmtWrite input[type='email'] { width:160px; }
    div.cmtWrite div.captcha span.description { float:none; clear: both; padding:5px 0 0 80px; }

    div#content div.photo.list div.item a span.thumb { height:12em; }
    /*div#content div.photo.list div.item a span.thumb span.empty { padding:70% 10px 0; line-height:1.5em; }*/

    div#content div.recents div.section.others div.item a span.thumb { height:9em; }
    div#content div.recents div.section.others div.this::before { top:1em; }
    div#content div.recents div.section.others div.this::after { top:1em; }
    div#content div.recents div.section.others div.this div.item { padding-top:3em; }
    div#content div.recents div.section.others div.this div.item a span.thumb { height:6em; }

    /*div#content div.detail div.content div.cards div.items { width:100%; height:644px; }*/
    div#content div.detail div.content div.cards div.control button { background-position: left center; }
    div#content div.detail div.content div.cards div.control button::before { width:35px; }

    #footer div.logo { display:none; }
    #footer div.publishing { margin-left:0; text-align: center; }
    #footer div.corp { margin-left:0; text-align:center; }
}

@media (max-width: 812px) {
    .innerWrap { width:auto; margin:0 9px; }
    #wrap { min-width:320px; }
    #aside { display: none; }

    #header h1 { position:relative; left:initial; transform: translateX(0); float:left; }
    #header div.ad { display:none; }

    #container div#contents.home { width:auto; float:none; }
    div#contents.home div#content { width:auto; float:none; }
    #container div#contents { width:auto; float:none; }

    #footer div.publishing { width:450px; margin:0 auto; }
    #footer div.publishing span.unit:nth-child(3)::after { display:none; }
    div#content div.detail div.content img { width:auto !important; height:auto !important;}
}

@media (max-width: 768px) {
    #header { position:sticky; top:0; z-index:9; background-color:#FFF; }

    #header div#gnb { position:fixed; background-color:rgba(0, 0, 0, .9); color:#FFF; right:-200px; top:0; padding:4em 0.5em 1em; width:200px; transition: 0.3s; }
    #header div#gnb div.switch { display:block; position:absolute; top:0.5em; left:-4em; transition: 0.3s; }
    #header div#gnb div.switch button { width:3em; height:3em; background: none; }
    #header div#gnb div.switch button:focus { outline: none; }
    #header div#gnb div.switch button::before { content:''; display: block; position: absolute; width:2em; top:0.5em; left:0.5em; border-top:5px solid #0f4c82; transition: 0.3s; }
    #header div#gnb div.switch button::after { content:''; display: block; position: absolute; width:2em; bottom:0.5em; left:0.5em; border-bottom:5px solid #0f4c82; transition: 0.3s; }
    #header div#gnb div.switch button span { display:block; position: absolute; text-indent: -1000em; overflow: hidden; width:2em; height:0; /* top:1.325em; */ top:50%; transform: translateY(-50%); left:0.5em; border-top:5px solid #0f4c82; transition: 0.3s; }
    #header div#gnb a { width:auto; float:none; border-right:0; border-top:1px solid #666; }
    #header div#gnb.active a:first-child { border-left:0; }
    #header div#gnb a.selected { background-color:#333; }
    #header div#gnb.active { right:0; transition: 0.3s; }
    #header div#gnb.active div.switch { left:0.5em; transition: 0.3s; transition-delay: 0.2s; }
    #header div#gnb.active div.switch button::before { transform: rotate(45deg); border-color:#FFF; top:1.4em; border-width: 2px; transition: 0.3s; transition-delay: 0.2s; }
    #header div#gnb.active div.switch button::after { transform: rotate(-45deg); border-color:#FFF; bottom:1.4em; border-width: 2px; transition: 0.3s; transition-delay: 0.2s; }
    #header div#gnb.active div.switch button span { opacity: 0; transition: 0.3s; transition-delay: 0.2s; }


    #header h1 a { height:auto; width:auto; padding:0.5em 0; background:none; }
    #header h1 a img { display:block; height:3em; }
    #header div.globalSearch { display:none; }

    div#contents.home div#content div.recent div.headline { margin:0 -9px; }

    div#contents.single div.section div.form table th { padding:1em; letter-spacing: -0.1em; }
    div#contents.single div.section div.form table td { padding:1em; }

    div#content.policy div.detail div.content div.sector div.table { margin-top:20px; }
    div#content.policy div.detail div.content div.sector div.table div.tableState { height:1em; margin-bottom:0.25em; }
    div#content.policy div.detail div.content div.sector div.table div.tableState::before { content:''; display:none; width:1.8em; height:1em; float:left; background:url('/images/yeogieNews/arrowLS.svg') repeat-x left center / auto 1em; }
    div#content.policy div.detail div.content div.sector div.table div.tableState::after { content:''; display:none; width:1.8em; height:1em; float:right; background:url('/images/yeogieNews/arrowRS.svg') repeat-x left center / auto 1em; ;  }
    div#content.policy div.detail div.content div.sector div.table.left div.tableState::before { display:block; }
    div#content.policy div.detail div.content div.sector div.table.right div.tableState::after { display:block; }
    div#content.policy div.detail div.content div.sector div.table div.tableDetail { overflow-x:scroll; }
    div#content.policy div.detail div.content div.sector div.table div.tableDetail table { width:768px; margin-top:0; }
}

@media (max-width: 670px) {
    div.cmtWrite { padding:0; }
    div.cmtWrite form { display:none; padding:1em 1em 2em; }
    div.cmtWrite.active form { display:block; }
    div.cmtWrite div.switch { display:block;}
    div.cmtWrite div.switch button { display:block; padding:0.5em; width:100%; }
    div.cmtWrite label { float:none; }
    div.cmtWrite input { float:none; width:100%; line-height:40px; }
    div.cmtWrite input[type='email'] { width:100%; }
    div.cmtWrite div.user { float:none; padding:0 0 10px; }
    div.cmtWrite div.content { padding:0 0 10px; }
    div.cmtWrite div.content label { display:block; }
    div.cmtWrite div.captcha img { margin-right:0; height:42px; }
    div.cmtWrite div.captcha input { width:calc(100% - 110px); }
    div.cmtWrite div.captcha span.description { padding-left:0; margin-left:0; }
    div.cmtWrite div.control { position: relative; top:auto; right:auto; }
    div.cmtWrite div.control button { width:100%; height:50px; }
}

@media (max-width: 640px) {
    div#footer div.innerWrap { display:none; }

    div#contents.home div#content div.recent div.headline div.item { float:none; clear:both; width:auto; border-top:1px solid #ECECEC; margin:0 9px; }
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) { float:left; width:50%; margin:0; border:none; }
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) { float:right; width:50%; clear: none; margin:0; border:none; }
    div#contents.home div#content div.recent div.headline div.item a span.thumb { display: none; width:auto; }
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:15em; display:block; }
    div#contents.home div#content div.recent div.headline div.item a span.subject { font-size:1.25em; margin:0.5em 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.subject,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.subject { font-size:1.25em; }

    div#contents.home div#content div.recent div.content.interview { padding:0; }
    div#contents.home div#content div.recent div.content.interview div.item { clear:both; }
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(1),
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(2) { width:50%; position:relative; float:left; clear:none; }
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(1) { padding-right:10px; }
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(2) { padding-left:10px; }
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(1) a span.subject,
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(2) a span.subject { word-break: break-all; }

    div#content div.recents div.section div.gallery div.item { width:50%; }
    div#content div.recents div.section div.gallery div.item:last-child { display:none; }

    div#contents.single div.section div.form table { display: block; }
    div#contents.single div.section div.form table tbody { display: block; }
    div#contents.single div.section div.form table tr { display: block; border-bottom:1px solid #ECECEC; padding:0.5em; }
    div#contents.single div.section div.form table th { display: block; width:auto; border:0; padding:0; }
    div#contents.single div.section div.form table td { display: block; width:auto; border:0; padding:0; }
    div#contents.single div.section div.form table td input { width:100%; }
    div#contents.single div.section div.form table td .micro { width:100%; }
    div#contents.single div.section div.form table td .min { width:100%; }
    div#contents.single div.section div.form table td .mid { width:100%; }
    div#contents.single div.section div.form table td .max { width:100%; }

    div#content div.photo.list div.item { width:33.33%; }

    div#content div.recents div.section.others div div.item:last-child { display:none; }
    div#content div.recents div.section.others div.this { display:none; }
    div#content div.recents div.section.others div.prev { width:30%; }
    div#content div.recents div.section.others div.next { width:30%; }
    div#content div.recents div.section.others div.prev div.item { float:none; width:auto; }
    div#content div.recents div.section.others div.next div.item { float:none; width:auto; }

    div#content div.policy.list div.header { display:none; }
    div#content div.policy.list div.item:nth-of-type(2) { border-top:1px solid #333; }
    div#content div.policy.list div.item { padding:1.25em; }
    div#content div.policy.list div.item span.no { display:none; }
    div#content div.policy.list div.item span.subject { width:auto; float:none; font-size:1.25em; padding-bottom:0.25em; }
    div#content div.policy.list div.item span.agency::before { content:'소관부처 : '; }
    div#content div.policy.list div.item span.agency { width:auto; padding-right:1em; }
    div#content div.policy.list div.item span.agency::after { content:' / '; padding-left:1em; }
    div#content div.policy.list div.item span.date::before { content:'신청기간 : '; }
    div#content div.policy.list div.item span.date { width:auto; }

    div#content.policy div.detail div.header table tbody,
    div#content.policy div.detail div.header table tbody tr,
    div#content.policy div.detail div.header table tbody th,
    div#content.policy div.detail div.header table tbody td { display:block; border:0; width:auto; }
    div#content.policy div.detail div.header table tbody th { float:left; padding:0.75em 0; background:none; clear:both; }
    div#content.policy div.detail div.header table tbody th::after { content:' : '; padding-right:0.25em; }
    div#content.policy div.detail div.header table tbody tr { padding:0 1em; }
    div#content.policy div.detail div.header table tbody tr::after { content:''; display: block; clear:both; }
    div#content.policy div.detail div.header table tbody tr td { padding:0.75em 0; float:left; }
    div#content.policy div.detail div.header table tbody tr:last-child td { padding:0.75em 0; float:left; }
    div#content.policy div.detail div.header table tbody tr:nth-of-type(2) { border-top:1px solid #ECECEC; }
}

@media (max-width: 560px) {
    div#footer div.guide a { display:block; padding:0.5em; border-bottom:1px solid #ECECEC; }

    div.paging a.devListPage { padding:0 10px; }

    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:13em; }

    div#content div.detail div.content div.cards div.items { width:95%; height:644px; }

    div#content div.news.list div.item a.hasThumb { padding-left:150px; }
    div#content div.news.list div.item a span.thumb { width:140px; }
    div#content div.news.list div.item a span.summary { height:3em; }
    div#content div.news.list div.item a span.parts { display:none; }

    div#cmt div.list div.item div.header div.control div.window { top:-1.5em; right:0; }
    div#cmt div.list div.item div.header div.control div.window div.header span.title { display:none; }
    div#cmt div.list div.item div.header div.control div.window div.header button { transform: translateY(0); top:10px; }
    div#cmt div.list div.item div.header div.control div.window div.content { padding:0.5em; }

    div#content div.photo.list div.item { width:50%; }
}

@media (max-width: 480px) {
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:11em; }

    div#content div.detail div.header div.control div.zoom button { width:3em; padding:0; height:3em; background-position: center; }
    div#content div.detail div.header div.control div.zoom button span { display:none; }

    div#content div.recents div.section div.list div.item { width:auto; float:none; }
    div#content div.recents div.section div.list div.item:nth-child(even) { border:0; }

    div#content div.news.gallery div.item { width:50%; }

    div#content div.policy.list div.item span.agency { float:none; text-align:left; }
    div#content div.policy.list div.item span.agency::after { content:''; display:none; }
    div#content div.policy.list div.item span.date { float:none; text-align:left; }
}

@media (max-width: 420px) {
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:10em; }

    div#contents.home div#content div.recent div.content.interview div.item:nth-child(1) a span.thumb,
    div#contents.home div#content div.recent div.content.interview div.item:nth-child(2) a span.thumb { height:10em; }

    div#content div.news.list div.item a span.subject { line-height:1.5em; height:3em; white-space:unset; margin-bottom:0.5em; }
    div#content div.news.list div.item a span.summary { display:none; }
    div#content div.news.list div.item a span.date { overflow: hidden; width:6em; height:2em; vertical-align: top; }

    div#cmt div.list div.item div.header div.control div.window { width:320px; }
    div#cmt div.list div.item div.header div.control div.window div.content div.notice span { white-space:inherit; }

    div#content div.recents div.section.others div.prev { width:40%; }
    div#content div.recents div.section.others div.next { width:40%; }
}

@media (max-width: 380px) {
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:9em; }

    div#contents.home div#content div.recent div.content.list div.item a.hasThumb{ padding-left:130px; }
    div#contents.home div#content div.recent div.content.list div.item a span.thumb { width:120px; }
    div#contents.home div#content div.recent div.content.list div.item a span.summary { height:3em; }

    div#cmt div.list div.item div.header div.control div.window { width:280px; }

    div.at-resp-share-element.at-mobile a.at-share-btn { margin-right:0; }
}

@media (max-width: 320px) {
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(1) a span.thumb,
    div#contents.home div#content div.recent div.headline div.item:nth-of-type(2) a span.thumb { height:8em; }
}