/* 공통 */
.sub_bg{background-color: #fafafa; padding:10rem 0}
.tac{text-align: center;}
.mb{margin-bottom: var(--mb);}
.fmb{margin-bottom: var(--fmb) !important;}
.bmb{margin-bottom: var(--bmb);}
.mEnter{display: block;}
.pd0{padding-bottom: 0 !important;}
.mb0{margin-bottom: 0 !important;}
.pointTxt{color: var(--point_color);}
.mainTxt{color: var(--main_color);}
.wTxt{color: #fff;}
.wrap_bg{background: var(--main_color); padding: 7rem 0; background-size: cover !important;}
.conTxt{font-size: var(--conTxt);}
.tit_dot,.tit_nm{position: relative; margin-bottom: var(--mb); font-size: var(--conTit); padding-left: 2.8rem;}
.tit_nm{padding-left: 0;}
.tit_nm.btit{font-size: var(--bTit);}
.tit_dot:before{content: ''; width: 1rem; height: 2.5rem; background: var(--point_color); transform: skewX(-15deg); position: absolute; left: 0; top: 1rem;}

.tit_point{font-size: 5rem; margin-bottom: var(--mb); color: var(--main_color);}
.tit_sm{font-size: var(--sTit);}

.pointBox{ border-radius: var(--bdr); padding: 2rem; background: var(--brColor2);}
.imgbox img{width: 100%; display: block; max-width: 1200px; margin: 0 auto;}
@media all and (min-width:768px) {
.mEnter{display: inline;}
.tEnter{display: block;}
.tit_point{font-size: 10rem;}
.wrap_bg{padding: 10rem 0;}

}

@media all and (min-width:1280px) {
.tEnter{display: inline;}
.pEnter{display: block;}
.tit_dot:before{height: 3rem; }
.tit_point{font-size: 15rem;}
.wrap_bg{padding: 13rem 0;}
}

.bg_company{background: url(../images/company/bg_company.jpg) no-repeat center center;}
.bg_rnd{background: url(../images/rnd/bg_rnd.jpg) no-repeat center center;}
.bg_rnd .comm_dl{color: #fff;}

.comm_top{position: relative;}
.comm_top .tit{margin-bottom: var(--fmb); font-size: var(--conTit); font-weight: 800;}
.comm_top .btit{font-size: var(--bTit);}
.comm_top .tit span.tt{display: block; color: var(--point_color); margin-bottom: 2rem; font-size: 1.8rem; font-weight: 600;}

.comm_top .txt{font-size: var(--conTxt);}


.common_info{ box-sizing:border-box;}

.common_info dl{ min-height:50px; position: relative;}
.common_info dl:before{ font-family: var(--icon); content:'\f1d0'; color: var(--main_color); position: absolute; right: 0px; top: 0px; font-size: 2.5rem; line-height: 100%;}
.common_info dt{font-weight:700; font-size:0.9em;  margin-bottom:10px; color: var(--main_color); }
.common_info dd.tit{font-size:1.1em; font-weight:600; word-break: break-all;}
.common_info dd{margin-bottom:5px; font-size: 0.95em;}
.common_info dd:last-child{margin-bottom:0;}

.common_info .info_box{padding:25px; border: 1px solid var(--border_color);
     margin-bottom: var(--mb); border-radius: var(--bdr);}
.common_info .info_box:first-child{ margin-top:0;}

.wrap_bg .common_info .info_box{
-webkit-backdrop-filter: saturate(180%) blur(15px);
    backdrop-filter: saturate(180%) blur(15px);
    /*background-color: rgba(255, 255, 255, 0.4); */
    margin-bottom: var(--mb); border-radius: var(--bdr); border: 0; color: #fff;}

.wrap_bg .common_info dt{color: var(--point_color);}
.wrap_bg .common_info dl:before{color: var(--point_color);}


.common_info dl.company01:before{content:'\f1d0';}
.common_info dl.company02:before{content:'\e614';}
.common_info dl.company03:before{content:'\eb3f';}
.common_info dl.company04:before{content:'\ef92';}

.common_info dl.group01:before{content:'\f5e2';}
.common_info dl.group02:before{content:'\e532';}
.common_info dl.group03:before{content:'\f049';}
.common_info dl.group04:before{content:'\e7e4';}

.common_info dl.rnd01:before{content:'\efe6';}
.common_info dl.rnd02:before{content:'\e8e5';}
.common_info dl.rnd03:before{content:'\eb04';}
.common_info dl.rnd04:before{content:'\ebcb';}


.comm_dl .box{display: block; position: relative; margin-bottom: 3rem;}
.comm_dl .photo{display: block; position: relative; overflow: hidden; border-radius: var(--bdr); margin-bottom: 2rem;}
.comm_dl .photo img{width: 100%;}
.comm_dl dl dt{font-size: var(--bigTxt); font-weight: 700; margin-bottom: 1.5rem;}
.comm_dl dl dd{padding-left:10px; position: relative; margin-bottom: 5px;}
.comm_dl dl dd:before{content: ''; display: block; background: var(--border_color); position: absolute; left: 0; top: 10px; width: 3px; height: 3px;}

@media all and (min-width:768px) {
.common_info{display:flex; flex-wrap:wrap; gap: 2%; }
.common_info .info_box{width:49%;  }
.common_info dd.tit{font-size:1.2em;}


.comm_dl {display: flex; flex-wrap: wrap; gap: 2%;}
.comm_dl .box{width: 49%;}

.comm_dl.list03 .box{width: 32%;}
}

@media all and (min-width:1024px) {
.common_info .info_box{width:23.5%; padding: 30px;}
.common_info dt{font-size:1em}
.common_info dl{background-size:60px !important; }

}

@media all and (min-width:1280px) {
.comm_dl .box{width: 23.5%;}

.comm_top .rndpoint{display: inline-block;}
}


.halfcon{position: relative;}
.halfcon .halfbox{position: relative; margin-bottom: var(--mb);}
.halfcon .halfbox:last-child{margin-bottom:0;}

@media all and (min-width:1024px) {
.halfcon .halfbox{display: flex; flex-wrap: wrap; gap: 4%;}
.halfcon .halfbox .leftbox{width: 26%;}
.halfcon .halfbox .rightbox{width: 70%;}
}

@media all and (min-width:1024px) {
.halfcon .halfbox{display: flex; flex-wrap: wrap; gap: 4%;}
.halfcon .halfbox .leftbox{width: 24%;}
.halfcon .halfbox .rightbox{width: 72%;}
}


/* 서브상단 */
.sub_top{height: 53rem; margin-bottom: 10rem; display:flex; align-items: center;}
.sub_top dl dt{font-size:5rem; line-height: 1.4; margin-bottom: 3rem; padding-bottom: 1rem; border-bottom: 1px solid #ccc; width: fit-content;}
.sub_top dl dt span{font-weight: bold;}
.sub_top dl dt p{font-weight: bold; color:var(--main_color); font-size:1.8rem}

.issuance_bg{background: url(../images/info/issuance_bg.jpg) no-repeat;}
.info_bg{background: url(../images/info/info_bg.jpg) no-repeat;}
.admission_bg{background: url(../images/info/admission_bg.jpg) no-repeat;}
.non_bg{background: url(../images/info/non_bg.jpg) no-repeat;}
.parking_bg{background: url(../images/info/parking_bg.jpg) no-repeat;}
.conventional_bg{background: url(../images/cancer/conventional_bg.jpg) no-repeat;}
.korean_bg{background: url(../images/cancer/korean_bg.jpg) no-repeat;}
.diet_bg{background: url(../images/cancer/diet_bg.jpg) no-repeat;}
.spine_bg{background: url(../images/clinic/spine_bg.jpg) no-repeat;}
.joint_bg{background: url(../images/clinic/joint_bg.jpg) no-repeat;}
.endoscopy_bg{background: url(../images/clinic/endoscopy_bg.jpg) no-repeat;}
.pain_bg{background: url(../images/clinic/pain_bg.jpg) no-repeat;}
.radiologycenter_bg{background: url(../images/clinic/radiology_bg.jpg) no-repeat;}



/* 병원소개 */
.about_bg{background: url(../images/about/about_bg.jpg) no-repeat center; height: 50.8rem; display: flex; align-items: center;}
.about_bg dl dt{font-weight: bold; font-size: 5rem; margin-bottom: 2rem;}



/* 연혁 */
.bg_con{padding:10rem 0; background: #fafafa;}
.history_con{display: flex; flex-wrap: wrap; position: relative; padding:5rem 0 0; justify-content:space-between; }
.history_con::before{content: ''; width: 1px; height: calc(100% - 10rem); background:#e6e6e6; position: absolute; top:0; left:0; }
.history_con:after{content:'HISTORY'; display: block; width: 100%; color:#f0f4fa; padding-top: 7rem; font-size: 8rem; font-weight: 800; line-height: 6rem; opacity: 0.3;}
.history_con dl{position: relative;  margin-top:5rem; width: 100%; padding-left: 4rem;}
.history_con dl:first-child{margin-top: 0;}

.history_con dl:before{content: ''; width: 2rem; height: 2rem; background: #fff; border:5px solid  var(--main_color); border-radius: 100%; position: absolute; top: 3.1rem; left:-.5rem; z-index: 1;}
.history_con dl:after{content: ''; width: 3rem; height:1px; background: var(--main_color); position: absolute; top:3.5rem; left: 0; }
.history_con dl dt{ font-weight: bold; font-size:3rem; color:var(--main_color); padding-top:1rem}
.history_con dl dd{padding-top:2rem; position:relative; word-break:break-all}
.history_con dl dd b,
.history_con dl dd span.txt{display:block;}
.history_number{font-weight: 900; font-size:8rem; color:#ccc}




@media all and (min-width:768px) {


.history_con::before{content: ''; top: 0; left: 50%; transform: translateX(-50%);}
.history_con:after{text-align: center; font-size: 10rem; line-height: 7rem;}
.history_con dl{ width:50%; margin-left: 50%; padding-left: 0;}
.history_con dl:before{ top:4.2rem;}
.history_con dl:after{ top:4.7rem; width: 4rem;}
.history_con dl:nth-child(odd){margin-left: 0; margin-right: 50%;}

.history_con dl:nth-child(odd){padding-right:2rem; text-align:right;  margin-top:5rem;}
.history_con dl:nth-child(odd):before{left:auto;  right:-1rem}
.history_con dl:nth-child(odd):after{left:auto; right: 0;}
.history_con dl:nth-child(even){padding-left:2rem}


.history_con dl dt{padding-top:2rem}
.history_con dl dd{padding-left:5rem;}
.history_con dl dd b{position:absolute; left:0;}
.history_con dl:nth-child(odd) dd b{left:auto; right:0;}
.history_con dl:nth-child(odd) dd{padding-left:0; padding-right:5rem}

.history_con dl:nth-child(odd){padding-right:7rem;}
.history_con dl:nth-child(even){padding-left:7rem}
}


@media all and (min-width:1280px) {

.history_con::before{ height: calc(100% - 20rem);}
.history_con:after{font-size: 20rem; line-height: 14rem; padding-top: 15rem;}
/*
.history_con dl{margin-top:20rem}*/

.history_con dl:before{ top:4.5rem;}
.history_con dl:after{ top:5.4rem; }


}
/* 둘러보기 */
.floor_warp{display:flex; justify-content: space-between;}
.floor_info{ overflow:hidden; width: calc(25% - 2rem); border:1px solid #ccc; border-radius: 1rem; margin-right:2rem}
.floor_photo{overflow:hidden; width: 75%; position:relative}
.floor_photo img{max-width:100%; width:100%}
.floor_photo svg{display: none;}
.photo{position:relative; margin-bottom: 2rem;}
.photo .swiper-button-next{background:none; background:url(../images/sub01/arrow_next.png) no-repeat; width: 50px; height: 50px;}
.photo .swiper-button-prev{background:none; background:url(../images/sub01/arrow_prev.png) no-repeat; width: 50px; height: 50px;}


/* 둘러보기 아코디언 */

.accordion {cursor: pointer;padding: 18px;width: 100%; background:none; border: none;text-align: left;outline: none;font-size: 15px;transition: 0.4s;  }
.active, .accordion:hover { }
.accordion:after {content: '\2212';color: #777;font-weight: bold;float: right;margin-left: 5px;}  
.active:after {content: "\002B";}
.panel{display:flex !important; overflow:hidden; padding:1.2rem 1rem; max-height: 0; transition: all 0.2s; border-bottom:1px solid #ccc; transition: all .5s;}
.panel_last{border:none}
.panel a{display:flex; width:100%}
.panel h2{font-weight:bold; color:var(--main_color); padding:0 1rem 0 0; width: 30%;}
.panel p{padding:.5rem 0 0;font-size: 1.6rem; color:#666; width: 70%;}

.panel:hover,
.panel.selected{background:var(--main_color) ;}
.panel.selected h2,
.panel.selected p,
.panel:hover h2,
.panel:hover p{color:#fff;}



/* 진료시간 */
.time_list{display: flex; gap:2rem; align-items: center; text-align: center;}
.time_list div{flex:1; border-radius: 2rem; padding:2rem; height: 15rem;}
.time_tit{background: var(--main_color); color:#fff; font-size:3rem}
.time_tit span{font-weight: bold; display: block;}
.time_con{background: #f0f4fa;}
.time_con ul li span{display: inline-block; width: 30%; font-weight: bold;}
.time_con ul li:last-child{background: var(--main_color); color:#fff; padding:0 1rem; margin: auto; width: 20rem;}
.time_tel{background: #f0f4fa;}
.time_tel span{font-size:5rem; color:var(--main_color); display: block;}
.time_tel p{font-weight: 900; font-size:3rem;}


/* 오시는길 */
.section_address{display: none;}
.map_box{display: flex; gap:3rem}
.map_box dl{flex:1; text-align: center; border-right:1px dashed #ccc}
.map_box dl:last-child{border:none}
.map_box dl dt{font-weight: bold; font-size:3rem}
.map_box dl dt span{display: block; color:var(--main_color); font-size:5rem}

.map_info{display: flex; gap:3rem; align-items: center; padding:1rem; border-bottom:2px dashed #ccc; margin-bottom: 3rem;}
.map_info p{display: flex; align-items: center; justify-content: center; width: 10rem; height: 10rem; background: var(--main_color); color:#fff; border-radius: 100px;}
.map_info p span{font-size:5rem}
.map_info dl{ width: calc(100% - 13rem);}
.map_info dl dt{font-weight: bold; font-size:2.4rem; color:var(--main_color)}



/* 의료진소개 */
.doc_list{display: flex; gap:3rem; flex-wrap: wrap; margin-right: -3rem;}
.doc{width: calc(25% - 3rem); border:1px solid #ccc; text-align: center; padding:3rem} 
.doc dl{margin-bottom: 2rem;}
.doc dl dt{font-weight: bold; color:var(--main_color)}
.doc dl dd{font-weight: bold; font-size:3rem}
.doc p{border-radius: 100%; background:#f0f4fa; overflow: hidden; margin-bottom: 2rem;}
.doc p img{transition: .5s;}
.doc p img:hover{transform: scale(1.2);}
.doc table{border-top:1px solid #ccc; border-right:1px solid #ccc; font-size:1.5rem; margin-bottom: 2rem;}
.doc table td{border-bottom: 1px solid #ccc; border-left:1px solid #ccc;}
.doc table th{background:#617599; color:#fff;}
.doc a{display: block; background: var(--main_color); color:#fff; padding:1rem 2rem}


/* 의료진 상세 */
.doc_bg{background: url(../images/medical/doc_bg.jpg) no-repeat center;}
.doc_bg .inner{display: flex; gap:10rem; justify-content: space-between;  position: relative; }
.doc_info{ width:50%; margin-top: 10rem;}
.doc_info dl{margin-bottom: 3rem;}
.doc_info dl dt{font-weight: bold; color:var(--main_color); font-size:3rem; border-bottom: 1px solid #333; width: fit-content;}
.doc_info dl dd{font-weight: bold; font-size:6rem; font-weight: 900;}
.doc_info dl dd span{font-weight: bold; font-size: 4rem;}
.doc_info table th{font-weight: bold; background: #617599; color:#fff;}
.doc_info table th,
.doc_info table td{border-bottom: 1px solid #ccc; text-align: center; padding:1rem}
.doc_photo{width: 50%; position: absolute; bottom: 0; right:0; text-align: right;}


/* 진료과 상세 */
.neurosurgery_bg{background: url(../images/medical/neurosurgery_bg.jpg) no-repeat;}
.orthopedics_bg{background: url(../images/medical/orthopedics_bg.jpg) no-repeat;}
.medicine_bg{background: url(../images/medical/medicine_bg.jpg) no-repeat;}
.radiology_bg{background: url(../images/medical/radiology_bg.jpg) no-repeat;}
.rehabilitation_bg{background: url(../images/medical/rehabilitation_bg.jpg) no-repeat;}
.health_bg{background: url(../images/medical/health_bg.jpg) no-repeat;}
.oriental_bg{background: url(../images/medical/oriental_bg.jpg) no-repeat;}
.family_bg{background: url(../images/medical/family_bg.jpg) no-repeat;}

.medical_info{position: relative; height:70rem; padding:10rem 0;}
.medical_info dl{margin-bottom: 3rem; width: 50%;}
.medical_info dl dt{font-weight: bold; font-size:4rem; margin-bottom: 1rem;}
.medical_info dl dt span{display: block; font-size:1.8rem; color:var(--main_color)}

.medical_txt{display: flex; align-items: center; background: #fafafa;}
.medical_txt p{width: 50%;}
.medical_txt dl{width: 50%; padding:5rem;}
.medical_txt dl dt{font-weight: bold; font-size:3rem; margin-bottom: 1rem;}
.medical_txt dl dt span{display: block; font-size:1.8rem; color:var(--main_color)}
.medical_txt:nth-child(odd){flex-direction: row-reverse;}

.health_list{display: flex; gap:3rem}
.health_list li{flex:1; text-align: center;}
.health_list li p{overflow: hidden; position: relative; border-radius: 2rem; margin-bottom: 2rem;}
.health_list li span{display: block; font-weight: bold; font-size:2.5rem}
.health_list li em{display: block; font-size:1.6rem}


/* 클리닉 센터 */
.clinic_wrap{display: flex; gap:2rem; flex-wrap: wrap;}
.clinic_list{width: calc(25% - 2rem); text-align: center;}
.clinic_wrap2 .clinic_list{width: calc(20% - 2rem); text-align: center;}
.clinic_list p{overflow: hidden; border-radius: 2rem; margin-bottom: 2rem;}
.clinic_list p img{transition: .5s;}
.clinic_list p img:hover{transform: scale(1.2);}
.clinic_list dl dt{font-weight: bold; font-size:2rem}
.clinic_list dl dd{font-size: 1.4rem; color:#666}

/* 외래진료안내 */
.table_info span{display: block; display: flex; align-items: center; justify-content: center; font-size:3rem; width: 5rem; height: 5rem; background: var(--main_color); color:#fff; border-radius: 100px; margin: auto; margin-bottom: 1rem;}

/* 입퇴원안내 */
.admission_list{display: flex; gap:2rem}
.admission_list p{width:10rem; height: 10rem; border:1px solid #ccc; border-radius: 2rem; display: flex; align-items: center; justify-content: center; }
.admission_list dl{width: calc(100% - 12rem);}
.admission_list dl dt{font-weight: bold; font-size:2.4rem}

/* 주차안내 */
.parking_list{display: flex; gap:10rem}
.parking{flex:1}
.parking dl{margin-bottom: 2rem;}
.parking dl dt{font-weight: bold; font-size:2.3rem}
.parking dl dd{color:#666}
.parking_tit{display: flex; gap:2rem}
.parking_tit span{display:inline-flex; justify-content: center; align-items: center; font-size:5rem; background: var(--main_color); color:#fff; width:7rem; height: 7rem; border-radius: 100px;}

/* 증명서발급안내 */
.video_list{display: flex; gap:3rem}
.video_list li{flex:1; text-align: center; position: relative;}
.video_list li::after{content: '→'; position: absolute; top: 5rem; right:-3rem; font-size:5rem; color:var(--main_color)}
.video_list li:last-of-type::after{display: none;}
.video_list li p{width: 15rem;  height: 15rem; border-radius: 15rem; background: var(--main_color); color:#fff; margin: auto; margin-bottom: 2rem; display: flex; align-items: center; justify-content: center; border:2rem solid #b0daf2}
.video_list li p span{font-size:5rem}
.video_list li dl dt{font-weight: bold; color:var(--main_color); font-size:2.4rem; margin-bottom: 1rem; margin: auto;}
.video_list li dl dt span{display:block;}

/* 암특화진료 */
.care_list{display: flex; gap:10rem; margin-bottom: 10rem;}
.care_list p{width: 40%; overflow: hidden;}
.care_list p img{border-radius: 2rem; }
.care_list dl{width: calc(60% - 10rem)}
.care_list dl dt{font-weight: bold; font-size:3rem; color:var(--main_color); margin-bottom: 3rem;}
.care_list dl dd span{display: block; font-weight: bold; font-size:2.2rem}

.box{background: #fafafa; border-radius: 2rem; border:1px solid #ccc; padding:2rem; margin-top: 2rem;}
.box ul{display: flex; flex-wrap: wrap; gap:1rem}
.box ul li{margin-bottom: 1rem; text-align: center; width: calc(50% - 1rem);}
.box ul li span{display: block; font-weight: bold;  }

.table_span{display: inline-block; background:#eb714f ; color:#fff; border-radius:2rem; padding:0 2rem; text-align: center; margin-right: 1rem;}
.cancer_table td p{font-weight: bold; color:var(--sub_color)}
.cancer_table td p span{display: block; font-weight: normal; font-size:1.4rem; color:#666}
.cancer_td{display: block; background: #fafafa;}
.cancer_table .point{font-size:1.4rem; color:#666}
.cancer_table .bold{font-size:1.8rem; color:var(--main_color)}

/* 맞춤식단 */
.diet_list{display: flex; gap:3rem}
.diet_list li{flex:1; text-align: center;}
.diet_list li p{overflow: hidden; border-radius: 2rem; margin-bottom: 2rem;}
.diet_list li dl dt{font-weight: bold; font-size:2.5rem; color:var(--main_color); margin-bottom: 1rem;}

.food_img{display: flex; flex-wrap: wrap; gap:3rem; margin-right:-3rem}
.food_img li{width: calc(25% - 3rem); overflow: hidden;}
.food_img li img{transition: .5s;}
.food_img li img:hover{transform: scale(1.2);}

.circle_list{display: flex; justify-content: center; gap:10rem}
.circle_list li{display: flex; flex-direction:column; align-items: center; justify-content: center; width:25rem; height: 25rem; border-radius: 25rem; background: var(--main_color); color:#fff; text-align: center;}
.circle_list li dl dt{font-weight: bold; opacity: 0.5;}
.circle_list li dl dd{font-size:2.5rem; font-weight: bold;}
.circle_list li dl dd img{display: block; margin: auto;}

.bigtext{font-size: 2.2rem;}
.why_list{text-align: center;}
.why_list dl{margin-bottom: 5rem;}
.why_list dl dt{font-weight: bold; font-size:4rem; margin-bottom: 2rem;}
.why_list dl dt span{display: block; opacity: 0.5; color:var(--main_color)}
.why_list dl dd{font-size:2.2rem; color:#666}

.food_process{background: url(../images/main/food_bg.jpg) no-repeat center; background-attachment: fixed; padding:10rem 0}
.food_process .inner{display: flex; flex-wrap: wrap; justify-content: center; gap:5rem}
.food_process dl{border:2px dashed var(--main_color); padding:1rem; width:calc(25% - 5rem); border-radius: 3rem; text-align: center; position: relative;}
.food_process dl::before{content: '▶'; color:var(--main_color); font-weight: bold; font-size:2rem; position: absolute; top: 5rem; right: -4rem;}
.food_process dl dt{background: var(--main_color); color:#fff; font-weight: bold; border-radius: 2rem; padding:2rem }
.food_process dl dd{font-weight: bold; color:var(--main_color); font-size:2.4rem; padding: 2rem;}
.food_process dl:last-child::before{display: none;}

.food_table{border: none;}
.food_table tr{display: flex; padding:1rem 0;}
.food_table td{margin: 1rem; font-size:2rem; border: none; background: #fff;width:80% }
.food_table td:first-child {background: var(--main_color); color:#fff; font-weight: bold; font-size:2.4rem; width:20%}


/* 온라인문의 */
.online_form{display: flex; gap:5rem}
.online_form h3{flex-basis: 30%;  font-size:1.6rem; font-weight: normal; padding:0 0 2rem 0}
.online_form h3 span{display: block; font-weight: bold; color:var(--main_color); font-size: 3rem;}
.online_form h3 p{position: relative;}

#board-wrap .list-type1 .list{border-top:2px solid var(--main_color);}
#board-wrap .list-type1 .list .board-tbody{}
#board-wrap .list-type1 .list .board-thead li{display:flex;width:100%;border-bottom:1px solid #ccc;background: #fafafa;}
#board-wrap .list-type1 .list .board-thead li .col{padding:20px 5px;font-size: 18px;font-weight: 600;letter-spacing: -0.45px;text-align: center;color: #202020;}
#board-wrap .list-type1 .list .board-thead li .col:nth-child(1){width:10%;}
#board-wrap .list-type1 .list .board-thead li .col:nth-child(2){width:60%;max-width:60%;}
#board-wrap .list-type1 .list .board-thead li .col:nth-child(3){width:10%;}
#board-wrap .list-type1 .list .board-thead li .col:nth-child(4){width:10%;}
#board-wrap .list-type1 .list .board-thead li .col:nth-child(5){width:10%;}
#board-wrap .list-type1 .list .board-tbody li{position:relative;display:flex;width:100%;border-bottom:1px solid #ccc;}
#board-wrap .list-type1 .list .board-tbody li .col{padding:20px 5px;font-size: 16px;font-weight: normal;letter-spacing: -0.4px;text-align: center;color: #202020;}
#board-wrap .list-type1 .list .board-tbody li .col .reply-count{display: inline-block;vertical-align: middle;position: relative;top:-8px;color: var(--main_color);font-weight: 600;}
#board-wrap .list-type1 .list .board-tbody li .col:nth-child(1){width:10%;font-size: 18px; font-weight: 500;letter-spacing: -0.45px;color: #202020;}
#board-wrap .list-type1 .list .board-tbody li .col:nth-child(2){width:60%;text-align: left;}
#board-wrap .list-type1 .list .board-tbody li .col:nth-child(3){width:10%;}
#board-wrap .list-type1 .list .board-tbody li .col:nth-child(4){width:10%;}
#board-wrap .list-type1 .list .board-tbody li .col:nth-child(5){width:10%;}
#board-wrap .list-type1 .list .board-tbody li.notice{background: #fafafa;}
#board-wrap .list-type1 .list .board-tbody li .col .icon-file{display: inline-block;vertical-align: middle;position: relative;top:-6px;}
#board-wrap .list-type1 .list .board-tbody li .col a{display: inline-block;  font-size: 18px;
 font-weight: 600;letter-spacing: -0.45px;text-align: left;color: #202020;overflow: hidden;
 white-space: nowrap;text-overflow: ellipsis;max-width: calc(100% - 50px);}
#board-wrap .list-type1 .list .board-tbody li .col.status span{display: inline-block;padding: 5px 15px;border-radius: 20px;}
#board-wrap .list-type1 .list .board-tbody li .col.status span.case1{background: var(--main_color);color: #fff;}
#board-wrap .list-type1 .list .board-tbody li .col.status span.case2{background: #f5f5f0;color: #202020;}
#board-wrap .list-type1 .button-group{display: flex;justify-content: flex-end;}
#board-wrap .list-type1 .button-group button{position: relative;display: inline-block;padding: 0 60px;line-height: 55px;border-radius: 27.5px;background-color: var(--main_color);font-size: 18px;font-weight: bold;letter-spacing: -0.36px;color: #fff;}






/* 라디오버튼 */
.radio_wrap {display: inline-block; position: relative; padding-left: 3rem; margin-right: 1rem; margin-bottom: 1.2rem; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.radio_wrap input {position: absolute; opacity: 0; cursor: pointer;}
.checkmark {position: absolute; top: 0;left: 0; height: 2rem; width: 2rem; background-color: #eee; border-radius: 50%;}
.radio_wrap:hover input ~ .checkmark {background-color: #ccc;}
.radio_wrap input:checked ~ .checkmark {background-color:var(--sub_color);}
.checkmark:after {content: ""; position: absolute; display: none; }
.radio_wrap input:checked ~ .checkmark:after { display: block;  }
.radio_wrap .checkmark:after { top: 50%; left: 50%; transform: translate(-50%, -50%);  width: 8px;  height: 8px; border-radius: 50%; background: white; }

.form_area{width: 70%;}
.online_form p{padding-top: 2rem;}
.online_form dl{display:flex; align-items: center; padding:3rem 0; border-bottom:1px dotted #ccc}
.online_form dl dt{width:20%; text-align: center;}
.online_form dl dd{width: 80%;}
.form_input{border: 1px solid #ccc; padding:1rem; width:100%; font-size:1.4rem}
.form_text{border: 1px solid #ccc; padding:2rem; width:100%; height: 30rem; overflow-y: auto;  font-size:1.4rem}
#btn_submit{background: var(--sub_color); color:#fff; padding:1rem 2rem}



/* 아코디언 */
.beefup {margin: 1em 0; border: 1px solid #ddd; border-radius: 4px; }
.beefup:hover {border-color: #ccc;}
.beefup:first-child {margin-top: 0;}
.beefup__head, .beefup__body {padding: 2rem;}
.beefup__head {cursor: pointer; position: relative; margin: 0; padding-right: 50px;}
.beefup__head span{display: inline-flex; justify-content: center; align-items: center; width: 5rem; height: 5rem; margin-right: 3rem; border-radius: 100%; background: var(--sub_color); color:#fff; font-family: var(--font-eng);}
button.beefup__head, .beefup__head > button { cursor: pointer; display: block; width: 100%; background: none; border: 0; font: inherit; text-align: inherit;}
button.beefup__head[aria-disabled], .beefup__head > button[aria-disabled] {cursor: default; outline: 0; }
.beefup__head > button{position: relative; z-index: 1; margin: -10px -50px -10px -20px; padding: inherit; width: calc(100% + 70px); background: inherit; border: inherit;}
.beefup__head::after {transition: transform 0.2s ease-out; content: ""; transform: translate(0, -50%) rotate(45deg); position: absolute; top: 50%; right: 20px; z-index: 0; margin-top: -2px; padding: 3px; border-width: 0 2px 2px 0; border-style: solid; color: #ccc;}
.beefup.is-open > .beefup__head::after {transform: translate(0, -50%) rotate(225deg); margin-top: 2px;}
.mockup{background: #fafafa; padding:2rem}