@charset "utf-8";

.sub_content_area {padding-bottom:50px;}
/* 테스크탑 */
@media all and (max-width:1200px){
}

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

/* 서브 메뉴 */
.navi_submenu_box {margin-top:0; margin-bottom:20px; background:#fff; transition:all 0.5s ease-out;}
.navi_submenu_box .base_width {padding:160px 0 50px; }
.navi_submenu_box.fixed .base_width {padding:140px 0 0;}

.navi_submenu {text-align: center;}
.navi_submenu::after {display:block; content: ''; clear:both; }
.navi_submenu .submenu {display:inline-block; position:relative;}
.navi_submenu .submenu>a {padding:0 30px; height:60px; line-height:60px; color:#999; font-size:30px; font-weight:600; background-color:rgba(19,70,140,0);}
.navi_submenu .submenu>a:hover,
.navi_submenu .submenu>a.active {color:#871d2d; font-weight:600; transition:all 0.5s ease-out;}

@media all and (max-width:1300px){
    .navi_submenu_box {}
}

/* 테스크탑 */
@media all and (max-width:1024px){    
    .navi_submenu_box .base_width {display:block; overflow:hidden;}    
    .navi_submenu .submenu>a {padding:0 20px; font-size:26px;}
}
/* 테블릿*/
@media all and (max-width:768px){
      .navi_submenu_box .base_width {padding:50px 0 0;}
      .navi_submenu .submenu>a {padding:0 15px; height:40px; line-height:40px; font-size:20px;}
      
}
/* 모바일*/
@media all and (max-width:640px){      
      .navi_submenu_box .base_width {padding:50px 0 0;}
      .navi_submenu_box.fixed .base_width {padding:100px 0 0;}
      .navi_submenu .submenu>a {padding:0 5px; height:40px; line-height:40px; font-size:16px;}
}
@media all and (max-width:480px){   
            
}

.sub_header {margin-bottom:60px; padding:0 15px;}
.sub_header .page_introduce {padding-top:25px; font-size:24px; text-align:center; position:relative; /*font-family:korea_m,serif; font-weight:normal; word-break:break-all;*/
word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;}
.sub_header .page_introduce::before {display:block; content: ''; position:absolute; top:0; left:calc(50% - 25px); width:50px; height:10px; background-color:#871d2d; border-radius:10px;}

.sub_outline {padding:30px 0 50px; color:#333; font-size:18px;}

.sub_outline h3 {
      word-break:keep-all;
      white-space:-moz-pre-wrap;
      white-space:-pre-wrap;
      white-space:-o-pre-wrap;
      word-wrap:break-word;}

h3.sub_title {margin-bottom:10px; padding-left:10px; font-size:24px; color:#333; font-weight:600; position:relative;}
h3.sub_title::before {display:block; content: ''; position:absolute; top:0; left:0; width:8px; height:8px; background-color:#871d2d; border-radius:10px;}

/* 테스크탑 */
@media all and (max-width:1200px){      
      .sub_outline {padding:30px 20px 50px;}      
}

@media all and (max-width:1024px){
      .sub_header .page_introduce {padding-top:25px; font-size:20px;}
}
@media all and (max-width:768px){
      .sub_header {margin-bottom:30px;}
      .sub_header .page_introduce {padding-top:20px; font-size:18px;}

      h3.sub_title {font-size:20px;}
      h3.sub_title::before {display:block; content: ''; position:absolute; top:0; left:0; width:5px; height:5px;}
      
}
/* 모바일*/
@media all and (max-width:640px){
      .sub_header {margin-bottom:0;}
      .sub_header .page_introduce {padding-top:15px; font-size:14px;}
      .sub_header .page_introduce::before {display:block; content: ''; position:absolute; top:0; left:calc(50% - 15px); width:30px; height:6px;}

      .sub_outline {font-size:16px;}
      h3.sub_title {font-size:18px;}
}
@media all and (max-width:480px){
      
}


/* 일반회원가입 */
.membership_box_normal {}

.normal_type_input {margin:0 auto; width:400px;}
.normal_type_input h3 {margin-bottom:20px; font-size:24px; border-bottom:solid 1px #ccc;}
.normal_type_input input.email_input {margin-bottom:10px; width:300px; height:40px; line-height:40px; border-radius:3px; box-sizing:border-box;}
.normal_type_input button {background-color:#7894c7;}
.normal_type_input a {text-decoration:underline; color:#ff0000;}

.normal_type_policy_check h3 {margin-bottom:10px; font-size:24px;}

.policy_check {padding:10px 0;}
.policy_check .check_act {margin-bottom:5px;}
.policy_check .check_act input[type="checkbox"] {width:15px; height:15px;}
.policy_check .policy_txt {height:300px; border:solid 1px #ccc;}
.policy_check .policy_txt iframe {width:100%; height:300px; border:none;}

/* 약관페이지 스타일 */
.policy_page {padding:10px; background-color:#fff;}
.policy_page .policy_title {display:inline-block; padding:0 15px; font-size:14px; color:#fff; background-color:#aaa; border-radius:30px;}
.policy_page .policy_page_txt {margin-bottom:30px;}

.policy_page ul {}
.policy_page ul li {padding-left:15px; text-indent: -13px;}

/* 테스크탑 */
@media all and (max-width:1200px){
}
/* 테블릿*/
@media all and (max-width:768px){
      .normal_type_input {margin:0 auto; width:100%;}
      .normal_type_input button {padding:0; width:100%; height:40px; color:#fff; font-size:16px; border-radius:3px; line-height:40px; overflow:hidden;}
      .normal_type_input input.email_input {width:100%;}
}
/* 모바일*/
@media all and (max-width:320px){
}


/* 회원정보입력 */
table.member_board {width:100%; font-size:16px; margin-bottom:20px; border-top:solid 1px #000000;}
table.member_board thead {border-bottom:solid 1px #cccccc;}
table.member_board th {padding:10px 15px; color:#333333; border-right:solid 1px #eaeaea; background-color:#f8f8f8; border-bottom:solid 1px #e8e8e8;}
table.member_board td {padding:10px 10px; line-height:20px; border-right:solid 1px #eaeaea; border-bottom:solid 1px #e8e8e8;}
table.member_board .end {border-right:none;}
table.member_board td a {}
table.member_board input[type="text"], table.member_board input[type="password"], select {height:32px; border-radius:5px;}
.profile_photo {width:100px; height:100px; background-repeat:no-repeat; background-size:cover;}

.btn_table_inner_gray {display:inline-block; vertical-align:middle; padding:0 7px; height:28px; line-height:28px; color:#fff !important; background-color:#666;
      -webkit-border-radius:4px; -moz-border-radius:4px; -o-border-radius:4px; border-radius:4px;}
.btn_table_inner_gray:hover {opacity:0.8;}

/* 테블릿*/
@media all and (max-width:768px){
      table.member_board {font-size:14px;}
      table.member_board tr {display:block; padding:10px 0; border-bottom:solid 1px #e8e8e8;}
      table.member_board th {display:block; padding:0 10px 5px; text-align:left; color:#000; font-weight:600; border-right:none; background-color:transparent; border-bottom:none;}
      table.member_board td {display:block; padding:0 10px; line-height:1.2; border-right:none; border-bottom:none;} 
}
/*///////////////////////////////////////////////////////////////////////////////////////////////
 아이디/비밀번호찾기
 ///////////////////////////////////////////////////////////////////////////////////////////////*/
.idpw_find_box {margin:0 auto 30px; width:350px; text-align:center; border-radius:10px; box-sizing: border-box;}
.idpw_find_box input {margin:5px 0; width:100%; height:40px; border-radius:7px; box-sizing: border-box;}
.idpw_find_box .func {padding-top:30px;}
.idpw_find_box .func button {width:100%; height:40px; border-radius:7px;}

/* 테스크탑 */
@media all and (max-width:1200px){
}
/* 테블릿*/
@media all and (max-width:768px){

}
/* 모바일*/
@media all and (max-width:480px){
      .idpw_find_box .func {padding-top:10px;}
      .idpw_find_box {margin:0 auto 30px; width:80%;}
}



/*////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
공통 element
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/* table_list_basic *************************/
table.table_list_basic {width:100%; font-size:18px; border-top:solid 2px #666; background-color:#fff;}
table.table_list_basic thead {border-bottom:solid 1px #ccc; line-height:1.2;}
table.table_list_basic th {padding:10px; color:#333333; text-align:center; border-right:solid 1px #ddd; border-bottom:solid 1px #ccc; background-color:#fff; }
table.table_list_basic td {padding:10px; text-align:center; border-right:solid 1px #ddd; border-bottom:solid 1px #ccc; vertical-align:middle;}
table.table_list_basic th:last-child {border-right:none;}
table.table_list_basic td:last-child {border-right:none;}

table.table_list_basic textarea {padding:5px 5px; width:95%; height:50px; line-height:19px; background-color:#fff; border:solid 1px #d5d5d5;}
table.table_list_basic select {border:1px solid #cccccc; height:28px; line-height:28px;}
table.table_list_basic td input[type="text"] {margin:3px 0; width:94%; color:#b1b1b1;}
table.table_list_basic td input[type="text"].d_day {width:90px;}
table.table_list_basic td input[type="text"].text {width:150px;}
table.table_list_basic td a {display:inline-block; margin:1px 0;} 

table.table_list_basic tfoot {}
table.table_list_basic tfoot th {padding:3px; background-color:#ebf2f9;}
table.table_list_basic tfoot td {padding:3px; background-color:#ebf2f9;}

.board_option_box {padding:5px; background-color:#f2f2f2;}
.board_option_box input, .board_option_box .btn {margin:2px 0;}


/* 테스크탑 */
@media all and (max-width:1024px){
      table.table_list_basic {font-size:16px;}
}
/* 테블릿*/
@media all and (max-width:768px){
      table.table_list_basic {font-size:14px;}
}
/* 모바일*/
@media all and (max-width:640px){
}

/* table_view_basic *************************/
table.table_view_basic {width:100%; margin-bottom:20px; font-size:16px; border-top:solid 2px #666; background-color:#fff;}
table.table_view_basic thead th {text-align:center;}
table.table_view_basic th {padding:11px 0; color:#333333; text-align:center; border-right:solid 1px #ddd;  border-bottom:solid 1px #ccc; background-color:#f2f2f2; }
table.table_view_basic td {line-height:20px; padding:10px 7px; border-right:solid 1px #ddd; border-bottom:solid 1px #ccc;}
table.table_view_basic .end  {border-right:none;}
table.table_view_basic .subject {display:block; font-weight:700; color:#333;}
table.table_view_basic td input[type="text"],
table.table_view_basic td input[type="password"],
table.table_view_basic td input[type="date"] {padding:5px 7px; width:97%; height:36px; color:#333; border-radius:7px; box-sizing:border-box;}
table.table_view_basic td input.d_day {width:90px; height:36px;}
table.table_view_basic td input.av {width:35px;}
table.table_view_basic td input.search {width:60%;}
table.table_view_basic td input.text {width:200px;}
table.table_view_basic td input.snsid {width:120px;}
table.table_view_basic td input.h5 {height:250px;}
table.table_view_basic select {border:1px solid #cccccc; height:28px; line-height:28px;}
table.table_view_basic textarea {padding:5px 7px; width:97%; background-color:#fff; border:solid 1px #d5d5d5; border-radius:7px; box-sizing:border-box;}
table.table_view_basic.tl {border-top:1px solid #000;}
table.table_view_basic.bm {margin-bottom:0px;}
table.table_view_basic.tm {border-top:none;}
@media all and (max-width:768px){	
	table.table_view_basic {font-size:14px;}
}


/* view_list *************************/
table.view_list 				{width:100%; font-size:14px; margin-bottom:20px; border:solid 1px #eaeaea; background-color:#fff;}
table.view_list th 				{padding:5px 0; color:#333333; background-color:#f8f8f8; padding:10px 0;}
table.view_list td 				{font-size:13px; line-height:24px; padding:10px 7px;}
table.view_list.bm				{margin-bottom:0px;}


/* 일반 데이터용 table /////////////////////////////////*/
table.table_data_view {width:100%;}
table.table_data_view tbody {}
table.table_data_view tbody th {padding:10px 10px 10px 20px; text-align:left; border:solid 1px #ececec; background-color:#f5f5f5;}
table.table_data_view tbody td {padding:10px 20px; border:solid 1px #ececec; background-color:#fff;}

@media all and (max-width:768px){	
	table.table_data_view {padding:10px 0; border-top:solid 1px #dc943a;}
	table.table_data_view tbody th {display:block; padding:10px 5px 5px 23px; font-size:14px; font-weight:600; color:#666; border:none; background-color:#ffffff; position:relative;}
      table.table_data_view tbody th::after {display:block; content:''; width:5px; height:2px; background-color:#262626; position:absolute; top:20px; left:13px;}
	table.table_data_view tbody td {display:block; padding:5px 15px 5px; border:none; border-bottom:solid 1px #ddd;}
	table.table_data_view tbody td input[type="text"] {margin-bottom:5px;}
	table.table_data_view tbody td label {display:inline-block;}
}


/*파일업로드*/
.filebox label, .filebox .upload_name {border-radius:4px; height:34px; line-height:34px; background:#262626;  border:1px solid #000; border-width:1px 1px 2px 1px;   box-sizing:border-box; font-size:1em; color:#fff; vertical-align: middle;  cursor: pointer; padding:0 1em;}
.filebox{ display:inline-block;}
.filebox input[type="file"] { position: absolute;  width: 1px;  height: 1px;  padding: 0;  margin: -1px;  overflow: hidden;  clip:rect(0,0,0,0);  border: 0;}
.filebox label {display: inline-block;}

/* named upload */
.filebox .upload_name{ display: inline-block; /*width:400px;*/ padding:0 0.5em;  font-size: inherit; font-family: inherit;vertical-align: middle; background-color: #fff; color:#333; border:none; box-sizing:border-box; cursor:inherit;}

/*첨부파일 리스트 */
.file_list {text-decoration:underline;}
.btn_file_preview {display:inline-block; padding:1px 10px 1px 8px; font-size:12px; color:#333; background-color:#fff; border:solid 1px #999; border-radius:30px;}
.btn_file_preview:hover {background-color:#f2f2f2;}
.btn_file_preview i {font-size:14px; vertical-align:middle;}


/*//////////////////////////////////////////////////////////////////////
 공지사항 게시판
//////////////////////////////////////////////////////////////////////*/
/* 목록 //////////////////////////////////*/
.search_notice {}
.search_notice input {padding:0 15px; width:200px; height:36px; border:solid 1px #333; border-radius:50px;}
.search_notice button {}

ul.notice_list {border-top:solid 2px #666;}
ul.notice_list li {border-bottom:solid 1px #ccc;}
ul.notice_list li.label_top {}
ul.notice_list li.label_top .outline .num span {display:inline-block; padding:2px 10px; color:#871d2d; font-size:16px; border:solid 1px #871d2d; border-radius:50px;}

ul.notice_list li .outline {display:flex; padding:20px 10px; align-items:center;}
ul.notice_list li .outline .num {flex-shrink:0; flex-basis:130px; text-align:center;}
ul.notice_list li .outline .cont {}
ul.notice_list li .outline .cont a.title {font-size:24px; font-weight:600;}
ul.notice_list li .outline .cont a.title:hover {color:#871d2d;}
ul.notice_list li .outline .cont .info {color:#666; font-size:16px;}

span.label_new {display:inline-block; margin-right:5px; padding:0 7px; height:20px; line-height:20px; color:#fff; font-size:14px; background-color:#871d2d; border-radius:50px; vertical-align:middle;}

/* 테스크탑 */
@media all and (max-width:1024px){
      ul.notice_list li .outline {padding:15px 10px;}
      ul.notice_list li .outline .cont a.title {font-size:20px;}
}
/* 테블릿*/
@media all and (max-width:768px){
      ul.notice_list li .outline .num {flex-basis:100px;}
      ul.notice_list li.label_top .outline .num span {padding:0 7px; font-size:12px;}
      span.label_new {padding:0 5px; height:18px; line-height:18px;font-size:12px;}

      ul.notice_list li .outline {padding:15px 10px;}
      ul.notice_list li .outline .cont a.title {font-size:18px;}
}
/* 모바일*/
@media all and (max-width:640px){
      ul.notice_list li .outline .num {flex-basis:70px; font-size:14px;}
      ul.notice_list li .outline {padding:10px 5px;}
      ul.notice_list li .outline .cont a.title {font-size:16px;}
      ul.notice_list li .outline .cont .info {font-size:14px;}
}

/* 상세보기 //////////////////////////////////*/
.notice_view {border-top:solid 1px #999; border-bottom:solid 1px #ccc;}
.notice_view .board_top {padding:15px;}
.notice_view .board_top strong.title {display:block; line-height:1.2; font-size:24px; font-weight:600;}
.notice_view .board_info {display:flex; justify-content: space-between; padding:0 15px 10px; color:#666; font-size:16px;}
.notice_view .board_info .date {}
.notice_view .board_info .writer {}
.notice_view .board_content {padding:15px; color:#666; border-top:solid 1px #ddd;}
.notice_view .file_inner {padding:15px;}
.notice_view .file_inner ul {display:flex; gap:15px;}
.notice_view .file_inner ul li {}
.notice_view .file_inner ul li a {}
.notice_view .file_inner ul li a:hover {color:#871d2d;}

/* 게시판 상하단 버튼 영역 */
.table_btn_func {padding:10px 0;}
.table_btn_func .grid1 {}
.table_btn_func .grid2 {display:flex; justify-content:space-between;}

/* 테블릿*/
 @media all and (max-width:768px){
      .notice_view .board_top strong.title {font-size:16px;}
      .notice_view .board_info {font-size:12px;}
 }
 /* 모바일*/
 @media all and (max-width:640px){
 }


/* paging ********************************/
.paging {clear:both; text-align:center; margin-top:20px;}
.paging a {display:inline-block; padding:0 13px; height:34px; line-height:34px; font-size:20px; vertical-align:middle;}
.paging a:hover {color:#871d2d;}
.paging a.active {display:inline-block; color:#fff; background-color:#871d2d; border-radius:30px; transition:all 0.3s ease-in-ou t;}
.paging .prev {font-size:26px;}
.paging .prev:hover {}
.paging .next {font-size:26px;}
.paging .next:hover {}

/* 테스크탑 */
@media all and (max-width:1200px){
}
/* 테블릿*/
@media all and (max-width:768px){
}
/* 모바일*/
@media all and (max-width:480px){
      .paging a {font-size:16px;}
}


/*//////////////////////////////////////////////////////////////////////
 button style 
//////////////////////////////////////////////////////////////////////*/
.btn {display:inline-block; padding:0 7px; color:#333; font-weight:600; background-color:#fff; border:solid 1px #333; border-radius:5px; vertical-align:middle;}
.btn:hover {opacity:0.9;}


/* 버튼 폰트 사이즈 */
.btn_xs {font-size:12px; padding:0 5px; height:18px;}
.btn_sm {font-size:13px; padding:0 10px; height:26px;}
.btn_md {font-size:14px; padding:0 8px; height:32px;}
.btn_mx {font-size:15px; padding:0 10px; height:36px;}
.btn_lg {font-size:20px; padding:0 25px; height:46px;}

/* 버튼 배경 색상 */
.btn_bg_primary {color:#fff; background-color:#871d2d; border:solid 1px #871d2d;} /* 대학의 UI 칼라 설정 */
.btn_bg_white {color:#333; background-color:#fff; border:solid 1px #333;}
.btn_bg_white:hover {color:#333; background-color:#f2f2f2;}
.btn_bg_gray {color:#fff; background-color:#666; border:solid 1px #666;}
.btn_bg_dark {color:#fff; background-color:#333; border:solid 1px #333;}
.btn_bg_blue {color:#fff; background-color:#3478ca; border:solid 1px #3478ca;}
.btn_bg_red {color:#fff; background-color:#ce1d4c; border:solid 1px #ce1d4c;}
.btn_bg_orange {color:#fff; background-color:#ec6407; border:solid 1px #ec6407;}
.btn_bg_green {color:#fff; background-color:#2dc174; border:solid 1px #2dc174;}

/*/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
 소개 
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
 /*회장인사 ////////////////////////////////////////////////////////////////////////////////*/
.greeting_grid {word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
 
.greeting_grid .row_img_left,
.greeting_grid .row_img_right {display:flex; flex-direction:row; align-items:center; justify-content:center; padding:20px 0;}
.greeting_grid .img {width:60%; height:275px; background-repeat:no-repeat; background-size:cover; background-position:center; background-color:#871d2d; border-radius:15px;}
.greeting_grid .txt {flex:1; padding:10px 20px; 
      word-break:keep-all;
      white-space:-moz-pre-wrap;
      white-space:-pre-wrap;
      white-space:-o-pre-wrap;
      word-wrap:break-word;}


@media screen and (max-width:1024px) {
 .greeting_grid .img {height:230px;}
}

@media screen and (max-width:768px) {
 .greeting_grid .img {height:200px;}
}
@media screen and (max-width:640px) {
      .greeting_grid .row_img_left {flex-direction:column;}
      .greeting_grid .row_img_right {flex-direction:column-reverse;}
      .greeting_grid .img {width:100%; height:200px;}
      .greeting_grid .txt {padding:10px 0;}      
}

/* 조직도 ////////////////////////////////////////////////////////////////////////////////*/


/* 역대회장 ////////////////////////////////////////////////////////////////////////////////*/
.president_list {}
.president_list ul {margin:0 -20px;}
.president_list ul:after {display:block; content: ''; clear:both; }
.president_list ul li {float:left; width:33.33%;}
.president_list ul li .outline {display:flex; margin:0 20px; align-items:center; padding:10px; box-sizing:border-box; position:relative; margin-bottom:20px; border-radius:10px; background-color:#fff; border:solid 1px #ccc; border-radius:5px; transition:all 0.3s ease-in-out;}
.president_list ul li .outline .photo {}
.president_list ul li .outline .info {padding-left:10px;}
.president_list ul li .outline .info .position {display:block; margin-bottom:5px; line-height:1; font-size:15px; font-weight:600;}
.president_list ul li .outline .info .name {display:block; font-size:16px; line-height:1.2; font-weight:600; height:55px;}
.president_list ul li .outline .info .term {display:block; font-size:14px; line-height:1.2; color:#999; font-weight:600;}

@media screen and (max-width:1024px) {
      .president_list ul {margin:0 -10px;}
      .president_list ul li {width:50%;}
      .president_list ul li .outline {margin:0 10px; margin-bottom:20px;}
}
@media screen and (max-width:768px) {
      .president_list ul {margin:0 -5px;}
      .president_list ul li .outline {margin:0 5px; margin-bottom:10px;}  
}
@media screen and (max-width:640px) {
      .president_list ul li {width:100%;}
}


/* 갤러리 ////////////////////////////////////////////////////////////////////////////////*/
.tabmenu_gellery {margin-bottom:30px; text-align:center;}
.tabmenu_gellery ul {display:inline-block; padding:5px; border:solid 1px #ccc; background-color:#fff; border-radius:50px;}
.tabmenu_gellery ul li {display:inline-block;}
.tabmenu_gellery ul li a {display:block; padding:0 30px; border-radius:50px; font-size:22px; font-weight:600; height:46px; line-height:46px; position:relative;}
.tabmenu_gellery ul li a:hover {color:#871d2d;}
.tabmenu_gellery ul li a.active {color:#fff; background-color:#871d2d;}
.tabmenu_gellery ul li a.active::after {display:block; content:url('../images/sub/gellery/icon_camera.png'); border-radius:50px; opacity:0.1; transform: rotate(-45deg); transition:all 0.3s ease-in-out;
position:absolute; top:0; right:0;}

@media screen and (max-width:768px) {
      .tabmenu_gellery ul li a {padding:0 20px; font-size:18px; height:36px; line-height:36px;} 
}
@media screen and (max-width:640px) {      
      .tabmenu_gellery ul li a {padding:0 10px; font-size:14px;}
}
@media screen and (max-width:480px) {      
      .tabmenu_gellery {margin-bottom:15px;}
      .tabmenu_gellery ul {padding:0; border:none;}
      .tabmenu_gellery ul li a {padding:0 10px; font-size:14px;}
}

.gallery {}
.gallery ul {margin:0 -5px;}
.gallery ul:after {display:block; content: ''; clear:both; }
.gallery ul li {float:left; margin-bottom:20px; width:25%;}
.gallery ul li a {display:block; margin:0 10px; margin-bottom:10px; overflow:hidden; position:relative;}
.gallery ul li a .imgbox {width:100%; height:190px; background-repeat:no-repeat; background-size:cover; background-position:center;}
.gallery ul li a .hover_box {display:table; width:100%; height:190px; background-color: rgba(135,29,45,0.9); position:absolute; top:100px; left:0; z-index:1; transition:all 0.3s ease-out; opacity:0; border-radius:200px;}
.gallery ul li a .hover_box .outline {display:table-cell; vertical-align:middle; text-align:center; color:#fff; font-size:16px; font-weight:600; padding:0 10px; box-sizing:border-box;}
.gallery ul li a .hover_box .outline .icon {display:inline-block; width:56px; height:56px; line-height:56px; border-radius:56px; background-color:#871d2d;
background-image: linear-gradient(to top, #3a080f, #871d2d);}

.gallery ul li .info {padding:5px 10px; height:60px;}
.gallery ul li .info .title {margin-bottom:5px; font-size:18px; font-weight:600; line-height:1.2;
      max-height:40px; 
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
      text-overflow:ellipsis}
.gallery ul li .info .date {font-size:14px;}

.gallery ul li a .hover_box .outline .icon i {font-size:30px; font-weight:normal;}
.gallery ul li a:hover .hover_box {opacity:1; top:0; border-radius:0;}

@media screen and (max-width:1024px) {
      .gallery ul li {width:33.33%;} 
}
@media screen and (max-width:768px) {
      .gallery ul li {width:50%;} 
      .gallery ul li .info .title {font-size:16px;}
}
@media screen and (max-width:640px) {
      .gallery ul li a .imgbox {width:100%; height:150px;}
      .gallery ul li a .hover_box {height:150px;}
      .gallery ul li .info .title {font-size:14px;}
      .gallery ul li .info .date {font-size:12px;}
      .gallery ul li a .hover_box .outline .icon {width:40px; height:40px; line-height:40px;}
      .gallery ul li a .hover_box .outline .icon i {font-size:20px;}
}


/* 갤러기 모달 /////////////////////////////////////////////////////////////////////////////*/
.modal_gallery {display:flex; align-items: center; padding:100px 0; width:100%; height:100%; box-sizing:border-box; background-color: rgb(0,0,0,0.9); position:fixed; top:0; left:0; z-index:100;}
.modal_gallery .modal_gallery_box {display:flex; flex-flow:column; margin:0 auto; width:1000px; color:#fff; text-align:center; box-sizing:border-box; position:relative;}
.modal_gallery .modal_gallery_box .swipe_banner {}
.modal_gallery .modal_gallery_box .info {display:flex; padding:10px 10px 30px; align-items:center; justify-content:space-between;}
.modal_gallery .modal_gallery_box .info .left {font-size:20px;}
.modal_gallery .modal_gallery_box .info .right {display:flex; gap:20px;}

.modal_gallery .modal_gallery_box .slick-track {display:flex; align-items:center;}

a.btn_modal_gallery_close {font-size:20px; color:#fff; position:absolute; top:30px; right:30px; z-index:101;}

 /* 테스크탑 */
@media all and (max-width:1200px){
      .modal_gallery .modal_gallery_box {width:98%;}
}
/* 모바일 */
@media all and (max-width:768px){
      .modal_gallery .modal_gallery_box .info {display:flex; flex-flow: column; padding:10px;}
      .modal_gallery .modal_gallery_box .info .left {font-size:18px;}
      .modal_gallery .modal_gallery_box .info .right {gap:10px; font-size:12px;}      
}

.modal_gallery_box .modal_gallery_list {display:flex; align-items:center;}
.modal_gallery_box .modal_gallery_list .outline {display:table; width:100%;}
.modal_gallery_box .modal_gallery_list .outline .v_align {display:table-cell; text-align:center;}
.modal_gallery_box .modal_gallery_list .outline img {margin:0 auto; max-width:80%; max-height:80%;}

.modal_gallery_box .slick-prev, .modal_gallery_box .slick-next {
      font-size:0;
      line-height: 0;
      position: absolute;
      top: 50%;
      display: block;
      width: 50px !important;
      height: 50px !important;
      padding: 0;
      -webkit-transform: translate(0, -50%);
      -ms-transform: translate(0, -50%);
      transform: translate(0, -50%);
      cursor: pointer;
      color: transparent;
      border: none;
      outline: none;  
      overflow:hidden;
      transition: all 0.3s;
      border-radius:100px;
      /* box-shadow: 0 2px 10px 0 rgb(0 0 0 / 30%); */
      background-color:#fff;
      background-size:25% !important;
      /*background:url('../images/common/icon_mainvisualslide_prev.png') no-repeat center center;*/
  }
 
  .modal_gallery_box .slick-prev:before {content: '';}
  [dir='rtl'] .modal_gallery_box .slick-prev:before {content: '';}
  
  .modal_gallery_box .slick-next:before {content: '';}
  [dir='rtl'] .modal_gallery_box .slick-next:before {content: '';}
  
  .modal_gallery_box .slick-prev {
      left:0px;
      background:url('../images/common/icon_arrow_gray_prev.png') #fff no-repeat center center; opacity: 1; z-index:10;
  }
  .modal_gallery_box .slick-prev:hover, .modal_gallery_box .slick-prev:focus {
      background:url('../images/common/icon_arrow_white_prev.png') #ec6407 no-repeat center center; opacity: 1;
  }
  .modal_gallery_box .slick-next {
      right:0px;
      background:url('../images/common/icon_arrow_gray_next.png') #fff no-repeat center center; opacity: 1;
  }
  .modal_gallery_box .slick-next:hover, .modal_gallery_box .slick-next:focus {
      background:url('../images/common/icon_arrow_white_next.png') #ec6407 no-repeat center center; opacity: 1;
  } 
    
  .modal_gallery_box .slick-dots {bottom:20px;}
  .modal_gallery_box .slick-dots li button:before {opacity:1; font-size:0; width:6px; height:6px; border-radius:10px; border:solid 1px #aaa}
  .modal_gallery_box .slick-dots li.slick-active button:before {opacity:1; transform:scale(1.5); background:#ec6407; border:solid 1px #ec6407;}
  
 /* 테스크탑 */
@media all and (max-width:1200px){

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

}     

/* 테블릿*/
@media all and (max-width:768px){

}
/* 모바일*/
@media all and (max-width:480px){      

}



/* 교우찾기 ////////////////////////////////////////////////////////////////////////////////*/
.caution_box {display:flex; margin-bottom:20px; padding:20px 100px; color:#631622; justify-content:space-between; align-items:center; background-color:#f9ede8; border-radius:15px;}
.caution_box .caution_icon {text-align:center; flex-basis:100px; font-size:50px; line-height:1;}
.caution_box .caution_text {flex:1;}

.search_table {margin:0 auto 50px; padding:25px; width:550px; border:solid 1px #ddd; border-radius:15px; box-sizing:border-box;}
.search_table table {width:100%;}
.search_table table th {padding:10px; border-bottom:solid 1px #ddd; vertical-align:middle;}
.search_table table td {padding:10px; border-bottom:solid 1px #ddd; vertical-align:middle;}
.search_table table td input[type="text"] {height:40px; border-radius:7px;}
.search_table .bottom {padding-top:20px; text-align:center;}

@media screen and (max-width:1024px) {
      .caution_box {padding:20px 50px;}
}
@media screen and (max-width:768px) {
      .caution_box {padding:20px; font-size:16px;}

      .search_table {padding:20px; width:80%;} 
}
@media screen and (max-width:640px) {      
      .caution_box {padding:15px; font-size:14px;}
      .caution_box .caution_icon {flex-basis:70px;}       
      
      .search_table table colgroup {display:none;}
      .search_table table tr {display:block; padding:10px; border-bottom:solid 1px #ddd;}
      .search_table table th {display:block; padding:0; border-bottom:none; text-align:left; font-size:14px; font-weight:600; color:#871d2d;}
      .search_table table td {display:block; padding:2px 0; border-bottom:none; font-size:14px;}
      .search_table table td input[type="text"] {height:32px; border-radius:5px;}

      .search_table table {font-size:16px;}
}
@media screen and (max-width:480px) {      
      .search_table {padding:10px; width:100%;}
      .search_table table tr {padding:7px;}
}



/* 회비납부 ////////////////////////////////////////////////////////////////////////////////*/
.pay_guide_grid {margin:0 auto 50px; width:880px; word-break:keep-all; white-space:-moz-pre-wrap; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}
 
.pay_guide_grid .row_img_left,
.pay_guide_grid .row_img_right {display:flex; flex-direction:row; align-items:center; justify-content:center; padding:20px 0;}
.pay_guide_grid .img {width:240px; border-radius:240px;}
.pay_guide_grid .txt {flex:1; padding:10px 20px;}
.pay_guide_grid .row_img_right .txt {text-align:right;}
@media screen and (max-width:1024px) {
      .pay_guide_grid {margin:0 auto; width:90%;}      
}

@media screen and (max-width:768px) {
      .pay_guide_grid .img {width:200px;}
}
@media screen and (max-width:640px) {
      .pay_guide_grid {margin-bottom:30px;}
      .pay_guide_grid .row_img_left {flex-direction:column;}
      .pay_guide_grid .row_img_right {flex-direction:column-reverse;}
      .pay_guide_grid .img {width:100%; text-align:center;}
      .pay_guide_grid .txt {padding:10px 0; text-align:center;}      
}

.gray_box {padding:20px; background-color:#f2f2f2; border-radius:7px; box-sizing:border-box;
word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;}


/* 납부 회비 목록 ///////////////////////////////////////////////////////////////*/
.pay_product {}
.pay_product ul {margin:0 -15px; overflow:hidden;}
.pay_product ul li {float:left; width:25%;}
.pay_product ul li .outline {margin:0 15px; text-align:center; border:solid 1px #ccc; border-radius:15px; overflow:hidden;}
.pay_product ul li .outline .top {padding:35px 10px; font-size:20px;}
.pay_product ul li .outline .top .pro_name {font-weight:bold;}
.pay_product ul li .outline .top .price {font-weight:bold; color:#871d2d;}
.pay_product ul li .outline .bottom {}
.pay_product ul li .outline .bottom button {width:100%; height:40px; color:#fff; font-size:18px; background-color:#871d2d; transition: all 0.2s ease-out;}
.pay_product ul li .outline .bottom button i {transition: all 0.2s ease-out; right:0; position:relative;}
.pay_product ul li .outline .bottom button:hover {background-color:#6b1421;}
.pay_product ul li .outline .bottom button:hover i {right:-10px;}



/* 납부 방법  //////////////////////////////////////////////////////////////////*/
.pay_how {margin-bottom:50px;}

.pay_how .func {padding:30px 0; text-align:center;}
.pay_how .func button {padding:0 40px; height:60px; font-size:24px; color:#fff; background-color:#871d2d; border:none; border-radius:40px;}
.pay_how .func button:hover {opacity:0.9;}

.pay_how_row {display:flex; align-items:center; justify-content:space-between;}
.pay_how_row .box {padding:25px; flex-basis:45%; text-align:center; background-color:#e8f3f9; border-radius:15px; box-sizing:border-box;}

.pay_how_row .box.bg_jiro {background-color:#f4f9e8;}
.pay_how_row .box.bg_credit {background-color:#f9f8e8;}
.pay_how_row .box.bg_bank {background-color:#f9ede8;}

.pay_how_row .box .title {font-size:28px;}
.pay_how_row .box .title strong {font-weight:600;}
.pay_how_row .box .info {font-size:20px;}
.pay_how_row .box .info strong {color:#871d2d; font-weight:800;}
@media screen and (max-width:1024px) {
      .pay_how_row .box .title {font-size:24px;}
      .pay_how_row .box .info {font-size:18px;} 
}

@media screen and (max-width:768px) {
      .pay_how_row .box {padding:25px 10px; flex-basis:45%;}
      .pay_how_row .box .title {font-size:20px;}
      .pay_how_row .box .info {font-size:16px;} 

      .pay_how_row .box .info img {height:50px;}

      .pay_how .func {padding:20px 0;}
      .pay_how .func button {padding:0 30px; height:50px; font-size:20px;} 
}
@media screen and (max-width:640px) {
      .pay_how_row {align-items:flex-start;}
      .pay_how_row .box {padding:15px 10px; flex-basis:49%;}
      .pay_how_row .box .title {font-size:18px;}
      .pay_how_row .box .info {font-size:14px;} 
      .pay_how_row .box .info img {height:40px;} 
      .pay_how .func button {padding:0 20px; height:42px; font-size:18px;} 
}

table.pay_info_table {width:100%; border-top:solid 1px #999; border-radius:15px; box-sizing:border-box;}
table.pay_info_table thead th {padding:10px; border-bottom:solid 1px #ddd; vertical-align:middle; font-weight:600; background-color:#f9f6f7;}
table.pay_info_table tbody th {padding:10px; border-bottom:solid 1px #ddd; vertical-align:middle; font-weight:600; background-color:#f9f6f7;
word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;}
table.pay_info_table tbody td {padding:10px; border-bottom:solid 1px #ddd; vertical-align:middle;
word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;}
table.pay_info_table .border_right {border-right:solid 1px #ddd;}
table.pay_info_table td input[type="text"],
table.pay_info_table td input[type="date"],
table.pay_info_table td select {height:40px; border-radius:7px;}

@media screen and (max-width:768px) {
      table.pay_info_table {font-size:14px;}
}

/* 결제 수단 상세 /////////////////////////////////////////////////////////*/
.pay_info_box {margin-top:10px; padding:10px 0; border:solid 1px #ccc; border-radius:15px;}
.pay_info_box .pay_info_row {padding:10px 20px; display:flex; align-items:center; gap:10px;}
.pay_info_box .pay_info_row .ti {flex-shrink:0; width:100px; font-weight:600;}
.pay_info_box .pay_info_row .cont {
      word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;
}
.pay_info_box .pay_info_row .cont select {margin:2px 0;}

@media screen and (max-width:768px) {
      .pay_info_box .pay_info_row {padding:10px;}
      .pay_info_box .pay_info_row .ti {width:70px;}
}

/* 결제 완료 페이지 ///////////////////////////////////////////////////////*/
.pay_complete_box {padding:50px 50px; background-color:#fff; border:solid 4px #ebf0f2;}
.pay_complete_box .subject {margin:0 auto 30px; font-size:26px; color:#333333; text-align:center; line-height:1.2; overflow:hidden;
	word-break:keep-all;
  white-space:-moz-pre-wrap;
  white-space:-pre-wrap;
  white-space:-o-pre-wrap;
  word-wrap:break-word;
}
.pay_complete_box .subject i {font-size:50px;}
.pay_complete_box .subject strong {display:block}
.pay_complete_box .desc {font-size:16px; line-height:1.5;}
.pay_complete_box .desc a {text-decoration:underline;}


.pay_complete_func {padding:30px 0; text-align:center;}
.pay_complete_func button {margin:0 5px; width:280px; height:48px; font-size:16px;}
.pay_complete_func button.btn_go_main {color:#fff; background-color:#000000; border:solid 1px #000000;}
.pay_complete_func button.btn_go_my {color:#333;background-color:#fff; border:solid 1px #ccc;}
.pay_complete_func button:hover {opacity:0.8;}

/* 테블릿 */
@media all and (max-width:768px){	
	.pay_complete_box {padding:30px 20px;}
	.pay_complete_box .subject {width:90%; margin:0 auto 20px;}
	.pay_complete_box .subject img {float:left; margin-right:10px; width:50px;}
	.pay_complete_box .subject strong {font-size:22px;}

	.pay_complete_func button {margin:0 5px; width:46%; height:48px; font-size:14px;}
}
/* 모바일 */
@media all and (max-width:414px){
	.pay_complete_box {padding:20px 15px;}
	.pay_complete_box .subject img {float:left; margin-right:10px; width:40px;}
	.pay_complete_box .subject strong {font-size:20px;}

	.pay_complete_func button {margin:0 0 5px; width:100%; height:48px; font-size:14px;}
}




/*  호상지 안내 //////////////////////////////////////////////////////////////////*/
.hosang_call {display:flex; margin:0 auto; margin-top:100px; width:800px; align-items:center;}
.hosang_call .img {flex-basis:260px; padding-right:10px; box-sizing:border-box;}
.hosang_call .info {}
.hosang_call .info .title {margin-bottom:10px; font-size:30px; color:#8d052a;}
.hosang_call .info .inquire {margin-bottom:5px; font-size:20px; color:#333333; line-height:1.2;}
.hosang_call .info .adress {font-size:16px; color:#666666; line-height:1.2;}
.hosang_call .info .call_info {}
.hosang_call .info .call_info dl {display:flex; align-items:end;}
.hosang_call .info .call_info dl dt {padding-bottom:4px; font-size:14px;}
.hosang_call .info .call_info dl dd {padding-left:5px; font-size:20px;}

.hosang_call .info .call_info dl.email dt {padding-bottom:0; font-size:18px;}
.hosang_call .info .call_info dl.email dd {font-size:18px;}

@media screen and (max-width:1024px) {
      .hosang_call {width:90%;}
      .hosang_call .img {flex-basis:240px;}

      .hosang_call .info .title {font-size:30px;}
      .hosang_call .info .inquire {font-size:22px;}
      .hosang_call .info .adress {font-size:16px;}
}

@media screen and (max-width:768px) {
      .hosang_call .info .title {font-size:24px;}
      .hosang_call .info .inquire {font-size:18px;}
      .hosang_call .info .adress {font-size:14px;} 
}
@media screen and (max-width:640px) {
      .hosang_call {width:100%; align-items:flex-start;}
      .hosang_call .img {flex-basis:200px;}

      .hosang_call .info .adress {margin-bottom:5px;}

      .hosang_call .info .call_info dl dt {font-size:14px;}
      .hosang_call .info .call_info dl dd {font-size:18px;}

      .hosang_call .info .call_info dl.email dt {font-size:14px;}
      .hosang_call .info .call_info dl.email dd {font-size:14px;} 
}


/* 호상지 목록 //////////////////////////////////////////////////////////////////*/
.hosangji {}
.hosangji ul {margin:0 -5px;}
.hosangji ul:after {display:block; content: ''; clear:both; }
.hosangji ul li {float:left; margin-bottom:30px; width:20%; text-align:center;}
.hosangji ul li a {display:block; overflow:hidden; position:relative;}
.hosangji ul li a .imgbox {margin:0 15px; display:flex; justify-content:center; height:250px; border:solid 1px #ccc;}
.hosangji ul li a .imgbox img {max-height:100%;}
.hosangji ul li a .hover_box {margin:0 15px; display:table; width:calc(100% - 30px); height:100%; background-color: rgba(135,29,45,0.9); position:absolute; top:100px; left:0; z-index:1; transition:all 0.3s ease-out; opacity:0; border-radius:300px;}
.hosangji ul li a .hover_box .outline {display:table-cell; vertical-align:middle; text-align:center; color:#fff; font-size:16px; font-weight:600; padding:0 10px; box-sizing:border-box;}
.hosangji ul li a .hover_box .outline .title {margin-bottom:5px; font-size:20px; line-height:1.2;}
.hosangji ul li a .hover_box .outline .icon {display:inline-block; width:56px; height:56px; line-height:56px; border-radius:56px; background-color:#871d2d;
background-image: linear-gradient(to top, #3a080f, #871d2d);}
.hosangji ul li a .hover_box .outline .icon i {font-size:30px; font-weight:normal;}
.hosangji ul li a:hover .hover_box {opacity:1; top:0; border-radius:0;}
.hosangji ul li .info {padding-top:10px; text-align:center; line-height:1; font-size:16px; font-weight:600;}

@media screen and (max-width:1200px) {
      .hosangji ul li {width:25%;} 
      .hosangji ul li a .hover_box .outline .title {font-size:18px;}
}
@media screen and (max-width:1024px) {      
      .hosangji ul li a .imgbox {height:220px;}
      .hosangji ul li a .hover_box .outline .title {font-size:18px;}
}
@media screen and (max-width:768px) {
      .hosangji ul li {width:33.33%;} 
      .hosangji ul li a .imgbox {height:220px;}
      .hosangji ul li a .hover_box .outline .title {font-size:16px;}
}
@media screen and (max-width:640px) {
      .hosangji ul li a .imgbox {height:180px;}
      .hosangji ul li a .hover_box .outline .title {font-size:14px;}
      .hosangji ul li a .hover_box .outline .icon {width:40px; height:40px; line-height:40px;}
      .hosangji ul li a .hover_box .outline .icon i {font-size:20px;}

      .hosangji ul li .info {font-size:14px;}
}
@media screen and (max-width:480px) {
      .hosangji ul li {margin:0 0 20px; width:50%;}
      .hosangji ul li a .imgbox {margin:0 15px; height:180px;}
      /* .hosangji ul li a .imgbox img {height:100%;} */
}




ul.list_dot {line-height:1.3;}
ul.list_dot li {padding:5px 0; padding-left:10px; background:url('../images/ctl/introduce/bullet_dot.png') no-repeat left 12px;}

/* 개인정보처리방침 */
table.policy {width:100%; font-size:14px;}
table.policy thead {}
table.policy thead th {padding:7px; border:solid 1px #ccc; background-color:#f2f2f2;}
table.policy tbody {}
table.policy tbody td {padding:7px; text-align:center; border:solid 1px #ccc;}


/* tab Menu */
.tabmenu {border-bottom:solid 1px #ddd;}
.tabmenu ul {display:flex; gap:2px;}
.tabmenu ul li {}
.tabmenu ul li a {display:block; padding:13px 20px 10px; font-size:16px; line-height:1; border-radius:10px 10px 0 0; background-color:#eee;}
.tabmenu ul li a:hover {background-color:#ddd;}
.tabmenu ul li a.active {color:#fff; background-color:#871d2d;}

.tab_contents_box {padding:20px 15px;}

.intro_box {padding:15px; border:solid 5px #ddd;}

/* popup style : layer pop ****************************/
.modal_screen {width:100%; height:100%; height:100vh; background-color:rgba(0,0,0,0.7); position:fixed; top:0; left:0; z-index:100;}
.l_popup {width:800px; max-height:80%; max-height:80vh; background-color:#fff; border-radius:15px; overflow:hidden; position:fixed; top:5%; left:50%; margin-left:-400px; z-index:101;}
.l_popup .title {height:50px; line-height:50px; font-size:20px; color:#fff; font-weight:normal; background-color:#871d2d; position:relative;}
.l_popup .title span {margin-left:20px;}
.l_popup .btn_popup_close {display:inline-block; position:absolute; top:0; right:20px;}
.l_popup .btn_popup_close i {display:inline-block; color:#fff;}

.l_popup .pop_body {padding:20px; max-height:calc(80% - 100px); max-height:calc(80vh - 100px); box-sizing:border-box; overflow-y:scroll;}
.l_popup .pop_footer {padding:5px 22px 30px; box-sizing:border-box;}
.l_popup .pop_footer a {margin:0 5px;}

@media screen and (max-width:1024px) {
	.l_popup {width:90%; top:100px; left:5%; margin-left:0;}
}

@media screen and (max-width:768px) {
	.l_popup {width:96%; top:100px; left:2%; margin-left:0;}
	.l_popup .pop_body {padding:20px 10px 0px;}
	.l_popup .pop_footer {padding:5px 10px 30px;}
}


/* 메인 공지 팝업 ////////////////////////////////////////////////////////////////////////// */
.popup_window {
    font-family: '맑은 고딕', 'Malgun Gothic', Arial, sans-serif;
    border-radius: 8px;
    overflow: hidden;
    resize: both;
    min-width: 250px;
    min-height: 200px;
    display: flex;

    flex-direction: column;
}

.popup_header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 12px 15px;
    position: relative;
    font-weight: bold;
    user-select: none;
    display: flex;
    justify-content: space-between;
    align-items: center;

    flex-shrink: 0;
}

.popup_title {
    font-size: 14px;
    flex-grow: 1;
}

.popup_close_btn {
    background: none;
    border: none;
    color: white;
    font-size: 18px;
    font-weight: bold;
    cursor: pointer;
    padding: 0;
    width: 50px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s;
}

.popup_close_btn:hover {
    background-color: rgba(255,255,255,0.2);
}

.popup_content {
    padding: 20px 15px;
    background-color: #ffffff;
    overflow-y: auto;
    flex-grow: 1;
    font-size: 13px;
    line-height: 1.6;

    flex-grow: 1;
    min-height: 0;
    overflow-y: auto;
}

.popup_content img {
    max-width: 100%;
    height: auto;
}

.popup_footer {
    background-color: #f8f9fa;
    padding: 10px 15px;
    border-top: 1px solid #dee2e6;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;

    flex-shrink: 0;
}

.popup_footer label {
    display: flex;
    align-items: center;
    cursor: pointer;
    color: #666;
}

.popup_footer input[type="checkbox"] {
    margin-right: 5px;
}

.popup_buttons button {
    background-color: #6c757d;
    color: white;
    border: none;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 12px;
    transition: background-color 0.2s;
}

.popup_buttons button:hover {
    background-color: #5a6268;
}

@media (max-width: 768px) {
    .popup_window {
        position: fixed !important;
        left: 10px !important;
        right: 10px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: auto !important;
        max-height: 80vh;
    }

    .popup_content {
        max-height: 400px;
    }
}