/********************************************************
■ 메인과 공통 
********************************************************/
html{font-size:20px;}
body{font-size:1rem}
.con{width:75rem; margin:0 auto; font-size:1.05rem; line-height:1.5; position:relative;}
.tablet{display:none;}
.mob{display:none;}
img{vertical-align:middle;}

#header .btn-gnb-menu{position:absolute;}
/* 서브비주얼 */
#sepration { width:100%;height:15rem; position:relative; overflow:hidden;  background: url("/images/default/content/sub_visual01.jpg") no-repeat 0 top;background-size:cover; }
#sepration .section{  width:80rem; margin:0 auto; height:100%;box-sizing:border-box; position: relative;display:flex;align-items: center;}
#sepration .section h2{font-size: 2.3rem; margin-bottom: 1.5rem;  font-weight:700; color: #fff;line-height:1;}
#sepration .section p{color:#fff; font-size:1.1rem;}
#sepration .section p em{color:#ff0000}

/* 서브메뉴 */
.tab_view{display:none;}
.left_menu{ width:75rem; margin:0 auto;}
.left_menu:after {clear: both; display: block; content: "";}
.left_menu ul li{display:inline-block;}
.left_menu ul li a{display:inline-block; height:2.75rem; line-height:2.75rem; border-radius:2.75rem; padding:0 2rem; font-weight:600; position: relative;  color:#a0a0a0; font-size:1.2rem;}
.left_menu ul li:first-child{ margin-left:0; }
.left_menu ul li strong{font-weight:800;}
.left_menu ul li.on a{color:#fff;background:#6256ac;}

.lm_bg{padding-top:2.5rem;}


/* 5차메뉴의 상단 메뉴 */
.extMenu ul {overflow: hidden;border-bottom: solid 1px #ccc;}
.extMenu ul li {float: left;text-align: center;height: 3.35rem;}
.extMenu ul li a {display: block;border-radius: 0;width: 100%;height: 100%;border: solid 1px #ddd;border-bottom: none;border-left: none;line-height: 3.35rem;}
.extMenu ul li:first-child{border-left:1px solid #ddd;}
.extMenu ul li a:first-child {}
.extMenu ul li .on {border-bottom:2px solid #6256ac;color: #6256ac;background-color: #f6f4ff;}


/* 탭메뉴 */
.tab_menu{  width:80rem; margin:0 auto; margin-bottom:2.5rem; }
.tab_menu ul{     overflow: hidden;   position: relative;    width: 100%; }
.tab_menu ul li{width:25%; float:left; text-align: center; vertical-align: top; border-bottom:3px solid #ddd; /*padding:1rem 0;*/ padding-bottom:1rem;}
.tab_menu ul li a{display: block;    font-size:1.05rem;    color: #999; font-weight:600;  position:relative; }
.tab_menu ul li.on{ border-bottom: 3px solid #6256ac; }
.tab_menu ul li.on a{position: relative;    color: #6256ac;font-weight:700;}
.tab_menu ul li strong{font-weight:800;}
.tab_menu ul li:not(:first-child) a:before{content : ""; display : block; position : absolute; left : 0; top:50%; transform:translateY(-50%); width :1px; height : 70%; background : #ddd;}
.tab_menu ul li span{display:block;width:3.75rem;height:1.75rem;line-height:1.75rem;border-radius:16.5px;background:#a3b4c0;color:#fff;margin:0 auto;font-size:0.9rem;font-weight:600;}


/* 컨텐츠영역 */
#container { margin:0; padding:0;  overflow:hidden;}
#container #section { }
#container #section .right_content {width:100%;  min-height:20rem;}
#container #section .right_content .content_title {width:75rem; margin:0 auto;}
#container #section .right_content .content_title p{text-align:right; font-size:17px; letter-spacing:0; }
#container #section .right_content .content_title p a{color:#282828;}
#container #section .right_content .content_title p img{margin:0px 10px; vertical-align:middle;}
#container #section .right_content .content_title p em{border-bottom:1px solid #6256ac; padding-bottom:3px;}
#container #section .right_content .content_body {padding:5rem 0 4.5rem 0; }



/*푸터*/

#footer .copyright { width:75rem; margin:0 auto; padding:2rem 0; overflow:hidden;line-height:130%; }
#footer .copyright ul{margin:0 -.5rem;}
#footer .copyright ul li{display:inline-block; margin:0 .5rem; font-weight:700; }
#footer .copyright ul li a{color:#333;}
#footer .copyright h3 { float:left;  }
#footer .copyright p { margin-top:.5rem; }
#footer .copyright p b{color:#999; display:block; margin-bottom:5px;}
#footer .copyright p em{color:#59A7ED; padding:0 10px;}
#footer .copyright p.copy{color:#999;}
#footer .copyright .cust ul{margin-top:1rem; overflow:hidden;}
#footer .copyright .cust ul li{float:right; display:inline-block; margin:0 .5rem; font-weight:500; }
#footer .copyright .cust ul li a{color:#fff;}
#footer .copyright .cust ul li.on a{color:#fff;}

/*유튜브 배너*/
.youtube_banner{border-radius:.5rem; overflow:hidden;position:fixed; /*bottom:10.5rem;*/ bottom:2rem; right:3rem;z-index:999;}
.youtube_banner02{bottom:2rem;}
.k_mob{display:none;}
.k_web{display:block;}


/* =============================================================================
  통합검색
   ========================================================================== */
.gsearch_box{display:flex; }
.ts_rt {width:240px; background:#fff; font-size:0.85rem; margin-left:60px; margin-top:60px;}
.sch_box {position:relative;}
.sch_box .tit {background-color:#99a7b8;height:43px;line-height:43px;padding-left:25px;color:#fff;}
.sch_box .rank_tab {color:#d6dce3;width:35px;font-size:13px;text-align:center;line-height:41px;vertical-align:top;position:absolute;top:0;}
.sch_box .rank_tab.weekly {right:45px;}
.sch_box .rank_tab.daily {right:10px;}
.sch_box .rank_tab.on {color:#fff;border-bottom:2px solid #6256ac;}
.sch_box .conts {padding:14px 25px 20px;border:1px solid #e5e5e5;}
.sch_box .conts .rank > li {position:relative;margin-bottom:5px;padding-left:25px;line-height:20px; font-size:0.85rem;}
.sch_box .conts .rank > li a {display:inline-block;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}
.sch_box .conts .rank .no {position:absolute;top:3px;left:0;display:inline-block;width:14px;height:14px;text-align:center;font-size:9px;color:#fff;background-color:#a6adaf;border-radius:3px;vertical-align:top;line-height:14px;}
.sch_box .conts .rank .no.t1,
.sch_box .conts .rank .no.t2,
.sch_box .conts .rank .no.t3 {background-color:#6256ac;}
.sch_box .conts .rank.daily {display:none;}


.global_search{flex:1; }
.cate_area{ box-sizing:border-box; border-top:2px solid #21416A; border-bottom:1px solid #d0d0d0; margin-bottom:2rem;}
.search_all{overflow:hidden; width:35%; margin:0 auto; margin-bottom:3rem;border:2px solid #FE8182; position:relative;}
.search_all .searchBox  select::-ms-expand {  display: none;    -webkit-display: none;    -moz-display: none;    -o-display: none;    -ms-display: none;}
.search_all .searchBox select.total_select{ border: 0 none;  padding: 0;  margin: 0;  background: transparent;  outline: none; height:2.5rem; line-height:2.5rem;  padding-right:2.5rem; padding-left:15px; border:none; background-image:none;   -webkit-appearance: none;    -moz-appearance: none;    -o-appearance: none;	-ms-appearance: none;	background: #fff url('/images/default/content/sel_icon.png') no-repeat right center; width:100px;}
.search_all .searchBox{border-right:none;width:calc(100% - 2.5rem);  float:left;box-sizing:border-box;}
.search_all .searchBox input.keyWord{ height: 2.5rem; line-height: 2.5rem; background:transparent; border:none;width:calc(100% - 140px);  padding-left:10px;}
.search_all input.btnSearch{position:absolute; right:0.5rem;top:50%; transform:translateY(-50%); }

.tit-search h2{font-size:1.25rem; font-weight:500;}
.tit-search h2 span{color:#000;}
.tit-search h2 em{color:#F44336;}
.cate_area h2{font-size:1.1rem; font-weight:bold; color:#212121;background:url('/images/default/content/search_tit.gif') no-repeat left center; padding:15px 25px;}
.cate_area .folding{position:relative; padding:10px 0px 0px; 0px;}
.cate_area .folding h3{position:absolute; left:50%; margin-left:-52px; bottom:-27px; cursor:pointer; }
.cate_area .pt{padding-bottom:35px;}
.cate_area .pt ul{overflow:hidden; font-size:0.85rem;}
.cate_area .pt ul li{float:left; width:25%; margin-top:10px; background:url('/images/default/content/ser_bul.gif') no-repeat left center; padding-left:18px; box-sizing:border-box;}
.cate_area .pt ul li a em{color:#7c7c7c; margin-left:0.25rem; font-size:0.8rem;}
.cate_area .pt ul li.on a{color:#F44336; font-weight:bold;}


.sr_result{position:relative; }
.con .sr_result h3{margin-bottom:10px; font-size:1.2rem; color:#212121; font-weight:500; margin-top:2rem !important; padding:0;}
.con .sr_result h3:before{display:none;}
.con .sr_result h3 span{color:#898989; font-size:0.85rem;}
.con .sr_result h3 span:after{display:none;}
.sr_result p.more{position:absolute; top:0px; right:0px;}
.sr_result p.gal_tit a{color:#333 !important; font-weight:500; font-size:1rem; line-height:1.5; background:url('/images/default/content/dot.gif') no-repeat left 13px; padding-left:10px; display:inline-block;}
.sr_result .gal_con{margin:8px 0px; margin-left:10px; display: inline-block;text-overflow:ellipsis;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;
-webkit-line-clamp: 2; -webkit-box-orient: vertical;word-wrap:break-word; line-height: 1.5em;height: 3em;}
.sr_result .gal_con a{color:#848484;}
.sr_result .date{background: url('/images/default/content/date.gif') no-repeat 0 center; padding-left:20px;padding-top:2px; }
.sr_result .sdate{margin-left:10px;font-size:12px; color:#adadad; letter-spacing:0.04em;}
.sr_result p.smore{position:absolute; top:0; right:0; font-size:0.9rem;}

.sr_result .tb_wrap {background:url('/images/default/content/dot_line2.gif') repeat-x left bottom; padding-bottom:2rem;}
.sr_result .tb_view{border-collapse: collapse;	border-spacing: 0; table-layout:fixed;}
.sr_result table.online_tb{border-bottom:solid 1px #e4e4e4;}
.sr_result .tb_view thead th{color: #818181; font-weight: bold; padding:11px 15px; font-size: 14px; text-align:left; vertical-align:middle; border-bottom:1px solid #e4e4e4;}
.sr_result .tb_view tbody th{ color:#a1a6a9; font-weight:bold;  padding:11px 15px; text-align:left;background: url('/images/default/content/th.gif') no-repeat right center; font-size:12px; }
.sr_result .tb_view tbody td{padding:12px 10px;color:#818181; line-height: 20px; font-size:16px;}
.sr_result .tb_view tbody td.attached a{font-size:12px; text-decoration:underline !important;}
.sr_result .tb_view tbody td.date{font-size:12px; text-align:center;}
.sr_result .tb_view tbody td.view{background: url('/images/default/content/th.gif') no-repeat left center; font-size:12px;text-align:center;}
.sr_result .tb_view tbody .vbar{background: url('/images/default/content/th.gif') no-repeat right center; font-size:12px;text-align:center;}


.no_result{text-align:center; font-size:18px; color:#848484;}
.no_result b{color:#212121; font-size:30px; font-weight:bold; line-height:50px;}

#footer{ clear:both;background:#313033; color:#a5a5a5; font-size:0.9rem;width:100%;}
/********************************************************
■ 레이아웃 변경
********************************************************/
@media (max-width:1500px){
	.con{width:100%; padding:0 1rem;}
	.header_inner{ width:100%;}
	.gnb{right:4.5rem;}
	#header h1{left:1.5rem;}
	.k_mob{display:block;}
	.k_web{display:none;}
	.yknot_banner{bottom:3.5rem;}
	.youtube_banner{right:1rem; bottom:6rem;}
	.youtube_banner02{bottom:3rem;}
	.header_inner #nav > ul > li > div{padding:0 1.2rem;}

}
@media (max-width:1300px){
	
	#wrap{ background-size:115%;}
    .header_inner #nav > ul > li > div{padding:0 .9rem;} 
	
	#sepration .section{width:100%; }
	#sepration{background-size:80% auto; height:16.25rem;padding:0 1rem;}
	.left_menu{width:100%; padding:0 1rem;}
	.left_menu ul {width:100%;} 

	

    #footer .copyright { width:100%;padding:2rem 1rem;}
	#footer .fcon .of { width:100%;}
	#footer .fcon .notice{padding-left:1rem;}
	#footer .fcon .cust{padding:0 1rem;}
	.yknot_banner{bottom:4rem;}

	.tab_menu{width:100%;}
}
@media (max-width:1120px){
    .header_inner #nav > ul > li > div > a{font-size:.9rem;}
	#header h1{width:8rem;}
}


/********************************************************
■ 태블릿
********************************************************/

@media (max-width:1030px){
    html{font-size:16px;}
    body{font-size:1rem}

    .tablet{display:block;}
    .web{display:none;}
    img {max-width:100%; vertical-align:middle;}

    /* 헤더 */
    #wrap{ position:relative; }
	#header .header_inner{}
	.header_inner #nav{display:none;}
	#header{width:100%; height:5rem; }
	#header h1 {position:absolute; left:1rem; top:50%; transform:translateY(-50%);  z-index:9999;}
	#header h1 img{width:7rem;}
	#header p.sns{display:none;}
	#header .btn-gnb-menu{display:block; top:0.5rem;}
    #header p.log{display:none; position:absolute; right:5rem; top:0;height:5rem; line-height:5rem;cursor:pointer; z-index:10; width:5rem; text-align:center; background: url("/images/default/main/down.png") no-repeat 90% center; background-size: 12px auto;}
    #header p.logon{ padding-top:0.84rem; line-height:1.0; }
    #header p.logon b{display:block; margin-top:10px;font-size: 0.8rem;}
    
	#header .btn-gnb-menu{width:3.2rem;height:3.2rem;top:1.8rem; }

    #header .btnAll { }
    #header .btnAll span { display: block; width: 100%; height: 2px; position: absolute; background-color: #fff; -webkit-transition: all 0.25s; transition: all 0.25s; }
    #header .btnAll > span:nth-child(1) { top: 0; }
    #header .btnAll > span:nth-child(2) { top: 0.42rem; }
    #header .btnAll > span:nth-child(3) { top: 0.81rem; }
    #header.open .btnAll > span:nth-child(1) { top: 0.5rem; -webkit-transform: rotate(-135deg); transform: rotate(-135deg); }
    #header.open .btnAll > span:nth-child(2) { top: 0; opacity: 0; }
    #header.open .btnAll > span:nth-child(3) { top: 0.5rem; -webkit-transform: rotate(135deg); transform: rotate(135deg); }

	.header_bottom{position:absolute;top:1.8rem;height:3.2rem;}

    /*사이트맵*/
    #header #navi{background:#fff; position:fixed; right:-100%; top:0; width:100%; height:100%; padding-top:5rem;  z-index:100; transition:right 0.45s; background:#fff; overflow:scroll;}
    #header.open #navi{transition:right 0.45s; right:0px;}
    
	#menuAll .menu-member{display: block;}
    #navi h3{font-size:1rem; padding:1.5rem 0.75rem; line-height:1.3; color:#666; font-weight:normal; margin:0; text-align: left; background:#f6f5fd;}
    #navi h3 em{color:#6256ac; font-weight:600;}
    #navi .menu-member{background: #6256ac; overflow:hidden;}
    #navi .menu-member li{width:50%; float:left; text-align:center; padding:.75rem 0; font-size:.9rem;}
    #navi .menu-member li a{color:#fff; display:block;}
    #navi .menu-member li:nth-of-type(2n-1){ border-right: 1px solid rgba(255, 255, 255, .5);}
	#navi .menu-member li.w100{border-bottom:1px solid rgba(255, 255, 255, .5);}

    /*1차*/
    #navi ul.mbtop {width:100%; margin:0; padding:0; padding:0px 1rem; }
    #navi ul.mbtop li {margin:0; float:none; width:100%; border-bottom:1px #eeeeee solid; background-size:15px auto; }
	#navi ul.mbtop > li:last-child{display:none;}
    #navi ul.mbtop li a {padding:0; background: none; text-align:left; display:block; width:100%; height:3rem; box-sizing:border-box; font-weight:500;  font-size:1.2rem; line-height:50px;   color:#262626;}
    #navi ul.mbtop li.open_li{ position:relative;}
    #navi ul.mbtop li.open_li:after{ content : ""; display : block; position : absolute; left:95%; top:20px; width :15px; height : 8px;  background:url('/images/mobile/up.png') 0 0 no-repeat; background-size:15px auto;}
    #navi ul.mbtop li.open_li > a {color:#6256ac;}


    /*2차*/
    #navi ul.mbtop li ul {display:none; float:none; background-color:#fdf9ff; position:relative; left:0; top:0; width:auto; height:auto; visibility:visible;  padding:0.75rem;margin-top:0;}
    #navi ul.mbtop li ul li {float:none;border:none; box-sizing:border-box;  background: none;}
    #navi ul.mbtop li ul li a {color:#262626; background:url(none); font-weight:500; height:auto; line-height:30px; padding-left:0;  font-size:1.1rem;}
    #navi ul.mbtop li ul li:first-child{border:none;}

    /*3차*/
    #navi ul.mbtop li ul li ul{display:none;border:none; height:0;background:none; margin:0; padding:0;}
    #navi ul.mbtop li ul li ul li {display:none;}
	
	/* 서브메뉴 */	
	.tab_view{display:block; cursor:pointer;background:#6256ac; background-size:12px auto;padding:1rem .75rem; font-size:1.1rem; box-sizing:border-box; color:#fff; box-sizing:border-box; padding-left:0.75rem; font-weight:normal; position:relative; text-align: center;}
	.tab_view span{position:absolute; top:50%; right:1rem; margin-top:-8.5px; display:block; }
	.tab_view span img{width:12px;}
	.tab_view.on{cursor:pointer; }
	.tab_view.on span img{transform:rotateX(180deg);}
	.left_menu {position:relative;box-sizing:border-box; height:0;}
	.left_menu ul{display:none; z-index:10;position:absolute;width:100%;left:0;  margin:0 auto; line-height:0; background:#fff;box-sizing:border-box; padding:1rem .75rem;box-shadow: 6px 6px 6px 0px rgba(25, 25, 25, 0.15);-webkit-box-shadow:   6px 6px 6px 0px rgba(25, 25, 25, 0.15);	-moz-box-shadow:  6px 6px 6px 0px rgba(25, 25, 25, 0.15); border-top:2px solid #6256ac;}
	.left_menu ul li {width:100% !important;border:none !important;  vertical-align:middle; box-sizing:border-box; }
	.left_menu ul li a {display:block; padding:.75rem .75rem;line-height: 1.0; height: auto; font-weight:500; font-size:1.1rem; color:#6256ac;text-transform:capitalize; }
	
	.left_menu ul li strong{ font-weight:700;} 
	.left_menu ul li.on a:before{display:none;}
	.left_menu ul li.on a{background:#f6f5fd; border-radius: 0.5rem; color:#6256ac;}
	#container #section .right_content .content_body {padding:2rem 0px 4rem 0px; }
	#container #section .right_content .content_body .con{font-size:1rem;}

	.left_menu ul li{margin-left:0;}

	.tab_menu ul{padding:0 1rem;}
	.tab_menu ul:before{width:calc(100% - 2rem); left:1rem;}
	.lm_bg{padding-top:0;}

	/* 검색 */	
	.cate_area .pt ul{font-size:0.8rem;}
	.cate_area .pt ul li{width:33.33%;}
	.search-icon img{width:1.5rem;}


	#footer .copyright p:not(:first-child){margin-top:1rem;}

}

/********************************************************
■ 모바일
********************************************************/
@media (max-width:767px){
    html{font-size:15px;}
    body{font-size:1rem;}

    .tablet{display:none;}
    .mob{display:block;}


    /* 헤더 */
    #header #navi{padding-top:5.6rem;}
	#header .header-top .link-sns{display:none;}
	#header .header-top .link-list{width:100%;}
	#header .header-top .link-list li{width:calc(100% / 3);}
	


    #header p.log{right:3.3rem;height:2.8rem; width:2.8rem; line-height:2.8rem; background-size: 8px auto; }
    #header p.log img{width:20px;}
	#header p.logon b{position:absolute; top:0; right:3.5rem; margin:0; line-height:2.8rem; }

	#sepration {height:12rem;}
    #sepration .section{}
    #sepration .section h2{font-size: 2rem;}
	
	#footer .fcon .of{height:5.5rem;}
	#footer .fcon .notice{width:100%; padding:0 1rem;     height: 2.7rem;
    overflow: hidden;}
	#footer .fcon .cust{width:100%; text-align:left; border-top:1px solid #eee;}
	#footer .copyright .fr{float:left !important; margin-top:.5rem;}

	/*검색*/
	.ts_rt{display:none;}
	.search_all{width:100%;}
	.search_all input.btnSearch{width:2rem;}	
	.tit-search h2{line-height:1.3;}	
	.sr_result .tb_view tbody td{font-size:14px;}

	/*탭메뉴*/
	.tab_menu ul {overflow:initial; display:flex; flex-wrap:wrap;}
	.tab_menu ul li{margin-left:-1px;margin-top:-1px;flex-basis:calc(100%/3);border:1px solid #ddd;padding:0.5rem 0;}
	.tab_menu ul li.on{border-bottom:2px solid #6256ac;}
	.tab_menu ul li:not(:first-child) a:before{display:none;}
	.tab_menu ul li:not(:last-child):after{display:none;}

}


@media (max-width:500px){

	#footer .copyright .fr ul{}
	#footer .copyright .fr li{display:inline-block; padding:0 5px; text-align:center; margin:0;}
	#footer .copyright .fr li img{width: auto; height:1.6rem;}
	#footer .copyright .cust > ul{text-align:center;}
	#footer .copyright .cust > ul > li{float:none;}

	.tab_menu ul li{display:table; width:100%; vertical-align:middle; height:50px; }
	.tab_menu ul li a{display:table-cell; vertical-align:middle;  padding-bottom:0; font-size: .9rem; line-height:1.1; text-transform:capitalize; }

}