@charset "utf-8";
/* CSS Document */
.sns_quick {display:none;}
#sns_quick_id.sns_quick_box{
	position:absolute;
	right:1%;
	z-index:1004;
	top:60%;
	opacity:1;
}
#sns_quick_id.sns_quick_box .box{
	padding:20px;
	background-color:#54a800;
	box-shadow:0px 8px 5px 0px rgba(0,0,0,0.2);
	border-radius:6px;
}
#sns_quick_id.sns_quick_box .box a {
	display:block;
	color:#fff;
	padding:5px 30px;
	border-radius:6px;
}
#sns_quick_id.sns_quick_box .box::before{
	width:100%;
	text-align:center;
	content:'CWTTA SNS';
	font-size:24px;
	display:block;
	position:absolute;
	top:-22px;
	left:0px;
	font-weight:900;
	letter-spacing:-0.2px;
	color:#fff;
	text-shadow:1px 1px 2px #418200, -1px -1px 2px #418200, 0px 0px 4px #418200;
}

#sns_quick_id.sns_quick_box .box a:hover,
#sns_quick_id.sns_quick_box .box a:focus {
	color:#1f62de;
	background-color:#fff;
}

#wrapper{
}
#container_wr{background-color:#ffffffdd; /*position:relative;*/ z-index:0;}
#container{

}
.index_header {height:70vh;transition:height 0.3s;}

.tmp{position:absolute; top:15%;width:100%;}
.tmp img {position:absolute;margin-top:0;}
.tmp img:nth-child(1){
	left:10%;
	animation-duration: 5s;
	animation-name: elastics;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	transition:all 0.5s ease;
}
.tmp img:nth-child(2){
	right:0%;
	animation-duration: 5s;
	animation-name: elastics1;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	transition:all 0.5s ease;
}

.bg_move {
  position: absolute;
  top: 0;
  bottom: 0;
  right: auto;
  background-position: center;
  background-repeat:repeat;
}

#gnb.fixed {
	position:fixed;
	left:0;
	width:100%;
	top:0px;
	z-index:50;
	background-color:#fff;
	border-color:#00000030;
	transition:all 0.3s ease-in-out;
}
#gnb.fixed .gnb_1da{
	color:#000;
}
#gnb.fixed .gnb_menu_btn{
	color:#000;
}
#hd_wrapper .hd_sch_wr{	}
#hd_wrapper .hd_sch_wr.fixed {
	position:fixed;
	left:0;
	width:100%;
	top:0px;
	z-index:51;
	float: none;
	padding: 5px;
	margin-left: 0;
	background-color:#ffffff;
	transition:all 0.3s ease-in-out;
}
#hd_wrapper .hd_sch_wr.fixed #hd_sch #sch_stx{
	width:calc(100% - 60px);
	transition:all 0.5s;
}
#hd_wrapper .hd_sch_wr.fixed #hd_sch {max-width:80%;margin:0 auto;}
#hd_wrapper .hd_sch_wr.fixed #hd_sch > form > div{
    border-radius: 30px;
    height: 48px;
    border: 1px solid #ccc;
}
#hd_wrapper .hd_sch_wr.fixed #hd_sch > form > div::before,#hd_wrapper .hd_sch_wr.fixed #hd_sch > div::after {content:'';display:table;}
#hd_wrapper .hd_sch_wr.fixed #popular {width:80%;margin:10px auto;padding:0 20px; color:#000;z-index:60;}

#hd_wrapper .hd_sch_wr.fixed  #hd_sch #sch_stx {
    background: #ffffff;
    color: #242424;
    border: 0;
    border-width: 0;
    outline: 0;
}
#hd_wrapper .hd_sch_wr.fixed  #hd_sch .sch_stx_label {
    background: #ffffff;
    color: #242424;
    border: 0;
    border-width: 0;
}
#hd_wrapper .hd_sch_wr.fixed #hd_sch #sch_submit {
    background: #ffffff;
    color: #242424;
    border: 0;
    border-width: 0;
}
@keyframes elastics {
	  0%{left:10%;top:10%;margin-top:15px;}
	 50%{left:13%;top:15%;margin-top:0;	transform:rotate(360deg);}
	100%{left:10%;top:10%;margin-top:-15px;}
}
@keyframes elastics1 {
	  0%{right:0%;top:10%}
	 50%{right:13%;top:15%;margin-top:20px;	transform:rotate(360deg);}
	100%{right:0%;top:10%;margin-top:-35px;}
}



