@charset "utf-8";
/* -----------------------------------------------
	* 메인 화면 스타일 정의
--------------------------------------------------
	- 최초 작성일 : 2021.08.15
	- 최초 작성자 : 아보카도
	- 최종 수정일 :
	- 최종 수정자 :
--------------------------------------------------*/


/****************************************************
	메인 레이아웃
****************************************************/

#body {opacity:0;}
#no_design_main {position:relative; padding:50px 0; }
#no_design_main2 {position:relative; 
    top: 50%;
    left: 50%;
    transform: translate(-50%, 30%);
    box-sizing: border-box;}
#no_design_main:after {content:""; display:block; position:relative; clear:both; height:70vh; z-index: 90;}

#main_banner_box {padding:20px; height:200px; text-align:center; box-sizing:border-box;
	top: 50%;
  left: 50%;
  transform: translate(-50%, -20%);
	
	position: absolute;
  
}

.m_container {
  margin: 25px;
  width: 400px;
  height: 200px;
  outline: dashed 1px black;
  /* 설정 */
  position: relative;
	
  align-items: center;
	overflow: auto;
	z-index:999;
}

:root {
	--title-font: 'GmarketSansMedium';
	--subtit-font: 'ROEHOE-CHAN';
	--content-font: 'Pretendard-Regular';
	--point-col: #999900; /*포인트 색상*/
	--content-col: rgb(200, 200, 200);
	--text-col1: #fff;
	--back-color: linear-gradient(to top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.10)); /*배경색*/
	--bo-radius: 10px; /*게시판 둥글기*/

	--tape-gray: #dcdee6;
	--tape-edge-gray: #b7b49d;
	--paper-color: #ffffff;
	--paper-dark: #dee0e3b0;
	--shadow-size: 3px;
	--transparent: rgba(213, 224, 249, 0);

	}
#bo_v_con {margin-top: 10px !important;}
.grid-item.full-width {

	padding: 20px;
	overflow: auto;
	height:100px;
	width: 300px;
	box-shadow: inset 0px 11px 8px -10px  #ffffff27,	inset 0px -11px 8px -10px  #ffffff27; 

	backdrop-filter: blur(5px);
	background-image:var(--back-color);
	border-radius:var(--bo-radius);
	z-index:90;

	top: 50%;
  left: 50%;
  transform: translate(-50%, 40%);
	position: absolute;
	
	text-align: center;
  
}






/****************************************************
	메인 슬라이드 배너
****************************************************/

#main_visual_box {min-height:100px; background:#000; margin-bottom:20px;}


/****************************************************
	메인 트위터 박스
****************************************************/

#main_twitter_box {position:relative; width:32%; height:260px; float:left; margin-bottom:20px;}
.twitter {max-height:100%;}


/****************************************************
	메인 이미지 박스
****************************************************/

#main_image_box {position:relative; width:32%; margin-left:2%; margin-right:2%; height:260px; text-align:center; line-height:260px; float:left; margin-bottom:;}


/****************************************************
	메인 우측 박스 (로그인 / 일반)
****************************************************/

#main_side_box {position:relative; width:32%; height:260px; float:right; margin-bottom:20px;}
#main_login_box {margin-bottom:20px;}



/****************************************************
	메인 카피라이터
****************************************************/

#main_copyright_box {display:block; position:relative; clear:both; text-align:center;}


/****************************************************
	반응형 스타일
****************************************************/

@media all and (max-width:1024px)  {
	#no_design_main {padding-top:20px;}
	#no_design_main2 {position:relative; 
    top: 50%;
    left: 50%;
    transform: translate(-50%, 3%);
    box-sizing: border-box;}
}
@media all and (max-width:800px)  {
	#main_twitter_box,
	#main_image_box,
	#main_side_box  {width:auto; float:none; margin:0 0px 20px;}
}