@charset "utf-8";

/*-------------------------------------------------------------------------------------*
 *  °Ô½ÃÆÇ                                                                             *
 *-------------------------------------------------------------------------------------*/
.list_box  		 {width:100%;}
.list_tr{width:100%; font-size:0; display:flex;}
.list_tr>*{width:130px;}
.list_tr>*:nth-child(2){max-width:100%; width:calc(100% - 520px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.list_tr:not(.trfirst)>*:nth-child(2){padding-left:50px; font-weight:500; justify-content:flex-start;}
.list_title1     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; display: flex; align-items: center; justify-content:center; line-height:48px;}
.list_notice1    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}
.list1           {background:#191919; border-bottom:1px solid #000000; color:#efefef; font-size:12px; width:130px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}
.listview		 {width:100%;display: none;}
.listview.active {display: block;}
.listview_user		 {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; width:100%; display: flex; align-items: center; padding:30px; border-radius:0 0 8px 8px; line-height:1.5;    flex-wrap: wrap;}
.listview_user p {width: 100%;}
.listview_admin		 {margin:10px 0 0 0; background:#252525; border:1px solid #ff0066; color:#efefef; font-size:12px; width:100%; display: flex; align-items: center; padding:30px; border-radius:8px; line-height:1.5;flex-wrap: wrap;}
.listview_admin p {width: 100%;}


/* ÂÊÁöÇÔ */
.list_tr1{width:100%; font-size:0; display:flex;}
.list_tr2{width:100%; font-size:0; display:flex;}
.list_tr1>*{width:calc(100% / 3); transition:all 0.4s;}
.list_tr2>*{width:calc(100% / 4); transition:all 0.4s;}
.list_title2     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; display: flex; align-items: center; justify-content:center; line-height:48px;}
.list_notice2    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}
.list2           {background:#191919; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}

/* ÃæÀü³»¿ª/ȯÀü³»¿ª */
.list_tr3{width:100%; font-size:0; display:flex;}
.list_tr3>*{width:calc(100% / 6); transition:all 0.4s;} /* ºñÀ²ÀÌ°°Àº °Ô½ÃÆÇÀÏ°æ¿ì »ç¿ë ¿­¼ýÀÚ¿¡ ¸Â°Ô ¼ýÀÚ¸¸¼öÁ¤ÇØÁÖ¼¼¿ä */
.list_title3     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; text-align:center; display: flex; align-items: center; justify-content:center; line-height:48px;}
.list_notice3    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px;}
.list3           {background:#191919; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px;}


.list_tr4{width:100%; font-size:0; display:flex;}
.list_tr4>*{width:130px; transition:all 0.4s;}
.list_tr4>*:nth-child(2){max-width:100%; width:calc(100% - 390px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.list_tr4:not(.trfirst)>*:nth-child(2){padding-left:50px; font-weight:500; justify-content:flex-start; color:#ffffff;}
.list_title4     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; display: flex; align-items: center; justify-content:center; line-height:48px;}
.list_notice4    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}
.list4           {background:#191919; border-bottom:1px solid #000000; color:#efefef; font-size:12px; width:130px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}

.list_tr5{width:100%; font-size:0; display:flex;}
.list_tr5>*{width:150px; transition:all 0.4s;}
.list_tr5>*:nth-child(2){max-width:100%; width:calc(100% - 450px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.list_tr5:not(.trfirst)>*:nth-child(2){padding-left:50px; font-weight:500; justify-content:flex-start; color:#ffffff;}
.list_title5     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; display: flex; align-items: center; justify-content:center; line-height:48px;}
.list_notice5    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}
.list5           {background:#191919; border-bottom:1px solid #000000; color:#efefef; font-size:12px; width:150px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px; cursor:pointer;}

.list_tr7{width:100%; font-size:0; display:flex;}
.list_title7     {background:#1a1a1a; border-bottom:1px solid #000000; color:#878787; font-size:12px; font-weight:400; text-align:center; display: flex; align-items: center; justify-content:center; line-height:48px;width: -webkit-fill-available;}
.list_notice7    {background:#252525; border-bottom:1px solid #000000; color:#efefef; font-size:12px; text-align:center; display: flex; align-items: center; justify-content:center; padding:10px 5px 10px 5px;width: -webkit-fill-available;}

.write_box{width:100%; border-radius:8px; overflow:hidden;}
.write_tr{width:100%; display:flex;}
.write_title_top {border-top:1px solid #;}
.write_title     {background:#252525; border-bottom:1px solid #000000; color:#ffffff; width:200px; font-weight:500; font-size:12px; display:flex; align-items: center; justify-content: center; border-radius:0px;}  
.write_basic     {background:#191919; border-bottom:1px solid #000000; color:#dddddd; padding:12px 20px 12px 20px; width:calc(100% - 200px); border-radius:0px;}

.view_box		 {width:100%; border-radius:8px; overflow:hidden;}
.view_tr		 {width:100%; font-size:0;}
.view_tr>*		 {width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.view_tr>*:nth-child(1){max-width:100%; font-size:12px; width:calc(100% - 450px); text-align:left; padding-left:20px;}
.view_tr>.view1_title{font-size:16px; font-weight:500; width:100%; text-align:left; padding-left:20px;}
.view1           {background:#252525; color:#efefef; display:inline-block; text-align:center; vertical-align:middle; line-height:40px;}
.view1_title           {background:#1a1a1a; color:#efefef; display:inline-block; text-align:center; vertical-align:middle; line-height:48px;}
.view2           {background:#191919; border:1px solid #191919; padding:12px 20px 10px 20px; width:100%; line-height:26px; min-height:150px; color:#efefef; font-size:12px;}
.view1_po        {background:rgba(255,255,255,0.1); color:#bababa; padding:5px 8px 3px 8px; line-height:12px; text-align:center; display:inline-block;  font-size:12px; margin:0 5px 0 0; font-weight:300; border-radius:8px;}
.view2_l{float:left;}
.view2_r{float:left; padding:0 0 0 50px;}

.page_wrap       {float:left; width:100%; height:40px; text-align:center; clear:both;}
.page_wrap ul li {display:inline;}
.page            {background:#191919; color:#bababa; display:inline-block; padding:12px 17px 12px 17px; border-radius:8px;}
.pageon          {background:#ff0066; color:#fafafa; display:inline-block; padding:12px 17px 12px 17px; font-weight:500; border-radius:8px;}

.info_wrap       {background:#252525; border:1px solid #191919; float:left; width:100%; padding:15px 0 20px 0; border-radius:8px;} 
.info1           {float:left; width:100%; line-height:28px; color:#ffffff; padding:0 20px 0 20px; font-size:18px; font-weight:600; letter-spacing:-1pt;}
.info2           {float:left; width:100%; line-height:32px; color:#ffee00; padding:5px 20px 0 20px; font-size:16px; font-weight:400; letter-spacing:-1pt;}
.info3           {float:left; width:100%; line-height:26px; color:#ededed; padding:5px 20px 0 23px; font-size:12px; font-weight:400;}


.list_close:hover{filter: invert(16%) sepia(76%) saturate(6839%) hue-rotate(329deg) brightness(98%) contrast(109%);}


@media (hover: hover) {


}

@media screen and (max-width:1280px) {
.list_tr>*{width:110px;}
.list_tr>*:nth-child(4){display:none;}
.list_tr>*:nth-child(2){width:calc(100% - 330px);}
.list_tr:not(.trfirst)>*:nth-child(2){padding-left:30px;}	
.list_tr4>*{width:110px;}
.list_tr4>*:nth-child(2){width:calc(100% - 330px);}
.list_tr4:not(.trfirst)>*:nth-child(2){padding-left:30px;}
.list_tr5>*{width:110px;}
.list_tr5>*:nth-child(2){width:calc(100% - 330px);}
.list_tr5:not(.trfirst)>*:nth-child(2){padding-left:30px;}
}

@media screen and (max-width:1024px) {

	.list_tr3>*{width:calc(100% / 5);}
	.list_tr3>*:nth-child(1){display:none;}
	.list_title3:nth-child(2){border-left:1px solid #ff0066;}
	
	
	.write_tr {flex-wrap: wrap;}
	.write_title     {width:30%;}  
	.write_basic     {width:70%; padding:8px 12px 8px 12px;} 
										 

	.page_wrap ul li span{padding:10px 15px 10px 15px;}
	
	
	
	.list_title1,.list_title2,.list_title3,.list_title4,.list_title5{line-height:40px;}
}

@media screen and (max-width:768px) {
	.list_tr>*{width:100px;}
	.list_tr>*:nth-child(3){display:none;}
	.list_tr>*:nth-child(2){width:calc(100% - 200px);}
	.list_tr:not(.trfirst)>*:nth-child(2){padding-left:10px;}

	.list_tr4>*{width:100px;}
	.list_tr4>*:nth-child(1){display:none;}
	.list_tr4>*:nth-child(2){width:calc(100% - 100px);}
	.list_tr4>*:nth-child(3){display:none;}
	.list_tr4:not(.trfirst)>*:nth-child(2){padding-left:10px;}
	.list_tr5>*{width:70px;}
	.list_tr5>*:nth-child(1){display:none;}
	.list_tr5>*:nth-child(2){width:calc(100% - 110px);}
	.list_tr5>*:nth-child(4){width:40px;}
	.list_tr5:not(.trfirst)>*:nth-child(2){padding-left:10px;}

	.list_tr6>*{width:calc(100% / 4);}
	.list_tr6>*:nth-child(1){display:none;}
	.write_tr>*{width:100%; }
	.write_title {padding:12px 12px 5px 12px; justify-content:flex-start;}
	.write_basic{border-left:1px solid #191919; border-right:1px solid #191919;}
	.write_basic input:not([type="checkbox"]){width:100%;}
	.write_basic label{font-size:14px; width:25%; display:inline-block;}
	.write_basic input.input1_view{margin:2px 0 0 0;}
	
	.view_tr>*{width:33.33333%; text-align:left; font-size:12px; padding-left:10px; background:#1d1d1d; line-height:30px;}
	.view_tr>*:nth-child(1){width:100%; padding-left:15px; background:#252525; line-height:40px;}

	.view2           {padding:5px;}
	.view2_l{width:100%; text-align:center;}
	.view2_l img{width:100%;}
	.view2_r{width:100%; padding:0 0 0 0px;}
	
	
	.listview_user{padding:3vw;}
	.listview_admin{padding:3vw;}

}

@media screen and (max-width:600px) {
	.list_tr>*:nth-child(1){}
	.list_tr2>*{}
	.list_tr2>*:nth-child(2){}	
	.list_tr>*:nth-child(2){}

	
	.info3           {font-size:12px;}

	.list_box{overflow-x:auto;}
	.list_tr3{}
	.list_tr2{}
}

@media screen and (max-width:480px) {
	.list_tr>*{width:90px;}
	.list_tr>*:nth-child(2){width:calc(100% - 90px);}
	.list_tr:not(.trfirst)>*:nth-child(2){padding-left:10px;}

}
@media screen and (max-width:480px) {

}


/*-------------------------------------------------------------------------------------*
 *  ¹öÆ°                                                                               *
 *-------------------------------------------------------------------------------------*/
.btn1_1,.btn0_1         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:12px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);}
.btn1_2         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:12px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);}
.btn2_1         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:14px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);}
.btn2_2         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:14px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);}
.btn3_1         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:14px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);cursor: pointer;}
.btn3_2         {display:inline-block; text-align:center; border-radius:8px; color:#ffffff; font-size:14px; letter-spacing:0pt; font-weight:400; text-shadow:1px 1px 1px rgba(0,0,0,0.1);}

.btn_wrap_right        {float:left; width:100%; text-align:right;}
.btn_wrap_right ul li  {display:inline;}
.btn_wrap_center       {float:left; width:100%; text-align:center;}
.btn_wrap_center ul li {display:inline;}

.btn0_1         {background:#ff0066; min-width:60px; min-height:24px; padding:0 10px; line-height:24px;}
.btn0_1:hover   {filter:brightness(120%);}

.btn1_1         {background:#ff0066; min-width:80px; min-height:34px; padding:0 15px 0 15px; line-height:34px;}
.btn1_1:hover   {filter:brightness(120%);}

.btn1_2         {background:#353535; min-width:80px; min-height:34px; padding:0 15px 0 15px; line-height:34px;}
.btn1_2:hover   {filter:brightness(120%);}

.btn2_1         {background:#ff0066; min-width:120px; height:36px; line-height:36px;}
.btn2_1:hover   {filter:brightness(120%);}

.btn2_2         {background:#353535; min-width:120px; height:36px; line-height:36px;}
.btn2_2:hover   {filter:brightness(120%);}

.btn3_1         {background:#ff0066; min-width:160px; height:44px; line-height:44px;}
.btn3_1:hover   {filter:brightness(120%);}

.btn3_2         {background:#353535; min-width:160px; height:44px; line-height:44px;}
.btn3_2:hover   {filter:brightness(120%);}

.division1      {background:rgba(255,255,255,0.2); display:inline-block; text-align:center; min-width:70px; padding:6px 8px 6px 8px; line-height:12px; color:#ffffff; font-size:12px; font-weight:400; border-radius:8px;}
.division2      {background:#ff005c; display:inline-block; text-align:center; min-width:70px; padding:6px 8px 6px 8px; line-height:12px; color:#ffffff; font-size:12px; font-weight:400; border-radius:8px;}
.division3      {display:inline-block; text-align:center; min-width:40px; line-height:12px; padding:6px 8px 6px 8px; background:#17140c; color:#ff005c; font-size:10px; font-weight:400; border-radius:8px;}
.division4      {display:inline-block; text-align:center; min-width:40px; line-height:12px; padding:6px 8px 6px 8px; background:#d200ff; color:#ffffff; font-size:10px; font-weight:400; border-radius:8px;}

.write_basic_btn{display:inline-block; margin:0 0 0 10px;}
[class*="btn1_"] {margin: 0 0 2px;}

@media screen and (max-width:1250px) {
	.write_basic_btn{margin:5px 0 0 0;}

}
@media screen and (max-width:768px) {
	.display_flex{display:flex; flex-wrap: nowrap; align-items: center; justify-content: center;}
	.display_flex li{width:100%; margin:0 2px 0 2px;}
	.display_flex li button{width:100%;}
	.btn_wrap_center li button{width:100%;}			   
	.btn_wrap_right li button{width:100%;}			   
	[class*="btn2_"] {min-width:31%;}
	[class*="btn3_"] {min-width:31%;        width: 100%;}
	.division1{min-width:50px; font-size:10px;}
	.division2{min-width:50px; font-size:10px;}
	.division3{min-width:50px; font-size:10px;}
	.division4{min-width:50px; font-size:10px;}
	
	.write_basic_btn{float:left; width:100%; margin:5px 0 0 0; display:grid; grid-gap: 2px; grid-template-columns: repeat(4, 1fr);}
}

.btn1_1:hover , .btn1_2:hover , .btn2_1:hover , .btn2_2:hover , .btn3_1:hover , .btn3_2:hover {
	-webkit-animation: mouseover03 0.3s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
	        animation: mouseover03 0.3s cubic-bezier(0.470, 0.000, 0.745, 0.715) both;
}


@keyframes mouseover03 {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.01);
            transform: scale(1.01);
  }
}

/*-------------------------------------------------------------------------------------*
 *  ÅÇ                                                                                 *
 *-------------------------------------------------------------------------------------*/
/* .tab_wrap       {float:left; width:100%; margin:10px 0 0 0; transition:all 0.5s;}
.tab_wrap ul{float:left; width:100%; display:flex; flex-wrap:wrap;}
.tab_wrap ul li {float:left; padding:0 2px 1px 0; width:calc( 100% / 8);}
.tab_wrap ul li button{width:100%;}
.tab            {border: 2px solid #282828; border-bottom:none; width:100%; height:40px; line-height:40px; text-align:center; display:inline-block; color:#787878; font-weight:700; font-size:16px; border-radius:8px; text-shadow:1px 1px 1px rgba(0,0,0,0.4);}
.tab:hover      {border: 2px solid #ff0066; border-bottom:none; color:#ff0066;}
.tabon          {border: 2px solid #ff0066; border-bottom:none; width:100%; height:40px; line-height:40px; text-align:center; display:inline-block; color:#ff0066; font-weight:600; border-radius:8px; text-shadow:1px 1px 1px rgba(0,0,0,0.4); }

 */
@media screen and (max-width:1024px) {
}

@media screen and (max-width:768px) {
/* 	.tab_wrap ul li{width:33%; margin:0 0.5% 0.5% 0;}
	.tab_wrap ul li:nth-child(3n){margin:0 0 0.5% 0;}
	.tab_wrap ul li button{width:100%;}
	.tab{width:100%; font-size:12px;}
	.tabon{width:100%; font-size:12px;}
 */	
}
/*-------------------------------------------------------------------------------------*
 *  ÆùÆ®                                                                               *
 *-------------------------------------------------------------------------------------*/
.font01 {color:#ffffff; font-weight:500;}
.font02 {color:#2a2a2a; font-weight:500;}
.font03 {color:#d7d7d7;}
.font04 {color:#484848;}
.font05 {color:#ff0066; font-weight:500;}
.font06 {color:#60ff00; font-weight:500;}
.font07 {color:#ff8400; font-weight:500;}
.font08 {color:#e400ff; font-weight:500;}
.font09 {color:#ffee00; font-weight:500;}
.font10 {color:#ff6600; font-weight:500;}

.font11 {color:#ff0066; font-weight:500; font-size:16px;}
.font12 {color:#ffffff; font-weight:500; font-size:16px;}
.font13 {color:#b0977f; font-weight:500; font-size:16px;}
.font14 {color:#ffee00; font-weight:500; font-size:16px;}
.font15 {color:#ff005c; font-weight:500; font-size:16px; letter-spacing:-1pt;}

@media screen and (max-width:1024px) {
.font11 {font-size:14px;}
.font12 {font-size:14px;}
.font14 {font-size:14px;}
.font15 {font-size:14px;}
    
}
/*-------------------------------------------------------------------------------------*
 *  ÀÎDz                                                                               *
 *-------------------------------------------------------------------------------------*/
.input1       {background-color:#323232; border:1px solid #191919; padding:4px 0 4px 5px; color:#ffffff; border-radius:8px; height:34px;}
.input2       {background-color:#323232; border:1px solid #191919; padding:4px 0 4px 5px; color:#ffffff; border-radius:8px;}

input:focus, textarea:focus {border:1px solid #bababa;}