#menu-mobile{display:none;}
.mobile-menu,
.mobile-menu.close{display:none;}


@media all and (max-width:1184px) {
	#sns_quick_id.sns_quick_box{z-index:-100;opacity:0;}
	.sns_quick{display:block; margin-top:20px;position:relative;padding:15px 10px 10px 10px;background-color:#54a800;}
	.sns_quick::before{
		width:100%;
		text-align:center;
		content:'CWTTA SNS';
		font-size:24px;
		display:block;
		position:absolute;
		top:-22px;
		left:0px;
		font-weight:900;
		letter-spacing:-0.2px;
		color:#fff;
		text-shadow:1px 1px 2px #418200, -1px -1px 2px #418200, 0px 0px 4px #418200;
	}
	.sns_quick a {color:#fff;font-size:20px;display:block;}
	#gnb {
		border:0 !important;
	}
	#gnb .gnb_wrap{
		display:none;
	}
	.page_sidebar_wrap {display:none;}
	.sub_page #container.html_wrap{grid-template-columns:1fr;}
	/* 모바일메뉴 시작 */
	#menu-mobile{
		font-size:0.9rem;
		position:fixed;
		top:0;
		left:-100%;
		display:block;
		height:100%;
		width:85%;
		max-width:600px;
		overflow:hidden;
		background-color:#ffffff50;
		box-shadow:3px 0px 8px rgba(0,0,0,0.75);
		transition:all 0.4s ease-in-out;
		z-index:1001;
	}
	#menu-mobile.on{
		background-color:#ffffff;
		height:100%;
		z-index:1004;
	}
	#mobile-logo {height:60px;box-sizing:border-box;padding:8px;position:relative;background-color:#fff;text-align:center;}
	#mobile-logo a{display:inline-block;height:100%;font-size:1.4rem;font-weight:bold;}
	#mobile-logo a img{height:100%;width:auto;display:inline-block;}
	.mobile-menu.open {position:absolute;right:10px;top: 8px;}

	.sub_page #gnb{z-index:55;}
	.sub_page  .mobile-menu.open a{color:#000;}
	.sub_page #hd_wrapper {
		flex: 1 1 70px;
	}
	.sub_page #hd_sch {
		padding: 10px 10px 10px 0px;
	}
	.mobile-menu.open a{font-size:3rem;color:#fff;height: 40px;line-height: 40px;display: block;overflow: hidden;}
	.mobile-menu.close a{font-size:3rem;color:#fff;display: block;overflow: hidden;}
	.mobile-menu.close a{color:#fff;}

	#menu-mobile ul,#menu-mobile li{margin:0;padding:0;list-style:none;}
	#menu-mobile ul.main-menu {list-style: none;margin: 0;padding: 0;position: absolute;width:100%;height:calc(100% - 60px);background:#fff;overflow-y:auto;}
	#menu-mobile ul.main-menu > li {position: relative;margin: 0;padding: 0;}
	#menu-mobile ul.main-menu > li > a {padding:0 1em 0 1.5em ;display: block;position:relative;}
	#menu-mobile ul.main-menu > li > a:hover{background-color:#f4f4f4;color:#000;}
	#menu-mobile ul.main-menu > li > a > .fa,#menu-mobile>ul.main-menu > li > a > .glyphicon,#menu-mobile>ul.main-menu > li > a > .ion {width: 20px;}
	#menu-mobile ul.main-menu > li .label,#menu-mobile>ul.main-menu > li .badge {margin-right: 5px;}
	#menu-mobile ul.main-menu > li .badge {margin-top: 3px;}
	#menu-mobile ul.main-menu > li.header {padding:0px;height:90px;background-color:#fff;border-bottom: 1px solid #ddd;}
	#menu-mobile ul.main-menu > li.header a {text-align:center;}
	#menu-mobile .treeview > a {position:relative;}
	#menu-mobile .treeview > a:after {display:block;content:'\f2c7';position:absolute;top:50%;right:10px;transform:translate(0,-50%);font-family:'Ionicons'; font-size:1.5rem;color:#ddd;}
	#menu-mobile .treeview.menu-open > a:after {content:'\f2f4';color:#f4f4f4;}
	#menu-mobile ul.main-menu  .menu-open > a,#menu-mobile>ul.main-menu  .menu-open > a:hover {color: #fff;background-color:#434e5f;}
	#menu-mobile .treeview .treeview-menu{display:none;}
	#menu-mobile ul.main-menu  .active > .treeview-menu {}
	#menu-mobile ul.main-menu .fa.pull-right {margin-left: .3em;}
	#menu-mobile ul.main-menu .treeview-menu {padding:0em;}
	#menu-mobile ul.main-menu .treeview-menu li{border-bottom: 1px solid #ddd;}
	#menu-mobile ul.main-menu .treeview-menu li.on a{font-weight:700;}
	#menu-mobile.on {display:block}
	.mobile-menu.open{display:block;}
	#menu-mobile.on .mobile-menu.close{border:none;display:inline-block;vertical-align:middle;position:fixed;right:0;top:1rem;z-index: 115;width: 50px;}
	.mobile-menu.close a{font-size:5rem;color:#fff;}
	#menu-mobile>ul.main-menu > li.treeview:first-child > a{border-top:1px solid #ddd;}
	#menu-mobile>ul.main-menu>li>a{color: #444;font-size:1.05em;border-bottom: 1px solid #ddd;height:57px;line-height:57px;position:relative;}
	#menu-mobile>ul.main-menu>li>a.on::before{
		content:'';
		position:absolute;
		height:100%;
		width:5px;
		background-color:#0033cc;
		top:0;
		left:0;
	}
	#menu-mobile>ul.main-menu>li>ul{background-color: #f5f5f5;}
	#menu-mobile>ul.main-menu>li>ul>li>a{color: #222;display: block;padding: 0.8em 1em;}
	#menu-mobile>ul.main-menu>li>ul>li>a:hover,#menu-mobile>ul.main-menu>li>ul>li>a:focus{background-color:#dfdfdf;color:#000;}
	#menu-mobile>ul.main-menu>li>ul>li>a.on{background-color:#dfdfdf;color:#1748a4;font-weight:700;}
	.body-fixed{position:fixed;width:100vw;height:100vh;overflow:hidden;}
	.mobile_menu_wrap.on::after{content:'';display:block;position:fixed;width:100vw;height:100vh;top:0;left:0;background-color:rgba(0,0,0,0.6);z-index:-1;}
	#main_slide .main_side-item .ms_slogun_wrap{top:130px;}
	#logo > a {font-size:1.6em;}

@media all and (max-width:1000px) {
	#discord_m {display:block;}
	#discord_pc {display:none;}
}

@media all and (max-width:996px) {
	.index_header {height:60vh;transition:height 0.3s;}
	#main_slide .main_side-item .ms_slogun_wrap .ms_slogun_box {
		font-size: 0.75rem;
	}
	.main_section_05 {padding-top:0px;}
}

@media all and (max-width:1200px){
	#hd_sch #sch_stx {
		float: left;
		width: calc(100% - 70px);
	}
}

@media all and (max-width:960px){
	.main_section_05 [class*='quick_info_box_'] {
		max-width: 90%;
		padding: 15px 25px;
		margin-bottom:10px;
	}
	.hd_pops{left:0px !important;top:120px !important;}

	#lt_notice_box2,
	#lt_video_box1,
	#lt_video_box2{margin-top:40px;}
	
	.main_section_04 {padding-top:0px;}
}
@media all and (max-width:880px){
	.top_search_area #bo_sch{position:relative;
		top:0;
		left:0;
		transform:translate(0px,0px);
	}
	.top_search_area{
		height:auto;
		padding:20px;
	}
}
@media all and (max-width:768px){
	#logo {
		width: 100%;
		min-width: 80px;
		max-width: calc(100% - 60px);
	}
	#hd_wrapper #logo {
		width:100%;
		min-width: 80px;
		max-width: 80px;
	}
	.hd_sch_wr {
		width: calc(100% - 140px);
	}
	.dicord_qrcode {margin:0 auto;}
	.hd_pops_con{overflow-x:auto;}
	.main_section_01 > .grid-row > div:last-child > .ad_banner_wrap{margin-top:20px;}
	.sns_quick{margin-top:40px;}

	.main_section_01{padding-top:0px;}
	.main_section_02{/* padding-top:0px; */}

}
@media all and (max-width:600px){
	.index_header {
		height: 400px;
	}
	#main_slide .main_side-item .main_side-item .ms_slogun_wrap .ms_slogun_box {
		font-size: 0.5rem;
	}
	#main_slide .main_side-item .main_side-item .ms_slogun_wrap .ms_slogun_box h2 {
		margin-bottom: 15px;
	}
	#main_slide .main_side-item .main_side-item .ms_slogun_wrap .ms_slogun_box p {
		font-size: 2em;
	}
	.sub_page .hd_sch_wr {
		padding: 0;
		width: 80%;
	}

	.main_banner_qa {
		flex-direction: column;
		margin-top:20px;
		padding-left:20px;
	}

	.main_banner_qa > div:first-child,.main_banner_qa > div:last-child {
		width: 100%;
	}
	.main_banner_qa > div:first-child{
		font-size:1.1em;
		text-align:center;
		color:#666;
	}
	.main_banner_qa > div:last-child{
		text-align:center;
	}
	.main_banner_qa > div:first-child > strong {
		display: inline-block;
	}
	.outlink {
		position: static;
		z-index: 1;
		right: 0;
		top: 0;
		margin-top:15px;
	}

}
@media all and (max-width:560px){
	body {font-size:0.75em;}
	#ft_company,
	#ft_link .ft_cnt > a {
		font-size:1.1em;
	}
	#bo_sch > form{display:flex;}
	#bo_sch select#sfl {width:25%;}
	#bo_sch .sch_input {width:50%;}
	#bo_sch .sch_btn {width:15%;}
	.sub_page .tbl table th,.sub_page .tbl table td{font-size:0.75rem;}
	.sub_page .page_tit_box {
		height: auto;
		margin-bottom:15px;
	}
	/* 2022-12-29 */
	#hd_qnb li a {
		
	}
}
@media all and (max-width:440px){
	.index_header {
		height: 280px;
	}
	#hd_sch .sch_stx_label{display:none;}
	#hd_sch #sch_stx {
		padding-left: 10px;
	}
	.quick_wrap > li {width:calc(100% / 2);}
	#logo {
		width:100%;
		min-width: 60px;
		max-width: 60px;
	}
	[class *="main_section_"] h2 {font-size:1.5em;}
	.main_banner_qa > div:last-child > h3 a {
		font-size: 2em;
	}
	.sub_page .main_banner_qa > div:last-child > h3 a {
		font-size: 1.8em;
	}
	 #club_header #logo {
        width: 100%;
        min-width: 80px;
        max-width: calc(100% - 60px);
    }
	#main_slide .main_side-item .ms_slogun_wrap .ms_slogun_box{
		font-size:0.6em;
	}
	#hd_qnb li a {font-size:0.85rem;}
	.frm_flex{display:flex;}
	.main_section_05 [class*='quick_info_box_'] h3 {font-size:1.35em;}

}