@charset "utf-8";
/* *******************************************************
 * filename : main_responsive.css
 * description : 메인 레이아웃 및 컨텐츠 반응형 CSS
 * date : 2021-02-08
******************************************************** */

/* ******************  메인 배경 ********************** */
@media all and ( max-width: 800px ){
	.main-container-bg{background:url(/images/main/main_wrap_bg_m.jpg) no-repeat 50% 0; background-size:contain}
}
/* ******************  메인 비주얼 ********************** */
@media all and (max-width:1680px){
	/* -------- 메인 비주얼 :: 텍스트  -------- */
	.main-visual-txt-con{left:30px; font-size:14px;}
	/* -------- 메인 비주얼 :: 퀵메뉴  -------- */
	.main-prize-quick-menu{bottom:8vh;}
	.main-prize-quick-menu .prize-quick-open-btn{transform:scale(0.8); }
	.main-prize-quick-menu .prize-quick-open-btn:hover{transform:scale(0.8) translateX(-10px)}
	.main-prize-quick-menu .prize-quick-open-btn .prize-quick-hidden-txt{left:-35px;}
}
@media all and (max-width:1420px){
	/* -------- 메인 비주얼 :: 퀵메뉴 내용 -------- */
	.main-prize-inner-con{padding:30px;}
	.main-prize-quick-left-con{width:calc(100% - 200px)}
	.main-quick-txt-con{font-size:15px;}
	.main-quick-medal-con{width:300px; height:auto; margin-left:0}
	/* 메뉴 */
	.main-quick-menu-list-con{width:200px;}
	.main-quick-menu-list-con li{padding:20px 0;}
	.main-quick-menu-list-con li a{font-size:18px;}
}
@media all and (max-width:1280px){
	#mainVisual {min-height:auto}
	/* -------- 메인 비주얼 :: 텍스트  -------- */
	.main-visual-txt-con{text-align:center; right:30px; bottom:50%; transform:translateY(50%)}
	.main-visual-txt-con .main-visual-tit,
	.main-visual-txt-con .main-visual-txt1,
	.main-visual-txt-con .main-visual-txt2{
		transform: translateY(20px);
	}
	.active .main-visual-txt-con .main-visual-tit,
	.active .main-visual-txt-con .main-visual-txt1,
	.active .main-visual-txt-con .main-visual-txt2{
		transform: translateY(0px);
	}
	/* -------- 메인 비주얼 :: 퀵메뉴  -------- */
	.main-prize-quick-menu{transform:translateX(100%); opacity:0; visibility:hidden;}
	/* -------- 메인 비주얼 :: 퀵메뉴 내용 -------- */
	.main-prize-container,
	.main-prize-quick-dim{display:none}
}
@media all and ( max-width: 1024px ){
	#mainVisual{/* margin-bottom:21%; */}
	.main-visual-bg-inner{background-image:url(/images/main/main_visual_bg_m.jpg)}
}
@media all and ( max-width: 800px ){
	/* -------- 메인 비주얼 :: 텍스트  -------- */
	.main-visual-txt-con{left:10px; right:10px; font-size:13px}
}

