@import url('sub.css');
/* 협회소개 */
.about_page_cont .purpose .purpose_flex {grid-gap:2px}

/* 협회장 인사말 */
.greeting_cont {display:flex; gap:75px; align-items:flex-start; margin-bottom:95px; overflow:hidden}
.greeting_cont .img100 {width:40%; max-width:475px; position:relative; flex-shrink:0}
.greeting_cont .img100::after {content:""; width:205px; aspect-ratio:205/280; background:url('/about/img/greeting_deco.png') center / cover no-repeat; position:Absolute; top:50%; right:-75px; transform:translateY(-50%)}
.greeting_cont .tbox .ceo p:first-child {margin-bottom:2px}

/* 조직구성 및 임원소개 */
.organ_cont .item {display:flex; flex-direction:column;}
.organ_cont .item dt {padding:20px; border-radius: 10px 10px 0 0; background: #576378;}
.organ_cont .item dd {padding: 5px 30px; border-radius: 0 0 10px 10px; border: 1px solid #576378; flex:1}
.organ_cont .item dd p {padding: 16px 0; border-bottom: 1px dashed var(--border);}
.organ_cont .item dd p:last-child {border-bottom:0}

.organ_cont .item.checked_item dt {background:var(--main);}
.organ_cont .item.checked_item dd {border-color:var(--main)}
.organ_cont .item.checked_item dd p {font-weight:800}

/* 오시는 길 */
.root_daum_roughmap.root_daum_roughmap_landing {width:100% !important; height:100% !important;}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_map{height: 100% !important;}
.root_daum_roughmap.root_daum_roughmap_landing .map_border{display:none !important;}
.root_daum_roughmap.root_daum_roughmap_landing .cont{display:none !important;}
.root_daum_roughmap.root_daum_roughmap_landing .wrap_controllers{display:none !important;}

.location_cont .mapbox {height:540px; border:1px solid var(--border); box-sizing:border-box}

.location_cont .map_info {display:flex; flex-wrap:wrap; gap:15px; justify-content:space-between; align-items:flex-start}
.location_cont .map_info .addr {position:relative; padding-left:31px}
.location_cont .map_info .addr::before {content:"\e0c8"; position:Absolute; top:3px; left:0; font-size:26px}
.location_cont .map_info .map_info_dl {display:flex; flex-wrap:wrap; gap:5px 30px;}
.location_cont .map_info .map_info_dl dl {display:flex; gap:8px}

.location_cont .map_info .link_list {display:flex; gap:4px; flex-shrink:0}
.location_cont .map_info .link_list a {width: 176px; aspect-ratio:176/58; display:flex; align-items:center; gap:7px; justify-content:center; border:1px solid transparent}
.location_cont .map_info .link_list a i {Display:flex}
.location_cont .map_info .link_list a svg path {transition:all 0.7s cubic-bezier(0.215,0.61,0.355,1)}
.location_cont .map_info .link_list a.naver {background: #10D265;}
.location_cont .map_info .link_list a.kakao {color:#371C1D; background:#FEDD0D}

.location_cont .map_info .link_list a.naver:hover {background:var(--white); color:#10D265 !important; border-color:#10D265}
.location_cont .map_info .link_list a.kakao:hover {background:#371C1D; color:#FEDD0D}
.location_cont .map_info .link_list a.naver:hover svg path {fill:#10D265}
.location_cont .map_info .link_list a.kakao:hover svg path {fill:#FEDD0D}



/*******************************************************************************
    @media 1500px
*******************************************************************************/
@media all and (max-width:1500px){
.about_page_cont br {display:none}
.greeting_cont br {display:none}
}


/*******************************************************************************
    @media 1350px
*******************************************************************************/
@media all and (max-width:1300px){
/* 협회소개 */

/* 협회장 인사말 */
.greeting_cont {gap:40px}
.greeting_cont .img100::after {width:150px; right:-45px}

/* 조직구성 및 임원소개 */
.organ_cont {grid-gap:15px}
.organ_cont .item dt {padding:15px 10px}
.organ_cont .item dd p {padding:10px 0}


/* 오시는 길 */
.location_cont .map_info .map_info_dl {gap:5px 20px}
.location_cont .map_info .link_list a {width:150px}
.location_cont .map_info .link_list a svg {width:18px; height:auto}
}

/*******************************************************************************
    @media  ~980px               
*******************************************************************************/
@media all and (max-width:980px){
/* 협회소개 */

/* 협회장 인사말 */
.greeting_cont {margin-bottom:70px}
.greeting_cont .img100::after {width:110px;}

/* 조직구성 및 임원소개 */
.organ_cont {grid-gap:10px}
.organ_cont .item dt {border-radius:5px 5px 0 0; padding:10px; font-size:0.95rem}
.organ_cont .item dd {border-radius:0 0 5px 5px; padding:2px 15px}
.organ_cont .item dd p {padding:8px 0; font-size:0.9rem}


/* 오시는 길 */
.location_cont .mapbox {height:380px}

.location_cont .map_info .addr {padding-left:26px}
.location_cont .map_info .addr::before {font-size:22px; top:2px}
.location_cont .map_info .link_list {width:100%;}
.location_cont .map_info .link_list a {width:100%; aspect-ratio:unset; height:50px}
}
/*******************************************************************************
    @media 768px
*******************************************************************************/
@media all and (max-width:768px){
/* 협회장 인사말 */
.greeting_cont {display:block}
.greeting_cont .img100 {width:100%; margin:0 auto}
.greeting_cont .img100::after {width:200px; top:auto; transform:none; bottom:-90px; right:-100px}
.greeting_cont .tbox {padding-top:40px}
.greeting_cont .tbox .ceo p:first-child {margin-bottom:0}

}

/*******************************************************************************
    @media 481~680px
*******************************************************************************/
@media all and (max-width:680px){
/* 협회소개 */
.about_page_cont .marb25 {margin-bottom:15px}
.about_page_cont .purpose .purpose_flex {display:block}
.about_page_cont .purpose .purpose_flex .img100:first-child {margin-bottom:5px}

/* 협회장 인사말 */
.greeting_cont {margin-bottom:50px}
.greeting_cont .img100::after {width:40%; bottom:-13%; right:-8%}

/* 조직구성 및 임원소개 */
.organ_cont {grid-template-columns:repeat(2,1fr)}


/* 오시는 길 */
.location_cont .mapbox {height:260px}
.location_cont .map_info .map_info_dl {gap:3px 12px}
.location_cont .map_info .link_list a {height:43px}
.location_cont .map_info .link_list a svg {width:16px}
}
/*******************************************************************************
    @media ~480px               
*******************************************************************************/
@media all and (max-width:480px){

}
/*******************************************************************************
    @media ~360px
*******************************************************************************/
@media all and (max-width:360px){

}