/*@charset "utf-8";
@import url('font.css'); 
@import url('content.css'); */

/*서브공통*/

.calendar_top {display:flex; justify-content: center; align-items: center; gap:30px;  padding:10px 0 22px; position:relative; width:100%; }
.calendar_top a { display:block; border:1px solid #aaa; width:44px; height:44px; line-height:41px; text-align:center;}
.calendar_top strong {font-size:22px;}
.calendar_top button {position:absolute; right:0; top:10px;}
.calendar tr:first-child { position:relative; z-index:2;box-shadow:0 5px 0 rgba(0,0,0,0.07);}
.calendar th {padding:18px 15px; border:0; background:none; border-bottom:1px solid #333;  position:relative; z-index:12;}
.calendar th:first-child , .calendar td:first-child .date {color:#ff4c4c;}
.calendar th:last-child , .calendar td:last-child .date {color:#4c8bff;}
.calendar td {height:145px; vertical-align: top; padding:15px; border:1px solid #ddd;}
.calendar td .date {display:block; margin-bottom:10px; font-weight:600;}
.calendar td.disable {background:#f2f2f2;}
.calendar td .type {display:flex; text-align:center; height:calc(100% - 32px); background:#333;  justify-content: center; align-items:center; background:#fafafa; font-size:16px; color:#666; border:1px solid #e5e5e5;}
.calendar td .type.rest {color:#00a139; border-color:#b7dbc4;}
.calendar td .box {display:block;}
.calendar td .box span { display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center; position:relative; font-size:16px; font-weight:normal;    color:#333; padding-left:14px; position:relative;}
.calendar td .box span:before {content:''; display:block; width:6px; height:6px; border-radius:50px; background:#ccc; position:absolute; left:2px; top:50%; margin-top:-3px;}
.calendar td .box span.on { color:#333; font-weight:500;}
.calendar td .box span + span {margin-top:6px;}
.calendar td .box span * {margin:0;}
.calendar td .box span em{width:40px;}
.calendar td .box span strong {display:inline-block; width:70px;  line-height:24px; text-align:center; background:#444; font-weight:normal; font-size:14px; color:#fff; border-radius:50px;}
.calendar td .box span strong.on {background:#ff7e00;}
.wait {padding:80px; border:1px solid #ddd; border-radius:30px; font-size:20px; line-height:1.5;}
.ex_txt01 ul { display:flex; flex-wrap:wrap; padding:20px 0 22px 20px; border-bottom:1px solid #eee;}
.ex_txt01 ul li {margin:4px 36px 4px 0; padding-left:12px; font-size:16px; position:relative;}
.ex_txt01 ul li:before {content:''; display:block; width:6px; height:6px; border-radius:5px; background:#888; position:absolute; left:0; top:50%; margin-top:-3px;}


.res_layer {position:fixed; left:0; top:0; right:0; bottom:0; z-index:12; background:rgba(0,0,0,0.5); overflow-y:auto; display:none; backdrop-filter: blur(5px); }
.res_layer .inr { max-width:1040px; margin:40px auto; background:#fff; padding:60px; position:relative;}
.res_layer .inr table {margin-bottom:20px;}
.res_layer .inr h2 {font-size:24px; margin-bottom:20px;}
.res_layer .inr th , .res_layer .inr td {height:56px; padding:10px 16px; font-size:16px;}
.res_layer .inr td .chk_time_box {display:flex; flex-wrap:wrap;}
.res_layer .inr td .chk_time_box label {display:inline-block; margin-right:24px; padding:6px 0; cursor:pointer;}
.res_layer .inr td .chk_time_box label input {width:18px; height:18px; margin-right:6px; position:relative; top:-1px;}
.res_layer .inr td .chk_time_box label input[disabled="disabled"] + span {color:#999;}
.res_layer .inr input[type='text'] , .res_layer .inr input[type='number'] , .res_layer .inr select {height:36px; border:1px solid #bbb; min-width:80px; padding:0 8px;}
.res_layer .inr .ex {color:#ff7e00; margin-bottom:20px; font-size:16px; font-weight:600;}
.res_layer .inr .layer_close {position:absolute; right:30px; top:30px; width:40px; height:40px; overflow:hidden; text-indent:-999px; border-radius:60px; transition: 0.3s; border:0; background:none;}
.res_layer .inr .layer_close:hover {transform: rotate(90deg);}
.res_layer .inr .layer_close:hover:before , .res_layer .inr .layer_close:hover:after {background:red;}
.res_layer .inr .layer_close:before {content:''; display:block; position:absolute; left:5px; top:18px; width:30px; height:4px; background:#000; transform: rotate(45deg);}
.res_layer .inr .layer_close:after {content:''; display:block; position:absolute; left:5px; top:18px; width:30px; height:4px; background:#000; transform: rotate(-45deg);}

.res_layer .inr .line_box {border:1px solid #ccc; padding:15px; margin:10px 0; font-size:16px;}
.res_layer .inr .line_box input {width:16px; height:16px; margin-right:8px; position:relative; top:-1px;}
.res_layer .inr .res_btn {display:block; width:200px; height:54px; line-height:54px; text-align:center; margin:32px auto 0; background:#000; color:#fff; font-weight:600; border-radius:50px;}


.s01_top {display:flex; gap:20px;}
.s01_top li {width:100%; border:3px solid #eff3f8; border-radius:20px; text-align:center; padding:40px 10px;}
.s01_top li strong {display:block; margin:20px 0 10px;}


.m3 {}
.m3 h2 {font-size:34px; margin-bottom:30px;}
.m3 h2 span {font-weight:normal; font-size:17px; color:#555; margin-left:25px; letter-spacing:-0.04em;}
.m3 ul {display:flex; gap:24px; margin-top:30px;}
.m3 ul li {display:flex; width:100%; gap:50px; padding:50px 0; border-radius:20px; border:5px solid #eff3f8; flex-direction: column; justify-content: center; align-items: center; text-align:center;  }
.m3 ul li img {width:160px;}
.m3 ul li span {font-size:19px; font-weight:500;}
.m3 ul li:nth-child(2) img , .m3 ul li:nth-child(4) img {order:2;}




@media (max-width: 1279px){
    

   
    
     .m3 ul li img {width:100px;}
    
}



@media (max-width: 767px){



.wait {border:0; padding:0; font-size:18px;}
.calendar_top {gap:25px; padding:0 0 60px;}
.calendar_top a { width:30px; height:32px; line-height:28px; font-size:14px;}
.calendar_top strong {font-size:18px;}
.calendar_top button { bottom:8px; top:initial; right:50%; margin-right:-52px; height:40px;}
.calendar {border-top:1px solid #333; border-bottom:1px solid #333;}
.calendar colgroup col { width:100% !important; display:block;}
.calendar , .calendar td , .calendar tr , .calendar tbody {display:block; width:100%; }
.calendar th , .calendar td.none { display:none;}
.calendar td {border:0; border-left:1px solid #e2e2e2; border-right:1px solid #e2e2e2; border-top:1px solid #e2e2e2; position:relative; height:auto; padding:10px 10px 10px 50px; min-height:40px;}
.calendar td .date {position:absolute;  left:0px; top:0; bottom:0; width:40px; text-align:center; display:flex; justify-content:center; text-align:center; font-size:13px; align-items: center; margin:0; background:#fff; border-right:1px solid #e2e2e2;  font-weight:normal;}
.calendar td .type {height:20px; border:none; background:none; font-size:13px; line-height:20px;}

.calendar td.disable {background:#f6f6f6;}
.calendar td .box {display:flex; flex-wrap:wrap; gap:0px; align-items: center;}
.calendar td .box span {width:calc(33.3333% - 6px); margin:0 3px;  display:block; text-align:center;}
.calendar td .box span:before {display:none;}
.calendar td .box span em {display:block; margin-bottom:3px; text-align:center; width:100%;}
.calendar td .box span + span {}
.calendar td .box span em {font-size:13px;}
.calendar td .box span strong {width:90%; font-size:13px; height:22px; line-height:22px; }
.calendar td .box span strong.on {}


.res_layer .inr {margin:5px; padding:20px;}
.res_layer .inr h2 {font-size:20px; margin-bottom:15px;}
.res_layer .inr th, .res_layer .inr td {padding:10px; font-size:15px;}
.res_layer .inr input[type='text'], .res_layer .inr input[type='number'], .res_layer .inr select { width:100%; height:34px; font-size:15px;}
.res_layer .inr td .chk_time_box {display:flex; flex-wrap:wrap; gap:5px;}
.res_layer .inr td .chk_time_box label {display:block; width:100%; margin:0; padding:0;}
.res_layer .inr .layer_close {top:10px; right:10px;}
.res_layer .inr .res_btn {height:40px; line-height:40px; margin-top:20px; margin-bottom:10px;}
.res_layer .inr .line_box {font-size:15px;}

    
    .s01_top {display:block;}
    .s01_top li {padding:20px 10px; }
    .s01_top li img {width:60px;}
    .s01_top li strong {margin:12px 0 6px;}
    .s01_top li + li { margin-top:15px;}
    
     .m3 {margin:50px 0;}
    .m3 h2 {font-size:24px;}
    .m3 h2 span {display:block; margin:10px 0 0; font-size:16px;}
    .m3 ul {display:block;}
    .m3 ul li {width:100%; border-width:3px; border-radius:10px; display:flex; flex-direction:row; padding:20px 30px; justify-content: space-between; margin-bottom:20px;}
    .m3 ul li img {width:60px;}
    .m3 ul li span {font-size:16px;}
    
}