/* ****************** 메인 수상자 ********************** */
@media all and (max-width:1420px){
	/* -------- 수상자 오른쪽 리스트 -------- */
	.main-laureate-small-photo-box{left:900px; margin-left:0}
}
@media all and (max-width:1300px){
	#mainLaureateContent {padding-bottom:70px}
	/* -------- 수상자 상세내용 리스트 -------- */
	.main-laureate-container{padding:0 50px 0 30px}
	/* 수상자 상세내용 :: 타이틀 */
	.main-laureate-container .main-laureate-tit{font-size:36px; width:auto; max-width:580px;}
	/* 수상자 상세내용 :: 왼쪽텍스트영역 */
	.main-laureate-info-item{font-size:12px}
	.main-laureate-info-item .laureate-detail-info{margin-left:0}
	/* 수상자 상세내용 :: 오른쪽사진영역 */
	.main-laureate-photo-box{width:calc(100% - 500px); margin-left:30px; transform:translateY(0) !important;}
	.main-laureate-photo-box .main-laureate-big-list-con,.main-laureate-photo-box:after{max-width:580px; }
	.main-laureate-big-list-con .main-laureate-big-item a{width:100%; height:auto;}
	
	/* -------- 수상자 오른쪽 리스트 -------- */
	.main-laureate-small-photo-box{left:auto; right:0px; width:390px;  padding-left:0; top:auto; bottom:-70px;}
	.main-laureate-small-list-con{display:none;}
	/* 이전,다음 컨트롤영역 */
	.main-laureate-controls-box{left:15px; height:70px; width:auto; right:15px; top:auto; bottom:0px; }
	.main-laureate-controls-box .main-laureate-btns{width:100px; margin-top:15px;}
	.main-laureate-controls-box .main-laureate-btns button{height:40px;}
	.main-laureate-controls-box .main-laureate-more-btn{float:right; position:relative; bottom:auto; right:Auto; width:150px; margin-top:15px; transform:rotate(0)}
	.main-laureate-controls-box .main-laureate-more-btn .txt{margin-right:0; text-align:right;}
}
@media all and (max-width:1024px){
	.main-laureate-container{padding:0 15px;}
	/* 수상자 상세내용 :: 타이틀 */
	.main-laureate-container .main-laureate-tit{margin-left:0; max-width:none;}
	/* -------- 수상자 상세내용 :: 왼쪽텍스트영역 -------- */
	.main-laureate-info-box{float:none; width:auto; margin:5% 0}
	/* 왼쪽 텍스트영역 :: 탭 */
	.main-laureated-year-tab-list{position:static; text-align:center; margin-bottom:3%;}
	.main-laureated-year-tab-list ul{width:auto;}
	.main-laureated-year-tab-list li{float:none; margin:0 10px 15px; display:inline-block;}
	.main-laureated-year-tab-list li:first-child{margin:0 10px 15px}
	/* 왼쪽 텍스트영역 :: 텍스트 */
	.main-laureate-info-item{text-align:center; padding-top:0}
	.main-laureate-info-item .laureate-prize-name-box{position:static; opacity:0; transform:translateX(-20px); transition:all 0.5s 0.2s}
	.main-laureate-info-item .laureate-name-info{margin:3em auto;}
	.main-laureate-info-item.active-item .laureate-prize-name-box{opacity:1.0; transform:translateX(0px); }
	/* 우측 사진영역 */
	.main-laureate-photo-box{position:relative; float:none; width:auto; margin:0 auto; }
	.main-laureate-photo-box:before{position:absolute; left:0; right:0; bottom:-70px; height:calc(20% + 70px); content:""; background-color:#151f3c}
	.main-laureate-photo-box:after{left:50%; transform:translatex(-50%) scaley(1)}
	.aos-animate .main-laureate-photo-box:after{transform:translatex(-50%) scaley(0)}
	.main-laureate-photo-box .main-laureate-big-list-con{position:relative; width:90%; margin:0 auto;}
	/* -------- 수상자 오른쪽 컨트롤 -------- */
	.main-laureate-small-photo-box{left:15px; right:15px; bottom:-70px; height:70px; width:auto; z-index:3;/* position:relative; left:auto; right:auto; width:auto; height:auto; max-width:580px; margin:0px auto; */ }
	.main-laureate-controls-box{position:static; width:90%; max-width:580px; margin:0px auto; }
}
@media all and ( max-width: 800px ){
	/* 수상자 상세내용 :: 타이틀 */
	.main-laureate-container .main-laureate-tit{font-size:28px;}
	/* 왼쪽 텍스트영역 :: 탭 */
	.main-laureated-year-tab-list li a{font-size:16px}
	.main-laureated-year-tab-list li a:before{top:-10px;}
	/* 왼쪽 텍스트영역 :: 텍스트 */
	.main-laureate-info-item{}
	.main-laureate-info-item .laureate-name-info{margin:2.4em 0;}
	.main-laureate-info-item .laureate-name-info .laureate-name{font-size:3.8em}
	.main-laureate-info-item .laureate-name-info .laureate-info{display:block; margin-left:0; margin-top:1.4em; }
	.main-laureate-info-item .laureate-detail-info dt{font-size:2.69em}

	/* -------- 수상자 오른쪽 컨트롤 -------- */
	.main-laureate-controls-box .main-laureate-more-btn{width:100px; margin-top:20px}
}
@media all and ( max-width: 480px ){
	.main-laureate-info-item .laureate-name-info .laureate-name{font-size:3em}
	.main-laureate-info-item .laureate-detail-info dt{font-size:2em}
}
/* ****************** 메인 시상식 ********************** */
@media all and (max-width:1917px){
	/* -------- 메인 시상식 :: 오른쪽 사진영역 -------- */
	.main-award-photo-box{left:auto; margin-left:0; float:right;}
}
@media all and (max-width:1536px){
	/* -------- 메인 시상식 :: 왼쪽 타이틀영역 -------- */
	.main-award-tit-box{position:static; float:left; width:300px; }
	.main-award-tit-inner{padding:0 30px; width:auto; font-size:44px; box-sizing:border-box; width:300px;}
	.main-award-video-btn{margin-left:0; margin-top:30px; top:auto;}
	
	/* -------- 메인 시상식 :: 오른쪽 사진영역 -------- */
	.main-award-photo-box{width:calc(100% - 300px);}
}
@media all and (max-width:1420px){
	/* -------- 메인 시상식 :: 왼쪽 타이틀영역 -------- */
	.main-award-tit-inner{padding:0; margin:0px auto;}
}
@media all and (max-width:1280px){
	/* -------- 메인 시상식 :: 왼쪽 타이틀영역 -------- */
	.main-award-video-btn{transform-origin:left center}
}
@media all and (max-width:1024px){
	#mainAwardsContent{margin:15% auto;}
	.main-award-txt-bg{bottom:auto; font-size:130px; letter-spacing:-10px; top:calc(11% + 9px);}
	.main-award-txt-bg .award-txt-inner{animation-duration:20s;}
	/* -------- 메인 수상자 :: 왼쪽 타이틀영역 -------- */
	.main-award-tit-box{float:none; width:auto; text-align:center;}
	.main-award-tit-inner .main-award-tit br{display:none;}
	.main-award-video-btn{margin:20px auto; transform-origin:center center }

	/* -------- 메인 수상자 :: 오른쪽 사진영역 -------- */
	.main-award-photo-box{width:auto; float:none; margin:25px 15px 0;}
}
@media all and (max-width:800px){
	/* -------- 메인 수상자 :: 왼쪽 타이틀영역 -------- */
	.main-award-tit-inner{font-size:35px}
	/* -------- 메인 수상자 :: 오른쪽 사진영역 -------- */
	.main-award-photo-box{width:auto; float:none; margin:0px 15px 0; padding-bottom:60px;}
	.main-award-photo-list{margin-right:0}
	.main-award-photo-list .main-award-photo-item{padding-right:0;}
	/* 오른쪽 사진영역 :: 화살표, 페이징 */
	.main-award-photo-controls{width:auto; left:0; height:60px; top:auto; bottom:0px;}
	.main-award-photo-controls button{width:auto; top:0; height:100%; bottom:auto;}
	.main-award-photo-controls .award-prev-btn{top:0; left:15px;}
	.main-award-photo-controls .award-next-btn{right:15px; left:auto;}
	.main-award-photo-controls button span{margin-top:7px}

	/* aos active */
	.main-award-photo-controls{transform:translateX(-50px); opacity:0; transition:all 1s 0.2s}
	.aos-animate .main-award-photo-controls{transform:translateX(0px); opacity:1; }
}
@media all and (max-width:480px){
	/* -------- 메인 수상자 :: 왼쪽 타이틀영역 -------- */
	.main-award-tit-inner{font-size:30px}
}

/* ****************** 메인 선학재단 Intro ********************** */
@media all and (max-width:1536px){
	/* 메인 선학재단 Intro :: 레이아웃  */
	#mainIntroContent{padding-top:10%; padding-left:30px;}
	#mainIntroContent:before{}
	.main-intro-wrapper{background-color:#fff; padding-top:30px}
	.main-peace-prize-con{padding:0 30px; font-size:17px; }
	.main-peace-prize-con.peace-prize-con1:first-child{margin-bottom:13%}
	.main-peace-prize-left-con{width:40%; box-sizing:border-box;}
	.main-peace-prize-right-con{width:60%; padding-left:30px; box-sizing:border-box;}
	/* 메인 선학재단 Intro :: 왼쪽이미지  */
	.main-peace-prize-left-con img{width:100%; max-width:100%; transform:translateX(0)}
	/* 메인 선학재단 Intro :: 왼쪽텍스트  */
	.peace-prize-con2 .main-peace-prize-left-con{width:60%; padding-left:0; }
	.peace-prize-con2 .main-peace-prize-right-con{width:40%; padding:0; }
}
@media all and (max-width:1024px){
	/* 메인 선학재단 Intro :: 레이아웃  */
	#mainIntroContent{padding:10% 30px 0; margin-bottom:14%}
	#mainIntroContent:before{height:15%;}
	.main-peace-prize-con{display:block; font-size:13px;}
	.main-peace-prize-left-con,
	.main-peace-prize-right-con,
	.peace-prize-con2 .main-peace-prize-left-con,
	.peace-prize-con2 .main-peace-prize-right-con{width:auto; text-align:center; padding:0;}
	.peace-prize-con2 .main-peace-prize-right-con{display:none;}
	/* 메인 선학재단 Intro :: 왼쪽이미지  */
	.main-peace-prize-left-con img{max-width:500px; margin:-10% auto 0; }
}
@media all and (max-width:800px){
	/* 메인 선학재단 Intro :: 레이아웃  */
	#mainIntroContent{padding:40% 0px 0;}
	.main-peace-prize-con{padding:0 15px;}
	/* 메인 선학재단 Intro :: 왼쪽이미지  */
	.main-peace-prize-left-con img{margin-top:-40%}
	/* 메인 선학재단 Intro :: 오른쪽 텍스트  */
	.main-peace-prize-right-con{padding-top:10%;}
	.main-peace-prize-right-con .main-peace-intro-tit{font-size:2.5em;}
	.main-intro-peace-txt-con .main-peace-intro-txt1{font-size:2em; }
	.main-intro-more-btn{margin-top:8%;} 

	html[lang="ko"] .main-intro-more-btn{width:200px}
}

/* ****************** 뉴스&인사이트 ********************** */
@media all and (max-width:1480px){
	#mainNewsContent:before{height:58%;}
	/* 뉴스&인사이트 :: 타이틀 */
	.main-news-tit-con{padding:0 30px;}
	.main-news-tit-con .main-news-insight-tit{font-size:44px;}
	/* 뉴스&인사이트 :: 리스트 */
	.main-news-insight-wrapper{height:auto; }
	.main-news-insight-inner{position:relative; left:Auto; top:auto; right:auto; margin-left:30px}
	.main-news-list-con .news-item{width:294px;}
	.main-news-list-con .news-info-box{font-size:14px;}
	/* 뉴스&인사이트 :: 버튼 */
	.main-news-more-btn{right:30px; top:-116px;}
}
@media all and (max-width:1024px){
	#mainNewsContent{padding:11% 0 0 0; margin-bottom:20%}
	/* 뉴스&인사이트 :: 타이틀 */
	.main-news-tit-con{text-align:center; margin-bottom:7.25% }
	.main-news-tit-con .main-news-insight-tit{font-size:35px; margin-right:0}
	.main-news-tit-con .main-news-prev-btn,
	.main-news-tit-con .main-news-next-btn{position:absolute; top:50%; transform:translateY(-50%)}
	.main-news-tit-con .main-news-prev-btn{left:25px;}
	.main-news-tit-con .main-news-next-btn{right:25px;}

	/* 뉴스&인사이트 :: 리스트 */
	.main-news-insight-inner{margin:0 30px}
	/* 뉴스&인사이트 :: 버튼 */
	.main-news-more-btn{position:relative; display:block; right:auto; top:auto; margin:7% auto 0; width:110px; height:33px; line-height:30px; font-size:12px; }
	.main-news-more-btn i{font-size:14px;}
	.main-news-more-btn.cm-btn-style02 span{line-height:26px;}
}

@media all and (max-width:800px){
	#mainNewsContent:before{height:57%;}
	/* 뉴스&인사이트 :: 타이틀 */
	.main-news-tit-con .main-news-insight-tit{font-size:30px;}
	/* 뉴스&인사이트 :: 리스트 */
	.main-news-list-con .news-info-box{padding:30px 3% 40px}
	.main-news-list-con .news-info-box .news-category{width:auto; min-width:58px; padding:0 10px; height:30px; line-height:30px;}
	.main-news-list-con .news-info-box{font-size:13px;}

}
@media all and (max-width:360px){
	#mainNewsContent:before{height:56.1%;}
}

/* ****************** 런&액트 ********************** */
@media all and (max-width:1480px){
	/* 런&액트 :: 타이틀 */
	.main-learn-tit{font-size:44px;}
	/* 런&액트 :: 리스트 */
	.main-learn-act-item a{font-size:14px;}
	.main-learn-act-item .off-info-tit-box{left:30px; right:30px; bottom:30px;}
}
@media all and (max-width:1024px){
	#mainLearnContent{margin-bottom:10%;}
	/* 런&액트 :: 타이틀 */
	.main-learn-tit{font-size:35px; margin-bottom:7%;}
	/* 런&액트 :: 리스트 */
	.main-learn-act-item a{font-size:12px;}
	.main-learn-act-item .off-info-tit-box{left:15px; right:15px; bottom:15px;}
	.main-learn-act-item .over-info-box{display:none;}
}
@media all and (max-width:800px){
	/* 런&액트 :: 타이틀 */
	.main-learn-tit{font-size:30px;}
}
@media all and (max-width:640px){
	/* 런&액트 :: 리스트 */
	.main-learn-act-list-con > ul{margin:0}
	.main-learn-act-item{float:none; width:auto; margin:0 0 10px 0}
	.main-learn-act-item .thumb{position:relative; height:0; padding-top:62%; display:block; background-repeat:no-repeat; background-size:cover;}
	.main-learn-act-item:nth-child(1) .thumb{background-image:url(/images/main/main_learn_act_img_02_m.jpg);}
	.main-learn-act-item:nth-child(2) .thumb{background-image:url(/images/main/main_learn_act_img_01_m.jpg);}
	.main-learn-act-item:nth-child(3) .thumb{background-image:url(/images/main/main_learn_act_img_03_m.jpg);}
	.main-learn-act-item .thumb img{display:none;}
	.main-learn-act-item .off-info-tit-box{left:25px; right:25px; bottom:25px;}
}
