@font-face {
    font-family: 'Cafe24Ssurround';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff');
    font-weight: normal;
    font-style: normal;
} 

:root {
  --main_c : #29a9f0;
}
:root {
  --main_c2 : #ffce00;
}
 

body { width:100%; display:inline-block  }
html { width:100%; display:inline-block }


#wrap {height:100%; position:relative; width:100%;   display:inline-block}
 
#container {width:100%; display:inline-block;}
  
  
.in {width:100%; margin:0 auto; max-width:1160px;}
.flex {display:flex}

 @media all and (max-width:1160px) {
		.in {padding:0 3%; box-sizing:border-box; }
		.flex {flex-wrap:wrap}

}

/*푸터*/
footer .top_link {width:60px;  line-height:60px; background-color: var(--main_c);  text-align:Center; font-size:1rem; display:inline-block; color:#fff  ; position:fixed; right:0; bottom:10%;  }

footer {width:100%; font-size:.97rem; padding:40px 0 60px 0;  font-weight:300;  box-sizing:border-box; line-height:1.5em; color:#222; display:inline-block; text-align:Center }
footer h2 {margin-bottom:10px; }
 


.table_wrap {border:2px solid #333; background-color:#fff; border-radius:10px; overflow:hidden}

table.basic {width:100%;  }
table.basic th {border-bottom:1px solid #ddd; font-size:1.1em;   background-color:#f6f6f6; padding:13px 12px}
table.basic td { border-bottom:1px solid #ddd;   padding:12px 12px}
table.basic tr:last-child td { border-bottom:none}
table.basic td label {background: var(--main_c); color:#fff; width:100px; display:inline-block;  text-align:center; border-radius:50px; line-height:35px}
table.basic td label.type2 {background:#f3f3f3; color:#111;  }

table.basic2 th {border:1px solid #ddd; font-size:1.1em; background-color:#f6f6f6; padding:12px 30px}
table.basic2 td {border:1px solid #ddd; padding:12px 20px}

ul.basic {width:100%;}
ul.basic > li {display:flex; margin-bottom:3px; }
ul.basic > li:last-child { margin-bottom:0; }
ul.basic > li:before {content:'·'; flex-shrink:0;  margin-right:5px; box-sizing:border-box; border-radius:50%; }


@media all and (max-width:900px) {
		table.basic.list_table tr:first-child {display:none}
		table.basic.list_table tr {display:flex; position:relative;  border-bottom:1px solid #ddd;  flex-wrap:wrap;  padding:15px}
		table.basic.list_table tr:last-child {border-bottom:none}
		table.basic.list_table td { box-sizing:border-box; margin-right:5px; padding:1px 0; display:flex; align-items:center; border:none}
		table.basic.list_table td label {position:absolute; right:0; top:-1px; line-height:28px; font-size:15px; width:70px; border-radius:0}
		table.basic.list_table td:nth-child(1) {order:4; color:#333}
		table.basic.list_table td:nth-child(1):before {content:'신청자:'; margin-right:5px}
		table.basic.list_table td:nth-child(2) {order:5; color:#333 }
		table.basic.list_table td:nth-child(2):before {content:'환자이름:'; margin-right:5px}
		table.basic.list_table td:nth-child(3) {order:6; color:#333 }
		table.basic.list_table td:nth-child(3):before {content:'간병인이름:'; margin-right:5px}
		table.basic.list_table td:nth-child(4) {order:3; width:calc(100% - 100px)  }
		table.basic.list_table td:nth-child(6) {order:2; width:95px;  white-space : nowrap;  margin-right:0  }  
		table.basic.list_table td:nth-child(5) {order:1; margin-right:0 }
		table.basic2 th { font-size:1em; padding:12px 20px}


}

/* 라인 스타일 */
.line {
		position: absolute;
		top:50%;
		margin-top:-20px;
		width: 43px;
		height:43px;
		z-index:99999999; 
		background:rgba(255,255,255,.6); 
		border-radius:50%;
		cursor:pointer;
		box-sizing:border-box;
		transition: all 0.3s ease-out;
		border:2px solid rgba(255,255,255,0); 
 }
 .line:hover {border:1px solid var(--main_c);   background:rgba(255,255,255,1); }

/* 화살표 스타일 */
.line::after {
  content: '';
  position: absolute;
  left:50%;
  
  top: 50%;
  margin-top:-8px;
  margin-left:-12px;
  width: 13px;
  height: 13px;
  border-top: 3px solid #333;
  border-right: 3px solid #333;
  transform: rotate(45deg);
   transition: all 0.3s ease-out;
  
}

.line:hover::after {
   border-top: 3px solid  var(--main_c);
  border-right: 3px solid  var(--main_c);
   
}
.line.right {right:18px; }
.line.left {left:18px; }

.line.left::after { margin-left:-6px; transform: rotate(220deg); }


a.basic_btn {background:var(--main_c2);  border:1px solid var(--main_c2);   font-size:1.1em; box-sizing:border-box; padding:0 40px;   line-height:50px; color:#222; border-radius:5px; display:inline-block; transition: all 0.3s ease-out; }
a.basic_btn:after {content:'→'; margin-left:auto}
a.basic_btn + a.basic_btn {margin-left:5px}



@media all and (max-width:900px) {
		a.basic_btn {   font-size:1em; }

		footer {  font-size:.86rem; }
		footer .top_link {display:none}
		footer img {width:120px}


	}