@font-face {
    font-family: 'Pretendard-Regular';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-Regular.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-Regular.woff2") format("woff2");
    font-weight: normal;
}
@font-face {
    font-family: 'Pretendard-SemiBold';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-SemiBold.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-SemiBold.woff2") format("woff2");
    font-weight: normal;
}
@font-face {
    font-family: 'Pretendard-Bold';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-Bold.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/pretendard/Pretendard-Bold.woff2") format("woff2");
    font-weight: normal;
}

@font-face {
    font-family:'KoPub-Light';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/kopub/KoPubWorldBatangLight.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/kopub/KoPubWorldBatangLight.woff2") format("woff2");
    font-weight: normal;
}

@font-face {
    font-family:'Geograph-Medium';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/geograph/Geograph-Medium.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/geograph/Geograph-Medium.woff2") format("woff2");
}

@font-face {
font-family:'EuclidCircularATrial-Semibold';
    src: url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/euclid/EuclidCircularATrial-Semibold.woff") format("woff"),
url("https://clofa.org/htdocs/wp-content/themes/understrap-child-1.2.0/fonts/euclid/EuclidCircularATrial-Semibold.woff2") format("woff2");
}


.page-template::-webkit-scrollbar{
    display: none;
  }
/*For Firefox below*/
.page-template{
	scrollbar-width:none;
}
.page-template-member{
	scrollbar-width:none;
}

#landing-whole-container::-webkit-scrollbar{
    display: none;
  }

#residency-whole-container::-webkit-scrollbar{
    display: none;
  }

.studio-visit-main::-webkit-scrollbar{
    display: none;
  }

.entry-content{
	  position: fixed !important;
    top: 0%;
    left: 0%;
    width: 100%;
}
/*Bowon Residency*/
.post-2633 .entry-content{
	  position: fixed !important;
    top: 0%;
    left: 0%;
    width: 100%;
	  height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}
/*Residency Landing but not working */
.page-49 .entry-content{
	  position: fixed !important;
    top: 0%;
    left: 0%;
    width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}

/*Studio Visit Main*/
.post-60 .entry-content{
	  position: inherit !important;

}

.navbar-brand{
	font-family: 'EuclidCircularATrial-Semibold' !important;
}
#main-nav{
	background-color:#8E0DFF !important;
	height:3rem;
/* 	height: 6.5%; */
	position:fixed;
	width:100%;
	left:0%;
	opacity:1 !important;
	 padding-bottom: 0;
  padding-top: 0;
	top:0%;
	z-index: 2000;
}
/*First circle*/
#main-nav::after {
	position:absolute;
	left:16.5%;
	top: 24%;
	border-radius: 50%;
/* 	background-color:white; */
	color: #7BC6B8; 
	width:15px;
	height:15px;
  content: "●";
}
/*Second circle*/
#main-nav::before {
	position:absolute;
	left:81.75%;
	top: 24%;
	border-radius: 50%;
/* 	background-color:white; */
	color: #7BC6B8; 
	width:15px;
	height:15px;
  content: "●";
}

/*멤버*/
#menu-item-152{
  position: relative;
  left: 8%;
}

/*버추얼레지던시*/
#menu-item-1216{
  position: relative;
  left: 4.5%;
}

/*버추얼스튜디오비짓*/
#menu-item-1218{
  position: relative;
  left: -1%;
}

.is-form-style {
  line-height: 1;
  position: relative;
  padding: 0 !important;
  display: none;
}

.is-menu.is-dropdown form {
	    display: block !important;
/*     display: none !important; */
    min-width: 255px;
    max-width: 100%;
    position: absolute;
/*     right: -100%; */
	  right: -300%;
	/*the right is edited on 3rd Jan 2024*/
    top: 0%;
	  z-index: 9;
}

.is-menu a {
	visibility: hidden;
}

.is-form-style.is-form-style-3 input.is-search-input {
    border-right: 0!important;
    background-color: #8E0DFF !important;
	    border-top: none !important;
    border-left: none !important;
	color: white !important;
	/*added on 3rd Jan 2024*/
	margin-top: 5px !important;
  height: 31px !important;
  font-size: 16px !important;
}

.is-form-style input.is-search-submit, .is-search-icon {
	background-color: #8E0DFF !important;
	border:none;
}

.is-form-style .is-search-submit path {
    fill: white;
}

#is-search-input-0::-webkit-input-placeholder{
	color:rgba(255,255,255,0.5);
}

#is-form-id-1480::placeholder{
	color: white !important;
	margin-top:25px !important;
}

		#is-search-input-1480:focus::placeholder{
	  opacity: 0 !important;
		color: transparent !important;
  }

.is-menu.is-dropdown .search-close { 
display:none !important;
}
/*search bar location change*/
.is-menu {
  position: relative;
  left: -21%;
/* 	display:none; */
	display: inline-block;
}

.is-form-style.is-form-style-3 label {
	width: 57.5% !important;
}

/*insta icon Font Awesome*/
#menu-item-3922{
	position: relative;
/*   left: -3%; */
	left:10%;
}

/*email icon Font Awesome*/
#menu-item-3921{
	position: relative;
	left: 13.5%;
/*   left:-4%; */
  margin-left: -20%;
}

.fa{
	font: normal normal normal 20px/1 FontAwesome !important;
	font-size: 20px !important;
}
.fa .fa-instagram{
	margin-top: 0.09rem !important;
}


.img-fluid {
    max-width: 60%;
    height: auto;
    position: relative;
    left: 62%;
}

.navbar-brand::after{
	position:absolute;
	content:"CLoFA";
  font-size:1.15rem;
	line-height:1.75;
/* 	top:auto; */
	top: 17%;
	left:4.5%;
	width:max-content;
	color:white;
	z-index:999;
}

.navbar-expand-md .navbar-collapse{
	justify-content: space-around;
}

/* @media (min-width: 768px)
.navbar-expand-md .navbar-nav {
    flex-direction: row;
    justify-content: space-between;
} */
.navbar-expand-md .navbar-nav {
    flex-direction: row;
    justify-content: space-between;
}

.ms-auto {
    margin-left: 17%! important;
    width: 80%;
}

.nav-link{
	    color: white;
}


.container,.container-fluid,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl{--bs-gutter-x:1.5rem;--bs-gutter-y:0;width:100%;padding-right:0;padding-left:0;margin-right:auto;margin-left:auto;max-width: 100%;}

.wrapper{
	padding:0 0;
	height:100%;
}

#member-row{
	  
	position:relative;
	top: 2vh;
  height: 100vh;
/* 	top:0%;
	height:102vh; */
}

/* .member-template .member-template-member .member-template-member-php .single .single-member .admin-bar {
	position: fixed !important;
} */
/* .page-id-150 .admin-bar{
	position: inherit !important;
} */

.member-template{
	position: fixed !important;
}
/*Code above fixed the issue of stickily scrolling function to the single member's page*/
.postid-73 #content, .postid-75 #content, .postid-76 #content, .postid-459 #content, .postid-460 #content, .postid-461 #content, .postid-462 #content, .postid-463 #content, .postid-464 #content, .postid-465 #content, .postid-734 #content, .postid-754 #content{
	overflow:hidden;
}

.page-id-49 .entry-content{
	overflow-y:hidden;
}
.site-info{
	display:none;
}

.description-col, .gallery-col{
	height:100%;
	overflow-y:scroll;
	-ms-overflow-style: none !important;
}

/*Remove the scrollbar from Chrome, Safari, Edge and IE*/
.description-col::-webkit-scrollbar, .gallery-col::-webkit-scrollbar {
   width: 0px;
   background: transparent;
}


.col-4{
/* 	padding: 2% 3% 2% 3.5%;
	width:30%;
	position:relative;
	top: 2%; */
	/*width: 33.33333333%; originally*/
}
.description-col{
	padding: 3% 3% 2% 3.5%;
	width:30%;
	position:relative;
	top: 1%;
	scrollbar-width: none;
}

.gallery-col{
	padding-top: 0.5%;
	padding-bottom: 6%;
}

.cv p{
	font-size: 0.875rem;
}

.cv p a {
  color: black;
  
}

.cv p:nth-child(1){
	  font-size: 0.95rem;
    margin-bottom: 7%;
}
.cv p:nth-child(2){
	margin-bottom: -3%;
}
.cv p:nth-child(19){
	margin-bottom: 12%;
}

.cv p:nth-child(4){

}
.cv p:nth-child(5){
	
}
.cv p:nth-child(6){
	
}
.cv p:nth-child(7){

}
.cv p:nth-child(8){
	
}
.cv p:nth-child(9){
	
}
.cv p:nth-child(10){
	
}
.cv p:nth-child(11){

}
.cv p:nth-child(12){
}
.cv p:nth-child(4), .cv p:nth-child(7),.cv p:nth-child(10), .cv p:nth-child(13), .cv p:nth-child(16){
  line-height: 1.65;
}

.cv p:nth-child(2), .cv p:nth-child(5),.cv p:nth-child(8), .cv p:nth-child(11), .cv p:nth-child(14), .cv p:nth-child(17){
  margin-top: 8%;
	margin-bottom: -3%;
	font-size: 0.95rem;
}

.cv{
	padding-bottom: 20%;
}

/*Murphy Yum*/
.postid-463 .cv p:nth-child(9) {
    margin-top: 8%;
}

/*Haesol Park*/
.postid-465 .cv p:nth-child(13) {
    margin-bottom: 12%;
}

/*Jeongin Kang*/
.postid-73 .cv p:nth-child(19){
	margin-bottom: 1rem;
}
/*Eunji Kwak*/
.postid-75 .cv p:nth-child(1){
	 margin-bottom: -3%;
   font-size: 0.95rem;
}
.postid-75 .cv p:nth-child(4), .postid-75 .cv p:nth-child(7), .postid-75 .cv p:nth-child(10), .postid-75 .cv p:nth-child(13){
	 margin-top:8%;
	 margin-bottom: -3%;
}

/*Murphy Yum*/
.postid-463 .cv p:nth-child(8){
	margin-top:0% !important;
}
.postid-463 .cv p:nth-child(10), .postid-463 .cv p:nth-child(13), .postid-463 .cv p:nth-child(16){
	margin-top: 8%;
  margin-bottom: -3%;
}
/*Haesol Bak*/
.postid-465 .cv p:nth-child(13){
	margin-bottom: 0%;
}

/*Eom ing*/
.postid-3936 .cv p:nth-child(20){
	margin-bottom: -3%;
}
.postid-3936 .cv p:nth-child(23){
	margin-top: 8%;
  margin-bottom: -3%;
}
.postid-3936 .cv p:nth-child(25) a{
	text-decoration:none;
	color:#272727;
}
/* .postid-3936 .social-icons{
	width:42%;
}
 */
/*Yeon Sung*/
.postid-4225 .cv p:nth-child(1){
	font-size:0.95rem;
	margin-bottom: -3%;
}
.postid-4225 .cv p:nth-child(3n+4){
  margin-top: 8%;
  margin-bottom: -3%;
}

/*Miye Cho*/
.postid-8300 .cv p:nth-child(1){
	font-size:0.95rem;
	margin-bottom: -3%;
}
.postid-8300 .cv p:nth-child(4), .postid-8300 .cv p:nth-child(7), .postid-8300 .cv p:nth-child(10), .postid-8300 .cv p:nth-child(13),.postid-8300 .cv p:nth-child(16){
  margin-top: 8%;
  margin-bottom: -3%;
}
.postid-8300 .cv p:nth-child(19){
	margin-top: 8%;
  margin-bottom: -3%;
}
	
.postid-8300 .cv p:nth-child(2){
	margin-top: 0%;
  margin-bottom: 0%;
}
    
/*Jisu Lee*/
.postid-4280 .cv p:nth-child(19){
	margin-bottom: 0%;
}

/*Minjung Jung*/
.postid-4295 .cv p:nth-child(9){
    margin-top: 8%;
    margin-bottom: -3%;
}
/* .postid-4295 .social-icons{
	width:42%;
} */

/*Haeyoun Hwang*/
.postid-4331 .cv p:nth-child(19){
	margin-bottom: 0%;
}


/*Hanok Kim*/
.postid-8196 .cv p:nth-child(19){
	margin-bottom: 0%;
}

/*Woosoo Lee*/
.postid-8230 .cv p:nth-child(1){
	font-size:0.95rem;
	margin-bottom: -3%;
}
.postid-8230 .cv p:nth-child(4), .postid-8230 .cv p:nth-child(7), .postid-8230 .cv p:nth-child(10), .postid-8230 .cv p:nth-child(13),.postid-4225 .cv p:nth-child(16){
  margin-top: 8%;
  margin-bottom: -3%;
}

/*2026 Updated Artists*/
.postid-7062 .cv p.cv-content,
.postid-10725 .cv p.cv-content,
.postid-10696 .cv p.cv-content,
.postid-10646 .cv p.cv-content,
.postid-10601 .cv p.cv-content,
.postid-10548 .cv p.cv-content,
.postid-10508 .cv p.cv-content,
.postid-10465 .cv p.cv-content,
.postid-10436 .cv p.cv-content,
.postid-10398 .cv p.cv-content,
.postid-10358 .cv p.cv-content,
.postid-10326 .cv p.cv-content,
.postid-10300 .cv p.cv-content,
.postid-10267 .cv p.cv-content,
.postid-10230 .cv p.cv-content,
.postid-10155 .cv p.cv-content,
.postid-10083 .cv p.cv-content,
.postid-10047 .cv p.cv-content,
.postid-10002 .cv p.cv-content,
.postid-9887 .cv p.cv-content,
.postid-6990 .cv p.cv-content,
.postid-9861 .cv p.cv-content {
    font-size: 0.875rem !important;
    line-height: 1.6 !important;       /* 줄바꿈 간격 */
    margin-top: 0px !important;
    margin-bottom: 25px !important;    /* 다음 항목 제목이 나오기 전까지의 간격 */
}

/* 2. 학력, 저서, 논문 같은 대제목 여백 조절 */
.postid-7062 .cv p.cv-title,
.postid-10725 .cv p.cv-title,
.postid-10696 .cv p.cv-title,
.postid-10646 .cv p.cv-title,
.postid-10601 .cv p.cv-title,
.postid-10548 .cv p.cv-title,
.postid-10508 .cv p.cv-title,
.postid-10465 .cv p.cv-title,
.postid-10436 .cv p.cv-title,
.postid-10398 .cv p.cv-title,
.postid-10358 .cv p.cv-title,
.postid-10326 .cv p.cv-title,
.postid-10300 .cv p.cv-title,
.postid-10267 .cv p.cv-title,
.postid-10230 .cv p.cv-title,
.postid-10155 .cv p.cv-title,
.postid-10083 .cv p.cv-title,
.postid-10047 .cv p.cv-title,
.postid-10002 .cv p.cv-title,
.postid-9887 .cv p.cv-title,
.postid-6990 .cv p.cv-title,
.postid-9861 .cv p.cv-title {
    font-size: 0.95rem !important;
    font-weight: bold !important;
    margin-top: 35px !important;
    margin-bottom: 0px !important;     /* 아래 가로선(hr)과의 여백 제거 */
}

/* 3. 가로선(hr) 간격 조절 */
.postid-7062 .cv hr,
.postid-10725 .cv hr,
.postid-10696 .cv hr,
.postid-10646 .cv hr,
.postid-10601 .cv hr,
.postid-10548 .cv hr,
.postid-10508 .cv hr,
.postid-10465 .cv hr,
.postid-10436 .cv hr,
.postid-10398 .cv hr,
.postid-10358 .cv hr,
.postid-10326 .cv hr,
.postid-10300 .cv hr,
.postid-10267 .cv hr,
.postid-10230 .cv hr,
.postid-10155 .cv hr,
.postid-10083 .cv hr,
.postid-10047 .cv hr,
.postid-10002 .cv hr,
.postid-9887 .cv hr,
.postid-6990 .cv hr,
.postid-9861 .cv hr {
    margin-top: 5px !important;
    margin-bottom: 12px !important;    /* 가로선과 아래 내용 사이의 간격 */
}

.postid-10155 .cv .social-icons {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;              /* 아이콘 사이 간격을 15px로 강제 고정 */
    margin-top: 20px !important;
    float: none !important;
    clear: both !important;
}

.arrows{
	margin-bottom: 8%;
}

.arrows img{
	width:60%;
}

#right-arrow img{
	  margin-left: 32%;
}

#jp-relatedposts{
	display: none !important;
}

.arrows, .basic-sec-box{
	display: flex;
  justify-content: space-between;
}

.basic-sec{
	display:flex;
	flex-direction:column;
	font-size: 1.25rem;
}

.basic-sec .name, .basic-sec .artist-province{
	font-weight: 700;
	margin-bottom:1.25%;
}

.name, .eng-name{
	font-size:1.25rem;
}

.artist-bio{
	 position: relative;
   top: 3.5%;
   margin-bottom: 4.5%;
	line-height: 1.65;
    font-weight: 400;
}

.artist-keywords{
    position: relative;
    top: 5%;
    color: white;
}

#single_medium{
	
}

#single_topic{
	margin-top: 1.5%;
  margin-bottom: 5%;
}

.keywords{
	position: relative;
    top: 0.5%;
	width:100%;
/* 	display:inline; */
}

.keywords span{
	    background: transparent !important;
    color: black !important;
    border-radius: 5px;
	padding: 1% 2%;
    font-size: 0.75rem;
    margin-right: 1%;
	border: 1px solid black;
	
}

.keywords span a{
	text-decoration:none;
	color:black;
}
hr{
	opacity:1 !important;
	border: 0.5px solid #272727;
}
#residency-artist{
	width: 100%;
    display: flex;
    align-items: center;
	color:#8E0DFF !important;
	position:relative;
	 top: 7%;
    font-weight: 600;
    margin-bottom: 0;
}

#right-arrow2{
	width: 7%;
  transform: rotateY(180deg);
	margin-right: 2%
}
.cv-and-statement{
	 position: relative;
/*    top: 13%; */
	/*버추얼레지던시참여작가 없앴기에 top 10%로 줄임*/
	top: 10%;
}

.cv-statement-text-table{
	width:100%;
	display:flex;
	justify-content: space-between;
	border-top: solid 1px black;
    border-bottom: solid 1px black;
	margin-bottom: 10%;
}

.cv-statement-text-table button{
	display: inline-block;
/* 	width: auto; */
	width:50%;
	background: transparent;
  border-top: 2px solid black;
    border-left: none;
    border-right: none;
    border-bottom: none;
}

#statement-btn{
	border:none;
}
.artist-statment{
	display:none;
	font-size:0.9rem;
	line-height: 1.6;
	padding-bottom: 30%;
}

#final-line{
	position:relative;
	top: 1.35%;
}

.social-icons {
/*     width: 32%; */
	width: 43%;
    height: 2rem;
    display: flex;
    margin-left: auto;
    margin-right: auto;
    justify-content: space-between;
    margin-top: 8%;
    margin-bottom: 11%;
	  cursor: pointer;
}
.social-icons a{
	width: max-content;
  cursor: pointer;
	/*밑에 세개 더했음*/
	display: flex;
	justify-content: center;
	align-items: center;
}
.social-icons img{
/* 	width:47%; */
	 width: 80%;
}

#single-email, #single-globe, #single-insta, #single-web{
	margin-top: 7%;
  margin-left: auto;
  margin-right: auto;
}

/* #single-email{
	margin-top: 7%;
} */

#single-globe{
	
}

#single-insta{
	
}

#single-web{
	
}

.col-8{
	flex: 0 0 auto;/*originally here*/
  /*width: 66.66666667%;originally*/
	width:70%;
	height:100%;
	background-color:white;
	display:flex;
	flex-direction:column;
	align-items:center;
}
	.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before {
   display: none;
   }

.wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) a, .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
    flex: 1 0 0%;
    height: 100%;
    object-fit: cover;
    width: 92.5%;
    margin: 5% auto;
}


.col-lg-4{
	    width: 90%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 2%;
}

.wp-element-caption{
	  color: black !important;
    background: white !important;
		border: none !important;
		box-shadow: none !important;
}

.col-6{
   width: 100%;
/* 	padding-bottom: 20%; */
}
/*Member overview page CSS*/
/*FILTER BTN IMAGES*/
.header-part{
	position: relative;
/*     background-color: yellow; */
  top: 5rem;
  width: 82.5%;
  margin-left: auto;
  margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}

.filters{
	position: relative;
    display: flex;
    justify-content: space-between;
    top: -50%;
    left: 93%;
    width: 7%;
    z-index: 999;
}

.filters button{
	  width: 100%;
    border: none;
    padding: 0;
    margin: 0;
    background: transparent;
}

.filters img{
	width:77%;
}

#alphabet{
	
}
#region{
	
}
#thumbimage{
	
}
/*END: FILTER BTN*/

/*NAME FILTER*/
#members-page{
	width:82.5%;
	position: relative;
  top: 5rem;
	padding-bottom: 5%;
}

#table-name-list{
	top: 0.7rem;
}

#title-members-page{
	color:#8E0DFF !important;
	position: relative;
  top: 3%;
  font-size: 1.6rem;
	display:inline-block;
	width:20%;
	margin-bottom: 0;
}
#title-eng{
	  font-weight: 300;
    margin-left: 6%;
}
#title-number{
	font-weight: 300;
    margin-left: 6%;
	color:black !important;
}

#name-each-member a{
	color:black !important;
	text-decoration:none;
}

/*change table tags to divs*/
.table{
width: 100%;
position: relative;

}

.tbody{
width: 100%;
display: flex;
flex-direction: column;
}

.tr{
/*   display: flex;
  justify-content: flex-start; */
  max-height: 3rem;
  border-bottom: 1px solid #494949;
}

.tr:nth-child(1){
	border-top: 1px solid #494949;
}

.tr a{
	display: flex;
  justify-content: flex-start;
  color: black;
  text-decoration: none;
}

.tr:hover{
	background-color: #8E0DFF !important;
}
.tr a:hover > #name-each-member { color: white !important; }

.tr a:hover > #name-each-member a{ color: white !important; }

.tr a:hover > #enname-each-member { color: white !important; }

.tr a:hover > #position-mem { color: white !important; }

.tr a:hover > #province-each-member { color: white !important; }

.tr a:hover > #line-mark { 
	border: 0.5px solid white !important;
}
.tr a:hover > #line-mark2 {
	border: 0.5px solid white !important; 
}

.tr:hover #tagspan {     color: white !important; }

.tr:hover #comma-mark {     color: white !important; }

#name-each-member{
	position: relative;
    left: 3%;
    width: 6%;
}
#enname-each-member{
	position: relative;
    left: 2.5%;
	width:14%;
}
#province-each-member{
	position: relative;
    left: 2%;
	width:6%;
}

#allkeywords{
	  max-width: 60%;
    max-height: 3rem;
    display: flex;
    justify-content: flex-start;
    flex: 1 1 0;
/*     overflow-x: auto;
    overflow-y: hidden; */
/* 	   overflow-y: -moz--ms-overflow-style: none; */
	/* IE 11 */
    scrollbar-width: none; /* Firefox 64 */
}

#allkeywords::-webkit-scrollbar{
	display:none;
}

#comma-mark{
	display:inline-block;
	padding:0;
	margin-left: -1%;
}

/* #allkeywords:hover > #key-medium{
animation: marquee 14s linear infinite forwards;
} */

/* #allkeywords:hover > #key-topic{
animation: marquee 56s linear infinite forwards;
}
 */
/* @keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-40%);
  }
} */

#line-mark,#line-mark2, #line-mark3, #line-mark4, #line-mark5, #line-mark6{
	position: relative;
	border: 0.5px solid #272727;
	font-size: 12px;
} 
#line-mark{
    margin-right: 6%;   
}
#line-mark2{
    margin-right: 3%;
}
#line-mark3{
    margin-right: 8.5%;
}
#line-mark4{
    margin-right: 3%;
}
#line-mark5{
    left: -45%;
}
#line-mark6{
    left: -95%;
}


#key-medium{
	position: relative;
   left: 6%;
width: 46%;
/*     background: yellow; */
  overflow-x: auto;
	scrollbar-width: none;
}

#key-topic{
	   position: absolute;
    left: 65%;
    width: 50%;
	overflow-x: auto;
}

#key-medium::-webkit-scrollbar, #key-topic::-webkit-scrollbar{
  display: none;
}

.keywords-mem{
	 position: relative;
   display: inline-block;
   white-space: nowrap;
   width: auto;
	box-sizing: border-box;
	scrollbar-width:none;
}

#key-medium:-webkit-scrollbar,
.keywords-mem:-webkit-scrollbar{
    display: none;
  }

.tagspan{
	 width: max-content;
	/*width: min-content is fine too*/
   display: inline-block;
   color: #272727 !important;
	 margin-right: 1%;
}

.tagspan a{
	text-decoration:none;
	color: #272727 !important;
}
/*END: NAME FILTER*/

/*PROVINCE FILTER*/
.body-province{
	width:100%;
	border-top: 1px solid #272727;
}

.table-province{
	  display: none;
	  width: 82.5%;
    position: relative;
/*     top: 5rem; */
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
	  padding-bottom: 5%;
}
.row-province{
	width:100%;
}
.row-province summary{
	max-height: 3rem;
/* 	border-bottom: 1px solid black; */
	border-bottom: 1.5px solid #272727;
}


.row-province summary:hover{
	background-color: #8E0DFF !important;
}

.row-province summary:hover > .summary-section { color: white !important; }

.row-province summary:hover > .summary-section h2{ color: white !important; }

.row-province a:hover{ color: white !important; }

.row-province a:hover #name-mem, .row-province a:hover #enname-mem, .row-province a:hover #prov-position-mem{     color: white !important; 
}

.row-province a:hover #comma-mark{
	color: white !important; 
}

.row-province a:hover .tagspan {     
	color: white !important; 
} 

.summary-section{
	height:100%;
    display: inline-block;
    margin-top: 0.5%;
	  margin-bottom: 0.15%;
	  width: 45%;
}

.summary-section h2{
	color: #8E0DFF !important;
	font-size:1rem;
	font-weight:bold;
	display:inline-block;
	position:relative;
	left: 4%;
	color:#272727;
/* 	margin-right: 5%; */
}

#artist_num{
	font-weight:bold;
	position: relative;
/*   left: 9.25%; */
	left:51px;
}

#info-mem{
	color:#272727;
	max-height: 3rem;
  padding-top: 0.3%;
  padding-bottom: 0.3%;
	display: flex;
  flex-direction: row;
  justify-content: flex-start;
	align-items: center;
	border-bottom: 1px solid #272727;
    width: 100%;
/*     background: skyblue; */
}

.row-province a{
	color:#272727 !important;
	text-decoration:none;
}

#name-mem{
  position: relative;
  left: 2.9%;
	width:4%;
  padding: 0;
	color:#272727;
}

#enname-mem{
  position: relative;
	width: 10.5%;
	left: 48px;
/*   left: 4%; */
  padding: 0;
	color:#272727;
}

#region-mem{
	  width: 5%;
/*     background: yellow; */
    margin: 0;
    padding: 0;
	  color:#272727;
}

#position-mem{
	position: relative;
  left: 2.5%;
  width: 5%;
	color:#272727;
	margin: 0;
  padding: 0
}

#prov-position-mem{
	position: relative;
  left: 9%;
	width: 3%;
	margin: 0;
  padding: 0;
	
}

#prov-allkeywords{
	position: relative;
  left: 9%;
	width: 60%;
	max-height:3rem;
	display:flex;
	align-items: center;
  padding-top: 0.26rem;
  padding-bottom: 0.26rem;
}

#prov-key-medium{
	position: relative;
  left: 4%;
  width: 46%;
  overflow-x: auto;
	scrollbar-width: none;
}

#prov-key-medium::-webkit-scrollbar, #prov-key-topic::-webkit-scrollbar{
    display: none;
  }

#prov-key-topic{
	position: absolute;
  left: 55%;
  width: 50%;
	overflow-x: auto;
	scrollbar-width: none;
}

#name-mem a{
	color:#272727;
	text-decoration: none;
}

#info-mem:hover{
	background-color: #8E0DFF !important;
}

/* #info-mem:hover > #name-mem a{ color: white !important; }

#info-mem:hover > #enname-mem { color: white !important; }

#info-mem:hover > #region-mem { color: white !important; }

#info-mem:hover > #position-mem { color: white !important; }

#info-mem:hover .tagspan {     background-color: white !important; } */


/*END: PROVINCE FILTER*/

/*THUMBNAIL FILTER*/
.table-thumbnail{
	  display: none;
	  width: 82.5%;
    position: relative;
/*     top: 5rem; */
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
	  padding-bottom:10%;
}

.img-gallery{
    display: grid;
/*     grid-gap: 5px; */
	  grid-gap: 0.4%;
/*     grid-template-rows: repeat(6, 197px);
    grid-template-columns: repeat(6, 197px); */
/* 	  grid-template-rows: repeat(4, 13.65vw); */
	 grid-template-rows: repeat(11, 13.8vw);
  grid-template-columns: repeat(6, 16.275%);
    grid-auto-flow: row;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
/*     top: 3%; */
}

/* .img-gallery{
	display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 0.5%;
	width: 100%;
  margin-left: auto;
  margin-right: auto;
	position: relative;
  top: 3%;
  grid-auto-rows: auto;
} */


#thumb-frame{
height: 79.5%;
/*     background: yellow; */
}
#thumb-frame a:hover:before{
	position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
	background-color:rgba(142,13,255,0.6);
	width: 16.275%;
   height: 13.65vw;
	text-align: center;
  color: white;
	white-space: pre-wrap;
}


/* 1행 (1~6) */
#thumb-frame:nth-child(1) a:hover:before {
	top: 0%;
	left: 0%;
	content: "울산\A작가\A\A강정인\AJeongin Kang";
}
#thumb-frame:nth-child(2) a:hover:before {
	top: 0%;
	left: 16.675%;
	content: "충남\A작가\A\A공은지\A Eunjee Kong";
}
#thumb-frame:nth-child(3) a:hover:before {
	top: 0%;
	left: 33.35%;
	content: "수도권\A작가\A\A공지선\AGong Jiseon";
}
#thumb-frame:nth-child(4) a:hover:before {
	top: 0%;
	left: 50.025%;
	content: "울산\A작가\A\A곽은지\A Eunji Kwak";
}
#thumb-frame:nth-child(5) a:hover:before {
	top: 0%;
	left: 66.7%;
	content: "경남\A작가\A\A권미정\AMijeong Kwon";
}
#thumb-frame:nth-child(6) a:hover:before {
	top: 0%;
	left: 83.375%;
	content: "대구\A작가\A\A김다슬\A Dasul Kim";
}

/* 2행 (7~12) */
#thumb-frame:nth-child(7) a:hover:before {
	top: 14.4vw;
	left: 0%;
	content: "수도권\A작가\A\A김남희\A Namhee Kim";
}
#thumb-frame:nth-child(8) a:hover:before {
	top: 14.4vw;
	left: 16.675%;
	content: "광주\A작가\A\A김노을\A Noeul Kim";
}
#thumb-frame:nth-child(9) a:hover:before {
	top: 14.4vw;
	left: 33.35%;
	content: "대전\A작가\A\A김보원\A Bowon Kim";
}
#thumb-frame:nth-child(10) a:hover:before {
	top: 14.4vw;
	left: 50.025%;
	content: "광주\A기획자\A\A김소진\ASojin Kim";
}
#thumb-frame:nth-child(11) a:hover:before {
	top: 14.4vw;
	left: 66.7%;
	content: "부산\A작가\A\A김수정\ASujeong Kim";
}
#thumb-frame:nth-child(12) a:hover:before {
	top: 14.4vw;
	left: 83.375%;
	content: "울산\A작가\A\A김아해\A Ahae Kim";
}

/* 3행 (13~18) */
#thumb-frame:nth-child(13) a:hover:before {
	top: 28.8vw;
	left: 0%;
	content: "수도권\A작가\A\A김용선\A Yongsun Kim";
}
#thumb-frame:nth-child(14) a:hover:before {
	top: 28.8vw;
	left: 16.675%;
	content: "충북\A작가\A\A김윤아\A Yoonah Kim";
}
#thumb-frame:nth-child(15) a:hover:before {
	top: 28.8vw;
	left: 33.35%;
	content: "광주\A작가\A\A김지혜\A Jihye Kim";
}
#thumb-frame:nth-child(16) a:hover:before {
	top: 28.8vw;
	left: 50.025%;
	content: "수도권\A작가\A\A김한솔\A Hansol Kim";
}
#thumb-frame:nth-child(17) a:hover:before {
	top: 28.8vw;
	left: 66.7%;
	content: "대전\A작가\A\A김하녹\A Ha Nok Kim";
}
#thumb-frame:nth-child(18) a:hover:before {
	top: 28.8vw;
	left: 83.375%;
	content: "울산\A작가\A\A김현진\A Hyunjin Kim";
}

/* 4행 (19~24) */
#thumb-frame:nth-child(19) a:hover:before {
	top: 43.2vw;
	left: 0%;
	content: "전북\A작가\A\A머피염\A Murphy Yum";
}
#thumb-frame:nth-child(20) a:hover:before {
	top: 43.2vw;
	left: 16.675%;
	content: "전북\A작가\A\A문채원\A Chewon Moon";
}
#thumb-frame:nth-child(21) a:hover:before {
	top: 43.2vw;
	left: 33.35%;
	content: "대전\A작가\A\A민효경\A Hyokyoung Min";
}
#thumb-frame:nth-child(22) a:hover:before {
	top: 43.2vw;
	left: 50.025%;
	content: "수도권\A작가\A\A발레리 티 리\A Valerie Tee Lee";
}
#thumb-frame:nth-child(23) a:hover:before {
	top: 43.2vw;
	left: 66.7%;
	content: "제주\A작가\A\A박보오리\A Boohri Park";
}
#thumb-frame:nth-child(24) a:hover:before {
	top: 43.2vw;
	left: 83.375%;
	content: "경남\A작가\A\A박소은\A Soeun Park";
}

/* 5행 (25~30) */
#thumb-frame:nth-child(25) a:hover:before {
	top: 57.6vw;
	left: 0%;
	content: "경남\A작가\A\A박소형\A Park Sohyoung";
}
#thumb-frame:nth-child(26) a:hover:before {
	top: 57.6vw;
	left: 16.675%;
	content: "강원\A기획자\A\A박수정\A Soojeong Park";
}
#thumb-frame:nth-child(27) a:hover:before {
	top: 57.6vw;
	left: 33.35%;
	content: "강원\A작가\A\A박연재\A Yeonjae Park";
}
#thumb-frame:nth-child(28) a:hover:before {
	top: 57.6vw;
	left: 50.025%;
	content: "세종\A작가\A\A박영지\A Youngji Park";
}
#thumb-frame:nth-child(29) a:hover:before {
	top: 57.6vw;
	left: 66.7%;
	content: "광주\A작가\A\A박해솔\A Haesol Bak";
}
#thumb-frame:nth-child(30) a:hover:before {
	top: 57.6vw;
	left: 83.375%;
	content: "광주\A작가\A\A박화연\A Hwayeon Park";
}

/* 6행 (31~36) */
#thumb-frame:nth-child(31) a:hover:before {
	top: 72vw;
	left: 0%;
	content: "울산\A작가\A\A백다래\A Darae Baek";
}
#thumb-frame:nth-child(32) a:hover:before {
	top: 72vw;
	left: 16.675%;
	content: "부산\A작가\A\A서영\A seoyoung";
}
#thumb-frame:nth-child(33) a:hover:before {
	top: 72vw;
	left: 33.35%;
	content: "제주\A작가\A\A손유진\A Yujin Son";
}
#thumb-frame:nth-child(34) a:hover:before {
	top: 72vw;
	left: 50.025%;
	content: "제주\A작가\A\A송유진\A Yujin Song";
}
#thumb-frame:nth-child(35) a:hover:before {
	top: 72vw;
	left: 66.7%;
	content: "강원\A기획자\A\A송윤지\A Yunji Song";
}
#thumb-frame:nth-child(36) a:hover:before {
	top: 72vw;
	left: 83.375%;
	content: "수도권\A작가\A\A양세진\A Yang Sejin";
}

/* 7행 (37~42) */
#thumb-frame:nth-child(37) a:hover:before {
	top: 86.4vw;
	left: 0%;
	content: "수도권\A작가\A\A엄소완\A EUM Sowan";
}
#thumb-frame:nth-child(38) a:hover:before {
	top: 86.4vw;
	left: 16.675%;
	content: "수도권\A작가\A\A안진선\A Jinseon Ahn";
}
#thumb-frame:nth-child(39) a:hover:before {
	top: 86.4vw;
	left: 33.35%;
	content: "부산\A작가\A\A어밍\A Eom Ing";
}
#thumb-frame:nth-child(40) a:hover:before {
	top: 86.4vw;
	left: 50.025%;
	content: "경남\A작가\A\A연성\A Yeon Sung";
}
#thumb-frame:nth-child(41) a:hover:before {
	top: 86.4vw;
	left: 66.7%;
	content: "수도권\A작가\A\A은산\A Eunsahn";
}
#thumb-frame:nth-child(42) a:hover:before {
	top: 86.4vw;
	left: 83.375%;
	content: "수도권\A콜렉티브\A\A옵저버\A Observer";
}

/* 8행 (43~48) */
#thumb-frame:nth-child(43) a:hover:before {
	top: 100.8vw;
	left: 0%;
	content: "광주\A작가\A\A윤연우\A Yeonwoo Yoon";
}
#thumb-frame:nth-child(44) a:hover:before {
	top: 100.8vw;
	left: 16.675%;
	content: "수도권\A작가\A\A이수현\A Suhyeon Lee";
}
#thumb-frame:nth-child(45) a:hover:before {
	top: 100.8vw;
	left: 33.35%;
	content: "대구\A작가\A\A이승희\A Seunghee Lee";
}
#thumb-frame:nth-child(46) a:hover:before {
	top: 100.8vw;
	left: 50.025%;
	content: "울산\A작가\A\A이우수\A Woosoo Lee";
}
#thumb-frame:nth-child(47) a:hover:before {
	top: 100.8vw;
	left: 66.7%;
	content: "충남\A작가\A\A이지수\A Jisu Lee";
}
#thumb-frame:nth-child(48) a:hover:before {
	top: 100.8vw;
	left: 83.375%;
	content: "충북\A작가\A\A이지원\A EG1";
}

/* 9행 (49~54) */
#thumb-frame:nth-child(49) a:hover:before {
	top: 115.2vw;
	left: 0%;
	content: "수도권\A작가\A\A이주은\A Jueun Lee";
}
#thumb-frame:nth-child(50) a:hover:before {
	top: 115.2vw;
	left: 16.675%;
	content: "충북\A작가\A\A이채연\A Chaeyeon Lee";
}
#thumb-frame:nth-child(51) a:hover:before {
	top: 115.2vw;
	left: 33.35%;
	content: "제주\A작가\A\A이혜윤\A Hyeyoon Lee";
}
#thumb-frame:nth-child(52) a:hover:before {
	top: 115.2vw;
	left: 50.025%;
	content: "수도권\A작가\A\A임성희\A Seonghui Lim";
}
#thumb-frame:nth-child(53) a:hover:before {
	top: 115.2vw;
	left: 66.7%;
	content: "대구\A작가\A\A장수영\A Suyoung Jang";
}
#thumb-frame:nth-child(54) a:hover:before {
	top: 115.2vw;
	left: 83.375%;
	content: "전북\A작가\A\A장연호\A Yeonho Jang";
}

/* 10행 (55~60) */
#thumb-frame:nth-child(55) a:hover:before {
	top: 129.6vw;
	left: 0%;
	content: "수도권\A작가\A\A장한이\A Hani Jang";
}
#thumb-frame:nth-child(56) a:hover:before {
	top: 129.6vw;
	left: 16.675%;
	content: "부산\A작가\A\A전미\A Jeonmi";
}
#thumb-frame:nth-child(57) a:hover:before {
	top: 129.6vw;
	left: 33.35%;
	content: "대구\A작가\A\A전영현\A Younghyun Jeon";
}
#thumb-frame:nth-child(58) a:hover:before {
	top: 129.6vw;
	left: 50.025%;
	content: "수도권\A작가\A\A제이리\A Jay Lee";
}
#thumb-frame:nth-child(59) a:hover:before {
	top: 129.6vw;
	left: 66.7%;
	content: "전남\A작가\A\A정민정\A Minjung Jung";
}
#thumb-frame:nth-child(60) a:hover:before {
	top: 129.6vw;
	left: 83.375%;
	content: "수도권\A작가\A\A정원\A One Jeong";
}

/* 11행 (61~66) */
#thumb-frame:nth-child(61) a:hover:before {
	top: 144vw;
	left: 0%;
	content: "수도권\A작가\A\A조미예\A Miye Cho";
}
#thumb-frame:nth-child(62) a:hover:before {
	top: 144vw;
	left: 16.675%;
	content: "대구\A작가\A\A조영지\A Youngji Cho";
}
#thumb-frame:nth-child(63) a:hover:before {
	top: 144vw;
	left: 33.35%;
	content: "울산\A작가\A\A조윤아\A Cho Yun A";
}
#thumb-frame:nth-child(64) a:hover:before {
	top: 144vw;
	left: 50.025%;
	content: "충남\A작가\A\A채경서\A Kyungseo Chae";
}
#thumb-frame:nth-child(65) a:hover:before {
	top: 144vw;
	left: 66.7%;
	content: "대구\A작가\A\A최령은\A Ryeongeun Choi";
}
#thumb-frame:nth-child(66) a:hover:before {
	top: 144vw;
	left: 83.375%;
	content: "대전\A작가\A\A허은선\A EunSun Heo";
}

/* 12행 (67) */
#thumb-frame:nth-child(67) a:hover:before {
	top: 158.4vw;
	left: 0%;
	content: "경북\A작가\A\A황해연\A Haeyoun Hwang";
}

/* #thumb-frame:nth-child(1) a:hover:before {
	position: absolute;
  top: 0%;
  left: 0%;
  display: flex;
  justify-content: center;
  align-items: center;
	background-color:rgba(142,13,255,0.6);
	width: 16.275%;
   height: 13.65vw;
	text-align: center;
  color: white;
	white-space: pre-wrap;
	content: "울산광역시\A작가\A강정인 \AJungin Kang";
} */

#thumb-frame a{
	text-decoration: none;
  color: transparent;
}

#thumb-frame img{
	width: 100%;
	border:1px solid #272727;
}

/*END: THUMBNAIL FILTER*/

/*Landing page CSS*/
.scrollsec {
    transition: transform .3s cubic-bezier(.3, 0, .3, 1), opacity .3s linear;
    transition-delay: 0.5s;

  }

[data-scroll="in"].scrollsec {
    opacity: 0.3;
    transform: translateY( .25em );
  }

#landing-whole-container{
	margin:0;
	padding:0;
	width:100%;
/* 	height:100%; */
	height:100vh;
	overflow-x:hidden;
	overflow-y:auto;
  scroll-snap-type: y mandatory;
	scroll-behavior: smooth;
	scrollbar-width:none;
}
.section1, .section2, .section3, .section4, .section5 {
	  width: 100%;
    height: 100vh;
	  scroll-snap-align: start;
}
/*section5 is footer */

.section1{
	background: #8E0DFF !important; 
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
}

.section3{
	flex-direction: column;
  align-items: center;
  justify-content: center;
	width:100%;
  max-width:100%;
  height:100vh;
  background-image: url("https://clofa.org/wp-content/uploads/2026/03/Local_Map_2025.png");
   background-size: cover;
}

.section3 figure{
	margin-bottom:0;
	margin-top: 0;
	/*margin-top없어도됨*/
}

/* .section3-image{
	display: inline-block !important;
  width: 100% !important;
}

.section3-image img{
	margin-bottom: 0 !important;
	line-height: 0 !important;
	width: 100%;
  height: 100vh;
} */
  
.article1, .sec4-article{
	width:100%;
	position: relative;
  z-index: 1;
	/*윗두개 비디오테스트땜에 넣음*/
}

#main-header-text{
	font-family:'Geograph-Medium';
	font-family: 'Geograph-Medium';
    font-size: 6.5rem;
    line-height: 1.1;
/* 	margin-top: -5rem;  */
	
}

.main-para-text{
	font-size:2rem;
	margin-top: 0.5rem; 
}

#clofa-logo-landing{
  position:absolute;
	top:80%;
	left: 90%;
  width: 10%;
}

#clofa-logo-landing img{
	width:55%;
}

.ball{
	position: absolute;
	z-index:3; 
  border-radius: 50%;
}

#ball1{
	background-color: white;
	top:60%;
	left:40%;
	width:60px;
	height:60px;
	-webkit-animation: myOrbit 4s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit 4s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit 4s linear infinite; /* Opera 12+ */
   animation: myOrbit 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
    
}
#ball2{
	background-color: white;
	top:30%;
	left:50%;
	width:60px;
	height:60px;
	-webkit-animation: myOrbit2 4s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit2 4s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit2 3s linear infinite; /* Opera 12+ */
   animation: myOrbit2 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
  z-index:0;	
    
}

#ball3{
	background-color: white;
	top:40%;
	left:40%;
	width:50px;
	height:50px;
	-webkit-animation: myOrbit3 5s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit3 5s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit3 3s linear infinite; /* Opera 12+ */
   animation: myOrbit3 5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
    
}

#ball4{
	background-color: white;
	top:90%;
	left:0%;
	width:50px;
	height:50px;
	-webkit-animation: myOrbit4 4s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit4 4s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit4 4s linear infinite; /* Opera 12+ */
   animation: myOrbit4 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
	z-index:0;	
    
}

#ball5{
	background-color: white;
	top:30%;
	left:80%;
	width:45px;
	height:45px;
	-webkit-animation: myOrbit5 5s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit5 5s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit5 5s linear infinite; /* Opera 12+ */
   animation: myOrbit5 5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
	z-index:0;	
    
}

#ball6{
	background-color: white;
	top:10%;
	left:90%;
	width:60px;
	height:60px;
	-webkit-animation: myOrbit6 4s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit 4s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit 4s linear infinite; /* Opera 12+ */
   animation: myOrbit 4s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
    
}

#ball7{
	background-color: white;
	top:100%;
	left:70%;
	width:50px;
	height:50px;
	-webkit-animation: myOrbit7 6s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit7 6s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit7 6s linear infinite; /* Opera 12+ */
   animation: myOrbit7 6s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
    
}

#ball8{
	background-color: white;
	top:50%;
	left:48%;
	width:60px;
	height:60px;
	-webkit-animation: myOrbit8 6s linear infinite; /* Chrome, Safari 5 */
  -moz-animation: myOrbit8 6s linear infinite; /* Firefox 5-15 */
   -o-animation: myOrbit8 6s linear infinite; /* Opera 12+ */
   animation: myOrbit8 6s linear infinite; /* Chrome, Firefox 16+, IE 10+, Safari 5 */
    
}


/*ball1 orbit*/
@-webkit-keyframes myOrbit {
    from { -webkit-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -webkit-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@-moz-keyframes myOrbit {
    from { -moz-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -moz-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@-o-keyframes myOrbit {
    from { -o-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -o-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@keyframes myOrbit {
    from { transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

/*ball2 orbit*/
@-webkit-keyframes myOrbit2 {
    from { -webkit-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-moz-keyframes myOrbit2 {
    from { -moz-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-o-keyframes myOrbit2 {
    from { -o-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@keyframes myOrbit2 {
    from { transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

/*ball3 orbit*/
@-webkit-keyframes myOrbit3 {
    from { -webkit-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -webkit-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@-moz-keyframes myOrbit3 {
    from { -moz-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -moz-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@-o-keyframes myOrbit3 {
    from { -o-transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { -o-transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

@keyframes myOrbit3 {
    from { transform: rotate(0deg) translateX(200px) rotate(0deg); }
    to   { transform: rotate(360deg) translateX(200px) rotate(-360deg); }
}

/*ball4 orbit*/
@-webkit-keyframes myOrbit4 {
    from { -webkit-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-moz-keyframes myOrbit4 {
    from { -moz-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-o-keyframes myOrbit4 {
    from { -o-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@keyframes myOrbit4 {
    from { transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

/*ball5 orbit*/
@-webkit-keyframes myOrbit5 {
    from { -webkit-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-moz-keyframes myOrbit5 {
    from { -moz-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-o-keyframes myOrbit5 {
    from { -o-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@keyframes myOrbit5 {
    from { transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

/*ball6 orbit*/
@-webkit-keyframes myOrbit6 {
    from { -webkit-transform: rotate(0deg) translateX(900px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(900px) rotate(360deg); }
}

@-moz-keyframes myOrbit6 {
    from { -moz-transform: rotate(0deg) translateX(900px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(900px) rotate(360deg); }
}

@-o-keyframes myOrbit6 {
    from { -o-transform: rotate(0deg) translateX(900px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(900px) rotate(360deg); }
}

@keyframes myOrbit6 {
    from { transform: rotate(0deg) translateX(900px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(900px) rotate(360deg); }
}

/*ball7 orbit*/
@-webkit-keyframes myOrbit7 {
    from { -webkit-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-moz-keyframes myOrbit7 {
    from { -moz-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@-o-keyframes myOrbit7 {
    from { -o-transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

@keyframes myOrbit7 {
    from { transform: rotate(0deg) translateX(300px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(300px) rotate(360deg); }
}

.section2{
	background-color: #7BC6B8 !important;
	display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/*ball8 orbit*/
@-webkit-keyframes myOrbit8 {
    from { -webkit-transform: rotate(0deg) translateX(400px) rotate(0deg); }
    to   { -webkit-transform: rotate(-360deg) translateX(400px) rotate(360deg); }
}

@-moz-keyframes myOrbit8 {
    from { -moz-transform: rotate(0deg) translateX(400px) rotate(0deg); }
    to   { -moz-transform: rotate(-360deg) translateX(400px) rotate(360deg); }
}

@-o-keyframes myOrbit8 {
    from { -o-transform: rotate(0deg) translateX(400px) rotate(0deg); }
    to   { -o-transform: rotate(-360deg) translateX(400px) rotate(360deg); }
}

@keyframes myOrbit8 {
    from { transform: rotate(0deg) translateX(400px) rotate(0deg); }
    to   { transform: rotate(-360deg) translateX(400px) rotate(360deg); }
}

.section2{
	background-color: #7BC6B8 !important;
	display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}


/*section 2*/
.des-article{
	width:75%;
	margin-left: auto;
  margin-right: auto;
	position: relative;
  z-index: 1;
}

#hr-line{
	border-color: black !important;
	border: 0.2px solid;
  position: relative;
  margin-top: 4em;
	margin-bottom: 5em;
  opacity: 0.7;	    
}

.description-header p{
	color:#8E0DFF !important;
	font-size:3rem;
	line-height: 1.3;
}

.description-detail p{
	width: 89%;
  font-size: 1.7rem;
  line-height: 1.6;
}

/*section4*/
.section4{
	background: #7BC6B8 !important;
	display:flex;
	flex-direction: column;
  align-items: center;
  justify-content: center;
}

.sec4-article{
	width: 80%;
  margin: 8% auto;
}

.description-header-4 {
	color:#8E0DFF !important;
	font-size:3rem;
	line-height: 1.2;
	position: relative;
	z-index: 0;
}

.three-col{
	width:100%;
	margin: 8% auto;
}

.sec4-subcol{
	  align-items: center;
}

.description-subheader {
	color:#8E0DFF !important;
	font-size: 2rem;
}

.description-detail-4{
  width: 89%;
  font-size: 1.4rem;
  line-height: 1.5;	
}

#sec4-hr1{
	border-color: black !important;
	border: 0.2px solid;
  position: relative;
/*   margin-top: -0.875em; */
  opacity: 0.7;	 
}
/*Footer section5*/

.section5{
/* 	background: #7BC6B8 !important; */
	display:flex;
	flex-direction: column;
  align-items: center;
  justify-content: flex-end;
}
	#spon-logo, #spon-text{
		position: relative;
	}

#spon-logo{
/* 	justify-content: space-evenly;
  width: 40%;
	flex-wrap: wrap; */
	justify-content: space-between;
  width: 45%;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
	margin-bottom: 2rem;
	top: -60%;
}

#spon-logo img{
	width: 80%;
}

#spon1{
	
}
#spon2{
	
}
#spon3{
	
}
/* #spon4, #spon5{
	 margin-top: 2rem;
} */
#spon5{
	
}

#spon-text{
	top: -55%;
}

#spon-text p{
	font-family: "Pretendard-Regular";
	color: #8E0DFF !important;
	    width: 60%;
    margin-left: auto;
    margin-right: auto;
    padding: 0 5%;
    font-size: 1.1rem;
    line-height: 145%;
}

#landfooter{
	background:#8E0DFF !important;
}

#landfooter p a{
	text-decoration: underline;
	color: white;
}
	

.section5 p{
    font-family: 'Pretendard-Regular';  
	font-weight: 300;
	font-size: 1rem;
	color: white;
	margin-bottom: 0;
	position: relative;
	text-align: center;
	line-height: 1.5;
	width: 100vw;
	padding-top: 5vh;
	padding-bottom: 5vh;
}

#land-video{
	width:100%;
	height:91vh;
  position:relative;

}
#land-video video{
  position: relative;
  width: 100vw;
}

#main a {
  color: black;

}

    

/*VIRTUAL STUDIO VISIT Page*/
.studio-section{
	width:100%;
	height:100vh;
	background-color: #7BC6B8 !important;
}

#about-studio-visit {
	width:100%;
	height: 3rem;
  position: fixed;
	top:3rem;
  left: 0;
  background-color: white;
  border-bottom: 1px solid black;
/*   justify-content: center; */
  justify-content: start;
  z-index: 1;
}


#intervieww-left-arrow img, #intervieww-right-arrow img{
	margin-bottom:0;
}

#intervieww-left-arrow{
    width: 100%;
    position: relative;
    left: 100%;
}

#intervieww-right-arrow{
    width: 100%;
    position: relative;
    right: 100%;
}

/*circle-about is for residency single pages*/

/*about-circle is for interview visit pages*/
.about-circle{
	  position: relative;
    left: -0.5%;
}

.about-circle-right{
	  position: relative;
    left: 0.5%;
}

/*This #circle is not in a use anymore.*/
#circle{
/* 	width:22px;
	height:22px; */
	width:15px;
	height:15px;
  padding-left: 1%;
	border-radius:50%;
	background-color:#8E0DFF !important;
	flex: 0 0 auto;
}

.page-id-60 .entry-title{
	display:none;
}

#about-des{
	font-size:1rem;
	line-height:1.4;
}
#about-visit-title{
	font-family: 'Pretendard-SemiBold';
}

#about-des{
font-family: 'Pretendard-Regular';
}

#about-title{
	color: #8E0DFF !important;
}

#about-visit-title{
	color: #8E0DFF !important;
/* 	font-weight: 600; */
	font-size:1rem;
	line-height:1.4;
	margin-left: 2.5%;
  margin-right: 1.5%;
}

#about-des{
	margin-bottom:0;
}

.whole-books-box{
	width: 100%;
  position: absolute;
  top: 3rem;
  left: 0.5%;
  overflow-y: scroll;
	overflow-x: hidden;
/* 	flex-wrap: nowrap; */
}

.studio-visit-main {
    width: 100%;
    /* height: 70vh; <- 이 새끼가 범인이야. 삭제하거나 아래처럼 바꿔 */
    height: auto !important; 
    min-height: 70vh; /* 최소 높이는 유지하되, 책 크기에 따라 늘어나게 함 */
    background-color: #7BC6B8 !important;
    display: flex;
    flex-direction: column; /* 세로로 쌓이게 함 */
    justify-content: center;
    align-items: center;
    position: relative !important; /* 선반의 기준점 */
    padding-bottom: 5% !important; /* 선반이 들어갈 아래쪽 여유 공간 */
}

/* [2] 각 줄(Row)의 위치 설정*/
#studio-visit-main1 { 
		position: relative !important;
    margin-top: 10% !important; 
		margin-bottom: 5% !important; 
}
#studio-visit-main2 { 
	position: relative !important;
    margin-top: 5% !important; 
}

#studio-visit-main3 { 
	position: relative !important;
    margin-top: 10% !important; 
}

/* [3] 책 바구니(Row)  */
/* #books, .studio-visit-main .wp-block-row {
    position: relative;
    width: 100%;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; 
    align-items: flex-end !important;
    justify-content: center !important; 
    margin: 5% auto !important;
    overflow: visible !important;
} */

/* [4] 책 아이템 */
#book1, #book2, #book3, #book4, #book5, #book6, #book7, 
.studio-sec-visit-col1, .studio-sec-visit-col2, .studio-sec-visit-col3 {
    flex-shrink: 0 !important; 
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
/* [5] 개별 책 사이즈 */

#book1 { 
transform: translateX(-15%) !important; 
    margin-top: 5% !important;
}
#book1 img {
    width: 20vw !important;
    box-shadow: 4px 0px 20px 0px #00000040;
}

#book2 {
    transform: translateX(15%) !important; 
    margin-top: 6.5% !important;
}
#book2 img {
    width: 21vw !important;
    box-shadow: 4px 0px 20px 0px #00000040;
}


#book3 { 
transform: translateX(-15%) !important; 
    margin-top: 25% !important;
}
#book3 img {
    width: 22vw !important;
    box-shadow: 4px 0px 20px 0px #00000040;
}

#book4 {
    transform: translateX(15%) !important; 
    margin-top: -3% !important;
}
#book4 img {
    width: 20vw !important;
    box-shadow: 4px 0px 20px 0px #00000040;
}


#book5 {
    transform: translateX(-20%) !important; /* 왼쪽으로 이동 */
    margin-top: -3% !important;
}
#book5 img {
    width: 22vw !important; /* 50% 축소 사이즈 */
    box-shadow: 4px 0px 20px 0px #00000040;
}

/* 가운데 책 */
#book6 {
    transform: translateX(0%) !important; /* 정중앙 */
    margin-top: 5% !important;
}
#book6 img {
    width: 22vw !important; /* 가운데 책을 살짝 크게 강조 가능 */
    box-shadow: 4px 0px 20px 0px #00000040;
}

/* 오른쪽 책 */
#book7 {
    transform: translateX(20%) !important; /* 오른쪽으로 이동 */
    margin-top: 37% !important;
}
#book7 img {
    width: 22vw !important;
    box-shadow: 4px 0px 20px 0px #00000040;
}



.shelf {
    position: absolute !important;
    bottom: 0 !important; /* 무조건 각 섹션의 바닥에 붙어라 */
    top: auto !important; /* 기존에 설정한 top 값들은 싹 다 무시 */
    left: 50% !important;
    transform: translateX(-50%) !important; /* 중앙 정렬 */
    width: 90%;
    border-bottom: 2px solid #000;
}

/* 개별 선반 위치 (이제 수치 똑같이 줘도 돼) */
#shelf1, #shelf2, #shelf3 {
    bottom: 20% !important; /* 바닥에서 2% 지점에 딱 붙임 */
    top: auto !important;
}

/*Each cover has a hover effect with opacity change*/
#book1:hover, #book2:hover, #book3:hover, #book4:hover,
#book5:hover, #book6:hover,
#book7:hover,
.studio-sec-visit-col1:hover, .studio-sec-visit-col2:hover, .studio-sec-visit-col3:hover{
	opacity:0.5;
}



.interview-icon img{
	  margin-bottom: 0;
    width: 6.5%;
}



.studio-article{
	width:80%;
	margin:5% auto;
}

.entry-title{
	margin-bottom: 0;
}

#about-interview, #about-resi-artist {
	width:100%;
	height: 3rem;
  position: fixed;
/* 	top:6.5%; */
	top:3rem;
  left: 0;
  background-color: white;
  border-bottom: 1px solid black;
  justify-content: space-between;
  z-index: 5;
	color:#8E0DFF !important;
	font-family: 'Pretendard-Regular';
	font-weight: 600;
}

.bolder-typo {
font-family: 'Pretendard-Bold';
}

#interview-final-para1, #interview-final-para2, #interview-final-para3{
	margin-bottom: 10%;
}

#about-interview figure,
#about-resi-artist figure{
	margin-bottom: 0 !important;
}
#about-interview figure img,
#about-resi-artist figure img{
  margin-bottom: 0 !important;
}
#col1-about-interview, #col2-about-interview, #col3-about-interview{
   display: flex;
	 width: 33.3333%;
   justify-content: center !important;
    
}

.visit-bold-typo{
	font-family: "Pretendard-Bold";
}

#mobile-move-btn{
	display:none;
}

#interview-main{
    width: 100%;
    height: 100vh;
    position: relative;
    top: 0;
    padding: 0;
    margin: 0;
    align-items: flex-start;
    padding-left:0;
	  padding-right:0;
	  gap: 0;
}
.interview-col{
	width: 33.33333%;
	background-color:white !important;
/* 	height: 100%; */
	padding-left: 3%;
  padding-right: 3%;
	-ms-overflow-style: none !important;
}

.interview-col::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

.interview-col p{
	position: relative;
	margin-top: 2%;
  margin-bottom: 5%;
}

.visit-img-caption{
 font-family:'Pretendard-Regular';
	font-size:0.8rem;
	margin-top:0.5%;
}

#interview-col1, #interview-col2{
	border-right:1px solid #272727;
}
#interview-col1, #interview-col2, #interview-col3{
	display:block;
	position:relative;
	height: 100%;
  overflow-y: scroll;
	scrollbar-width: none;
}

.interview-col h2{
	position: relative;
  margin-top: 38%;
	font-family: 'KoPub-Light';
	font-weight: 700;
}
.que{
	font-family: 'KoPub-Light';
	font-weight: 400;
}
#interview-col1:hover, #interview-col2:hover, #interview-col3:hover{
	background-color:#7BC6B8 !important;
}
#interview-col1:hover > #col1-h2, 
#interview-col2:hover > #col2-h2,
#interview-col3:hover > #col3-h2{
	color: #8E0DFF !important;
}

#intro-interview{
	color: #8E0DFF !important;
  position: relative;
  top: 4.5%;
	margin-bottom: 30%;
}
#interview-col1 img, #interview-col2 img,
#interview-col3 img{
	border-radius:30px;
	border: 1px solid #272727;
}
#interview-icon1, #interview-icon2{
	text-align:center;
}
#interview-icon1 img, #interview-icon2 img{
	border-radius:0;
	border: none;
}

#interview-col2{
	
}

#interview-col2 h2, #interview-col3 h2{
  margin-bottom: 11%;	
}

.info-text-border{
	border: 1px solid #272727;
	border-radius:20px;
	background-color:white !important;
	padding: 4.5% 6%;
}

#interview-col3{
	
}

/*RESIDENCY PAGE*/
#about-residency{
  width:100%;
	height: 3rem;
  position: fixed;
   top:3rem;
  left: 0;
  background-color: white;
  border-bottom: 1px solid black;
  justify-content: center;
  z-index: 1111;
	padding-left: 2%;
  padding-right: 2%;
}
#interview-left-arrow img, #interview-right-arrow img{
	margin-bottom:0;
}

#resi-left-arrow{
	width: 100%;
	position: relative;
	left: 100%;
}

#resi-right-arrow{
/* 	transform: rotateY(180deg); */
	width: 100%;
	position: relative;
	right: 100%;
}

#col1-about-resi-artist, #col2-about-resi-artist, #col3-about-resi-artist
{
	width:33.3333%;
	justify-content: center !important;
}

#about-res-title{
	 font-family: 'Pretendard-SemiBold';
	font-size:1rem;
	text-wrap: nowrap;
	color: #8E0DFF;
}
 #about-res-des{
	font-family: 'Pretendard-Regular';
	 font-size:1rem;
	text-wrap: nowrap;
}

#marquee-block {
  position: relative;
  width: 85vw;
  max-width: 100%;
  height: 100%;
  overflow-x: hidden;
	margin-left:2%;
}

#track {
  position: absolute;
  white-space: nowrap;
  will-change: transform;
  animation: marquee 32s linear infinite;
	height:100%;
	display: flex;
  align-items: center;
  
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}


#about-res-des{
	overflow-y: hidden;
/* 	font-weight:500; */
/* 	overflow-x: hidden; */
/* 	background: yellow; */
  width: 100%;
  margin-bottom:0rem;
/* 	animation: marquee 13s linear infinite forwards; */
}

#track:hover{
	animation-play-state: paused;
}

#interview-left-arrow img, #interview-right-arrow img{
	margin-bottom:0;
}

#interview-left-arrow{
	width: 33px;
	margin-left:1.8%;
}

#interview-right-arrow{
/* 	transform: rotateY(180deg); */
	width: 33px;
  margin-right:1.8%; 
}

#residency-whole-container{
	margin:0;
	padding:0;
	width:100%;
/* 	height:100%; */
	height:100vh;
	overflow-x:hidden;
	overflow-y:scroll;
  scroll-snap-type: y mandatory;
	scroll-behavior: smooth;
/* 	position: absolute;
  top: 0; */
	position: relative;
  top: 0%;
	scrollbar-width:none;
}
#residency-whole-container::webkit-scrollbar{
	display:none;
}
/* The dots/bullets/indicators */

#dotbox{
	display:flex;
	flex-direction:column;
	position:fixed;
	top:50%;
	left: 97%;
  height: 7rem;
  z-index: 1001;
  justify-content: space-between;
  align-items: flex-start;
}

.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: transparent !important;
  border-radius: 50%;
	border:1px solid white;
  display: inline-block;
  transition: background-color 0.6s ease;
}
/*dot alternative*/
/*dots container for landing*/
#post-773 #list-example{
	display:flex;
	flex-direction:column;
	position:fixed;
	top: 49%;
  left: 97%;
	height: 7rem;
/*   height: 5rem; */
  z-index: 1001;
  justify-content: space-between;
  align-items: flex-start;
	  border: none !important;
    width: 3%;
}

/*dots container for virtual residency*/
#list-example{
	display:flex;
	flex-direction:column;
	position:fixed;
	top:50%;
	left: 97%;
  height: 7rem;
  z-index: 1001;
  justify-content: space-between;
  align-items: flex-start;
	  border: none !important;
    width: 3%;
}
.list-group-item {
  cursor: pointer;
  height: 15px;
  width: 15px;
  background-color: transparent !important;
  padding: 0;
  border-radius: 50%;
	border:1px solid white;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.list-group-item.active {
    border-color:#fff;
	  border-width:1px;
	  background-color: white !important;
}
.list-group-item+.list-group-item {
	border-top-width: thin !important;
/*     border-top-width: initial !important; */
}

.list-group-item:first-child {
    border-top-left-radius: 50% !important;
    border-top-right-radius: 50% !important;
}

.list-group-item:last-child {
 border-bottom-left-radius: 50% !important;
    border-bottom-right-radius: 50% !important;
}

/* .list-group-item{
	  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: transparent !imporatnt;
  border-radius: 50%;
	border:1px solid white;
  display: inline-block;
  transition: background-color 0.6s ease;
} */


/* 
.active, .dot:hover {
  background-color: #717171;
}
 */

.res-section1, .res-section2, .res-section3, .res-section4, .res-section5 {
	width: 100%;
  height: 100vh;
	position: relative;
  top: 0%;
	scroll-snap-align: start;
	margin: 0;
  padding: 0;
	background-size:cover;
	background-repeat:no-repeat;
}

.res-section1{
	background-image: url("https://clofa.org/wp-content/uploads/2023/10/03_residency_list_01.png");
}
.res-section2{
	background-image: url("https://clofa.org/wp-content/uploads/2023/10/03_residency_list_02.png");
}
.res-section3{
	background-image: url("https://clofa.org/wp-content/uploads/2023/10/03_residency_list_03.png");
}
.res-section4{
	background-image: url("https://clofa.org/wp-content/uploads/2023/10/03_residency_list_04.png");
}
.res-section5{
	background-image: url("https://clofa.org/wp-content/uploads/2023/10/03_residency_list_05.png");
}

#residency-whole-container a{
	text-decoration:none !important;
	color:black !important;
}


#res-header-text1, #res-header-text2, #res-header-text3, #res-header-text4, #res-header-text5{
	font-family: 'Pretendard-Regular';
  font-size: 6.75rem;
  line-height: 1.2;
  font-weight: 700;
  color: black !important;
  position: relative;
  width: max-content;
  margin-left: auto;
  margin-right: auto;
	z-index:1000;
	margin-bottom: 0;
	text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black;
}

#res-header-text1{
	top:2rem;
}
#res-header-text2, #res-header-text3, #res-header-text4, #res-header-text5{
	top:7rem;
}

#res-subheader-text1{
	margin-top: 5rem;
	font-size: 5rem;
  line-height: 1.2;
  font-weight: 600;
  color: black !important;
  position: relative;
/* 	top: 40vh; */
  width: max-content;
  margin-left: auto;
  margin-right: auto;
	z-index:1000;
	margin-bottom: 0;
	text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black;
}

#res-subheader-text2, #res-subheader-text3, #res-subheader-text4, #res-subheader-text5{
	margin-top: 3.5rem;
	font-size: 5rem;
  line-height: 1.2;
  font-weight: 600;
  color: black !important;
  position: relative;
/* 	top: 40vh; */
  width: max-content;
  margin-left: auto;
  margin-right: auto;
	z-index:1000;
	margin-bottom: 0;
	text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black;
}
#res-subheader-text1{
	top:45vh;
}
#res-subheader-text2, #res-subheader-text3, #res-subheader-text4, #res-subheader-text5{
	top:56vh;
}

.frame-svg{
	  position: absolute;
/* 	  top: 6.5%; */
	  top:3rem;
    left: 0;
    width: 100%;
	  height: 94rem;
/* 	  height: 93.5vh; */
    z-index: 999;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
	    
	
}

.frame-svg img{
	  width: 100%;
    height: 100vh;
    object-fit: cover;
/*     margin-top: -0.5rem; */
/* 	height:100%; */
}

#list-item-1 figure.wp-block-image{
	max-width:100% !important;
}

/*SEARCH-RESULT PAGE*/
.new-search-result-main{
	position:relative;
	top:3rem;
	width:100%;
}
.res-bold{
	font-family: "Pretendard-Bold";
}
/*INDIVIDUAL RESIDENCY*/
/*Jeongin Kang*/
.page-template-default .page .page-id-2061 .custom-background .wp-custom-logo .wp-embed-responsive .understrap .understrap-has-sidebar{
-ms-overflow-style: none;
  scrollbar-width: none;
  overflow-y: hidden;	
}


#entire-cols{
	position: absolute;
	top: 6rem;
	left: 0;
	width: 100%;
	height: 101vh;
	margin: 0;
	padding: 0;
	gap: 0em;
	overflow-y: hidden;
}

.col-md-4{
	/*same with kang-maincol1*/
}

.kang-maincol1{
  background: white !important;
	width:40%;
	height: 100%;
  padding: 4% 2.75%;
	z-index: 0;
	overflow-x: hidden;

	overflow-y: scroll;
	-ms-overflow-style: none !important;
}

.kang-maincol2{
	     background: #F1EB81 !important;
	position: relative;
  width: 100%;
  height: 100%;
	margin-left:40%;
	
  /*don't set background-color white*/
  overflow-x:visible;
	overflow-y: scroll;
	-ms-overflow-style: none !important;
}

.kang-maincol1::-webkit-scrollbar, .kang-maincol2::-webkit-scrollbar {
  width: 0px;
 background: transparent;
}


.big-images{
	  position: relative;
    top: 4rem;
    left: 0%;
    width: 92%;
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
	  align-items: center !important;
}

.big-images figure{
/* 	  width: max-content; */
}

.big-images figure img{
	  margin-bottom: 0 !important;
	  width: 800px;
}
.resi-caption{
	font-family: 'Pretendard-Regular';
  font-weight: 300;
	font-size:0.75rem;
	margin-bottom: 1rem !important;
    margin-top: 0rem !important;
}
#resi-caption-final{
	margin-bottom:20%;
}

#doong{
/* 	position:absolute;
	z-index:2; */
	top:0%;
	left:0%;
	width:100%;
	height:100vh;
	margin:0;
	padding:0;
	overflow-y:hidden;
}

.kang-text, .kang-box{
	font-family: 'Pretendard-Regular';
  font-weight: 400;
}

#coggle-kang{
	position: absolute;
	top: 63%;
  left: 33%;
  box-shadow: 10px 14px 15px 0px #0000006E;
  z-index:4;
}

#kang-cog{
	height: 30vh;
/* 	height:37vh; */
}


.cog-circle1{
		background-color:#8E0DFF !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    z-index: 1111;
	  cursor: pointer;
    left: 94%;
    top: -8%;
}

.cog-circle1 img{
	  width: 65%;
    display: inline-block;
    position: relative;
    top: 15%;
    left: 15%;
}

.cog-x-btn1{
	display:none;
	background-color:#8E0DFF !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    z-index: 1222;
    left: 95%;
    top: 15%;
	cursor: pointer;
}

.x{
	  position: relative;
    top: 22%;
    left: 22%;
    width: 55%;
}
.overlayed-img{
	position: absolute;
    z-index: 3;
}
.overlayed-img > img{
	margin-bottom:0;
	line-height:0;
	box-shadow: 10px 14px 15px 0px #0000006E;

}
#i1{
	    top: 18%;
    left: 89%;
    width: 7%;
}

#i2{
      top: 15%;
    left: 83%;
    width: 7%;
}
#i3{
      top: 14%;
    left: 30%;
    width: 10%;
}
#i4{
     top: 25%;
    left: 43%;
    width: 8%;
}
#i5{
  top: 45%;
    left: 1%;
    width: 7%;
}
#i6{
	top: 32%;
    left: -24%;
    width: 20%;
}
#i7{
    top: 60%;
    left: 60%;
    width: 10%;
}
#i8{
	 top: 65%;
    left: 80%;
    width: 12%;
}
#i9{
	  top: 66%;
    left: 10%;
    width: 12%;
}
#i10{
	  top: 84%;
    left: 59%;
    width: 6%;
}
#i11{
	  top: 52%;
    left: 50%;
    width: 14%;
}

.kang-box{
	position:absolute;
	z-index:3; 
	padding:0.5% 1%;
	box-shadow: 10px 5px 14px 0px #00000066;
	background-color: white !important;
 
}

.kang-box p{
	font-size:0.85rem;
}
.final-para{
	margin-bottom:0;
}
.kang-box1{
	 width: 15%;	
	top:40%;
	left:30%;
}
.kang-box2{
	width: 12%;
    top: 59%;
  left: 85%;
}

#kang-text1, #kang-text2, #kang-text3, #kang-text4, #kang-text5, #kang-text6{
margin-bottom: 4%;
}

#kang-text1 span, #kang-text2 span, #kang-text3 span, #kang-text4 span, #kang-text5 span, #kang-text6 span{
	 -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
	padding-top: 0.1rem;
  padding-bottom: 0.1rem;
	line-height: 1.8;
}

#kang-text1 span{
  background-color: #F1EB81 !important;
    
}
#kang-text2 span{
	background-color:#7BC6B8 !important;
}
#kang-text3 span{
	background-color:#F2B46B !important;
}
#kang-text4 span{
	background-color:#cfcaff !important;
}
#kang-text5 span{
	background-color:#ffc0e9 !important;
}
#kang-text6 span{
	background-color:#c9e2cf !important;
}

#kang-text6{
	padding-bottom: 15%;
}

#kang-final-figure{
	margin-bottom: 17%;
}

/*MURPHY YUM RESIDENCY*/
.yum-entire-main{
	width:100%;
	height:100vh;
	padding:0;
	margin:0;
	overflow:hidden;
/* 	background-color: white !important; */
animation: gradEffect 7s linear infinite;
background-image: repeating-linear-gradientt(135deg,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5);
	
  background-image:-webkit-repeating-linear-gradient(135deg,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5);
	
 background-image: -moz-repeating-linear-gradient(135deg,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5,#ead8ee, #de9ef5,#ead8ee,#ffffff,#ead8ee,#de9ef5,#ead8ee,#ffffff,#ead8ee, #de9ef5);

 background-size: 400% 400%;
}

@-webkit-keyframes gradEffect {
  0% { background-position: 0% 0%; }
  100% { background-position: 100% 0%; }
}
@-moz-keyframes gradEffect {
  0% { background-position: 0% 0%; }
  100% { background-position: 100% 0%; }
}
@keyframes gradEffect {
  0% { background-position: 0% 0%; }
  100% { background-position: 100% 0%; }
}
   
#yum-entire-main{
	width:100%;
	height:100vh;
	overflow:hidden;
}
.yum-img{
	position:absolute;
	margin-bottom: 0;
}

.yum-img img{
	width:100%;
}

.yum-drag img{
	cursor: grab;
}

#yum1{
	    top: 16%;
    left: 84%;
    width: 9%;
}

#yum2{
	     top: 48%;
    left: 86%;
    width: 10.5%;
}
#yum3{
	top: 15%;
    left: 64%;
    width: 7.5%;
}

#yum4{
	top: 23%;
    left: 70%;
    width: 10%;
}    

#yum5{
	top: 64%;
    left: 37%;
    width: 10.5%;
}
#yum6{
	top: 30%;
  left: 4%;
  width: 12%;
}
#yum7{
	     top: 49%;
    left: 34%;
    width: 10%; 
}

#yum8{
	top: 38%;
    left: 80%;
    width: 10%;
}

#yum9{
	    top: 24%;
    left: 90%;
    width: 8%;
}
#yum10{
	top: 80%;
    left: 58%;
    width: 10.4%;
}

#yum11{
	top: 80%;
    left: 10%;
    width: 12.5%;
}

#yum12{
	   top: 71%;
    left: 85%;
    width: 10.8%;
}
#yum13{
	top: 76%;
    left: 42%;
    width: 7.5%;
}
#yum14{
	top: 19%;
    left: 50%;
    width: 13%;
}
#yum15{
	  top: 52%;
    left: 6%;
    width: 10.5%;
}
#yum16{
	top: 19%;
    left: 13%;
    width: 11%;
}

#yum17{
	  top: 30%;
    left: 38%;
    width: 12.4%;
}
#yum18{
	  left: 25%;
    top: 40%;
    width: 6%;
}

#yum19{
	  top: 26%;
    left: 28%;
    width: 8%;
}

#yum20{
	 left: 39%;
   top: 17%;
   width: 8%;
}
#yum21{
top: 39%;
    left: 7.5%;
    width: 12.5%;
}
#yum22{
	  left: 18%;
    top: 64%;
    width: 8%;
}
#yum16 img, #yum17 img, #yum18 img, #yum19 img, #yum20 img{
	border: 4px solid #000000;
}
#yum1 img, #yum2 img, #yum3 img, #yum4 img, #yum5 img,#yum6 img, #yum7 img, #yum8 img, #yum9 img, #yum10 img, #yum11 img, #yum12 img, #yum13 img, #yum14 img, #yum15 img, #yum21 img, #yum22 img{
	border: 4px dashed #8E0DFF;
}
#coggle-yum{
	position: absolute;
	top: 40%;
  left: 54%;
  box-shadow: 10px 14px 15px 0px #0000006E;

}

#yum-cog{
	height: 37vh;
}

#yum-cog .banners{
	display: none;
}

.cog-circle2{
	background-color:#8E0DFF !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    z-index: 1111;
	cursor: pointer;
	left: 94%;
  top: -5%;
}


.cog-circle2 img{
	  width: 65%;
    display: inline-block;
    position: relative;
    top: 15%;
    left: 15%;
}

.cog-x-btn2{
	display:none;
	background-color:#8E0DFF !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  z-index: 1222;
  left: 95%;
	top: 15%;
	cursor: pointer;
/*     top: 8%; */
}

#murphy-text{
	position:absolute;
	bottom:0;
	left:0;
	width:100%;

	padding: 0 2% 1% 2%;
}

#murphy-text p{
	font-family: 'KoPub-Light';
	font-weight: 400;
	text-decoration: underline !important;
}

/*BOWON KIM Virtual Residency*/

#bowon-main{
 position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
	top:6rem;
/*   top: 12.5%; */
  gap: 0;
}
.bowon-sec{
	position: relative;
	background-repeat:no-repeat;
	background-size:cover;
	left:0%;
	margin:0;
	padding:0;
	width:100%;
}

.bowon-sec figure{
	margin-bottom:0;
	margin-top: 0;
	/*margin-top없어도됨*/
}

.bowon-sec1{
  top:0%;
  height: auto;
}

.bottom-pos{
	position:absolute;
	top:0;
}

.bottom-pos3{
	position:absolute;
	bottom:-2rem;
}

.marquee-bo-block{
	overflow-x:hidden;
	position: relative;
}
.track2-ltr{
  white-space: nowrap;
  height: 100%;
  display: flex;
  align-items: center;
}

.track2-rtl{
  white-space: nowrap;
  height: 100%;
  display: flex;
  align-items: center;
}

.l-to-r, .r-to-l{
  white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
}

.l-to-r{
	animation: ltr 32s linear infinite;	
}

.l-to-r2{
  white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
		animation: ltr2 72s linear infinite;
}

.l-to-r3{
  white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
		animation: ltr2 140s linear infinite;
}

.l-to-r4{
  white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
		animation: ltr2 160s linear infinite;
}
.l-to-r5{
  white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
		animation: ltr2 230s linear infinite;
}
.r-to-l{
	animation: rtl 32s linear infinite;	
}

.r-to-l2{
	white-space: nowrap;
	will-change: transform;
	display: flex;
  align-items: center;
	animation: rtl2 100s linear infinite;	
}

@keyframes ltr {
  from { transform: translateX(0); }
  to { transform: translateX(50%); }
}

@keyframes ltr2 {
  from { transform: translateX(-50%); }
  to { transform: translateX(50%); }
}

@keyframes rtl {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes rtl2 {
  from { transform: translateX(50); }
  to { transform: translateX(-50%); }
}

.blue-bgr{
	background-color:#0057D1 !important;
	width:100%;
/* 	height:2.2rem; */
}

.blue-bgr-nomove{
	background-color:#0057D1 !important;
	width:100%;
} 

.blue-bgr-nomove p{
	color:#FF9FD9 !important;
	margin-bottom: 0;
	line-height: 1.6;
/*   padding: 0.2% 0.5% 0.25% 0.5%; */
}

.blue-bgr p{
	color:#FF9FD9 !important;
  line-height: 2.1;
}

.pink-bgr{
	background-color:#FF9FD9 !important;
	width:100%;
/* 	height:2.2rem; */
	
}
.pink-bgr p{
	color:#0057D1 !important;
  line-height: 2.1;
}

#no-move{
    height: auto;
}
#no-move p{
	    padding: 0.25% 0.5% 0.25% 0.5%;
    line-height: 1.55;
}

.bold-weight{
	font-weight:800 !important;
}

#bigger-font{
	 font-size: 1.4rem;
   line-height: 1.5;
}
.blue-bgr p, .pink-bgr p{
	font-family: 'Pretendard-Regular';
	font-size:1rem;
	margin-bottom: 0 !important;
/* 	overflow-y:hidden; */
}

.bo-img{
	display: inline-block !important;
    width: 100% !important;
}

.bo-img3{
	margin-bottom: 0%;
}

.bo-img img{
	margin-bottom: 0 !important;
    line-height: 0 !important;
    width: 100%;
}

.bowon-sec2{
	top:0%;
}

.bowon-sec3{
  top: 0%;
  left: 0%;
	background-color: #0057D1 !important;
  z-index: 0;
  height: 94vh;
  width: 100%;
	/*These are tricks to hide the coggle banner*/
} 

#coggle-bowon{
	width: 80%;
/*   height: 100vh; */
  height: 80%;
  position: absolute;
  top: 47.25%;
  left: 50%;
  transform: translate(-50%,-50%);
}

#bowon-cog-ban-hide-div{
	background-color: #0057D1 !important;
  width: 100%;
  height: 2rem;
  position: relative;
  z-index: 3;
}

#bowon-cog{
  height: 74vh;
  width: 100%;
  z-index: 2;
  position: relative;
  top: -2rem;
}

.cog-circle4{
		background-color:#8E0DFF !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    z-index: 1111;
	  cursor: pointer;
	  left: 95%;
    top: 264%;
/*     left: 92%;
    top: 5%; */
}

.cog-circle4 img{
	  width: 65%;
    display: inline-block;
    position: relative;
    top: 15%;
    left: 15%;
}

.cog-x-btn4{
	display:none;
	background-color:#8E0DFF !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  z-index: 1222;
  left: 95%;
  top: 264%;
	cursor: pointer;
}

.bowon-sec4, .bowon-sec5, .bowon-sec6, .bowon-sec7 {
  top:0%;
}

.no-space-btm{
	height: 100vh;}

/*Yoonah's Residency*/
#entire-yoonah{
	width:100%;
	height:100vh;
	position: absolute;
  top: 0%;
	left:0%;
	background-color: black !important;
	overflow:hidden;
}
.yoon-col1{
  width: 50%;
	height:90%;
/* 	background:yellow !important; */
	overflow: hidden;
}

.yoon-para{
	position: relative;
    top: 7rem;
    padding: 3.5% 15%;
    overflow: hidden;
    color: rgb(255,255,255,0.8) !important;
    line-height: 1.65;
    font-family: 'KoPub-Light';
	font-weight: 400;
}

.s-para{
	text-align:center;
}
.s-para1{
	animation: cinema 300s  infinite linear
}

/* .s-para18{
	background:orange !important;
}
 */
@keyframes cinema{
	0%{
		margin-top: 0px;
	}
	100%{
		margin-top: -500vh;
	}
}
/* @keyframes cinema{
	0%{
		margin-top: 0px;
	}
	16%{
		margin-top: -60px;
	}
	33%{
		margin-top: -120px;
	}
	50%{
		margin-top: -180px;
	}
	66%{
		margin-top: -120px;
	}
	82%{
		margin-top: -60px;
	}
	100%{
		margin-top: 0px;
	}
} */
.yoon-col2{
	
}

.floaty{
	position:absolute;
	display: inline-block;
}
.floaty img{
	margin-bottom:0rem !important;
	line-height: 0 !important;
}
.floaty1{
	top: 20%;
  left: 49%;
  width: 7%;
	animation: opacity1 4s infinite ease-in-out;
}

.floaty2{
  top: 20%;
  left: 58%;
  width: 6.5%;
	animation: opacity5 4s infinite ease-in-out;
}
.floaty3{
	top: 17%;
  left: 73%;
  width: 7%;
	animation: opacity3 4s infinite ease-in-out;
}
.floaty4{
	top: 17%;
  left: 81%;
  width: 7.5%;
	animation: opacity2 4s infinite ease-in-out;
}
.floaty5{
	top: 17%;
  left: 89.5%;
  width: 7.5%;
	animation: opacity4 4s infinite ease-in-out;
}
.floaty6{
	top: 37.5%;
  left: 87.5%;;
  width: 9.5%;
	animation: opacity5 4s infinite ease-in-out;
}

.floaty7{
	top: 51.5%;
  left: 87.5%;
  width: 9.5%;
	animation: opacity2 4s infinite ease-in-out;
}

.floaty8{
	top: 57%;
  left: 73%;
  width: 4.5%;
	animation: opacity1 4s infinite ease-in-out;
}
.floaty9{
	top: 57%;
  left: 63.5%;
  width: 8.5%;
	animation: opacity4 4s infinite ease-in-out;
}
.floaty10{
  top: 53%;
  left: 56%;
  width: 6.5%;
	animation: opacity2 4s infinite ease-in-out;
}
.floaty11{
	top: 85%;
  left: 50%;
  width: 8%;
	animation: opacity3 4s infinite ease-in-out;
}
.floaty12{
	top: 74.65%;
  left: 59%;
  width: 7%;
	animation: opacity5 4s infinite ease-in-out;
}
.floaty13{
	top: 74.65%;
  left: 67%;
  width: 7%;
	animation: opacity1 4s infinite ease-in-out;
}

@keyframes opacity1 {
    0% { opacity:1; }
    25%  { opacity:0.5; }
	  50%{opacity: 0.6; }
    100%   { opacity:0.8; }  
}

@keyframes opacity2 {
    0% { opacity:0.4; }
	  25%  { opacity:0.6; }
    50%  { opacity:0.8; }
    100%   { opacity:0.4; }  
}

@keyframes opacity3 {
    0% { opacity:0.7; }
	  25% { opacity:0.5; }
    50%  { opacity:0.4; }
    100%   { opacity:0.6; }  
}

@keyframes opacity4 {
    0% { opacity:0.4; }
	  25% { opacity:0.5; }
    50%  { opacity:0.8; }
    100%   { opacity:0.4; }  
}
@keyframes opacity5 {
    0% { opacity:0.3; }
	  25% { opacity:0.5; }
    50%  { opacity:0.8; }
    100%   { opacity:0.4; }  
}

.cog-circle3{
	background-color: #8E0DFF !important;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    position: absolute;
    z-index: 1111;
    cursor: pointer;
    left: 96%;
	  top:10%;
/*     top: -6%; */
}


.cog-circle3 img{
	  width: 65%;
    display: inline-block;
    position: relative;
    top: -4%;
    left: 17%;
}

.cog-x-btn3{
	display:none;
	background-color:#8E0DFF !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  z-index: 1222;
  left: 95%;
	top: 15%;
	cursor: pointer;
}

#coggle-yoonah{
	position: absolute;
	top: 73%;
  left: 77%;
  box-shadow: 10px 14px 15px 0px #0000006E;
	width:min-content;
}

#hiding-cog-bar{
	position:absolute;
	width:100%;
	height: 2rem;
  top: -0.5%;
	background-color: black !important;
/* 	border:yellow 1px solid; */
}

#yoonah-cog{
	height: 23vh;
  width: 20vw;
}

#doongdoong{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100vh;
}

.snow{
	width:6px;
	height:6px;
	border-radius:50%;
	background-color: white !important;
	position:absolute;
	z-index:2;
}

.snow1{
	top: 80%;
    left: 75%;
}

.snow2{
	top: 9%;
  left: 17%;
}

.snow3{
	top: 60%;
  left: 28%;
}

.snow4{
	top: 56%;
    left: 83%;
}

.snow5{
	top: 38%;
  left: 54%;
}

.snow6{
	 top: 69%;
   left: 10%;
}

.snow7{
	  top: 49%;
    left: 75%;
}

.snow8{
	top: 56%;
  left: 60%;
}

.snow9{
	top: 42%;
  left: 37%;
}

.snow10{
	top: 12%;
  left: 87%;
}

.snow11{
	  top: 71%;
    left: 51%;
}

.snow12{
	top: 74%;
  left: 93%;
}

.snow13{
	top: 20%;
  left: 78%;
}

.snow14{
	top: 76%;
  left: 60%;
}

.snow15{
	top: 38%;
  left: 80%;
}

.snow16{
	top: 43%;
  left: 60%;
}

.snow17{
	top: 24%;
  left: 10%;
}

.snow18{
	top: 80%;
  left: 30%;
}

.snow19{
	  top: 46%;
    left: 49%;
}

.snow20{
	  top: 25%;
    left: 65%;
}

.snow21{
	  top: 35%;
    left: 7.5%;
}

.snow22{
	  top: 49%;
    left: 15%;
}

/*Ahae Kim's Residency*/
.ahae-entire-vid{
	position: absolute;
  z-index: 2;
  top: 6rem;
  left: 0%;
  width: 100vw;
  height: 94vh;
  padding: 0;
  margin: 0;
}

#coggle-ahae{
	position: absolute;
	top: 73%;
  left: 29%;
	z-index:4;

}

#ahae-cog{
	height: 29vh;
  width: 24vw;
	box-shadow: 10px 14px 15px 0px #0000006E;
}

.cog-circle5{
	background-color:#8E0DFF !important;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    position: absolute;
    z-index: 1111;
	cursor: pointer;
	left: 94%;
  top: -5%;
}


.cog-circle5 img{
	  width: 65%;
    display: inline-block;
    position: relative;
    top: 15%;
    left: 15%;
}

.cog-x-btn5{
	display:none;
	background-color:#8E0DFF !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: absolute;
  z-index: 1222;
  left: 95%;
	top: 15%;
	cursor: pointer;
/*     top: 8%; */
}

#ahae-video{
	width:100%;
  height: 94%;
  position: absolute;
  left: 0%;
  top: 0%;
}
#ahae-video video{
	position: absolute;
	width: 101vw;
  top: 48%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.plyr__controls {
    background: transparent !important;
 }
.plyr__video-wrapper {
    background: transparent !important; 
}

.plyr--video {
    background: transparent !important;
}
.ahae-whole-col{
  position: relative;
  top: 6rem;
  left: 0%;
  width: 100%;
  height: 94vh;
  margin: 0;
  padding: 0;
  background: linear-gradient(180deg, #F7AAD4 18.82%, #289B7E 100%);
  align-items: flex-start !important;
}

.ahae-text-col{
	width: 23%;
	position: relative;
}

.ahae-text-col1{ 
  top: 6%;
	left:1.5%;
}

.ahae-text-col2{ 
  top: 14%;
	left:3%;
}

.ahae-text-col3{ 
	top: 8%;
	left:4%;
}
.ahae-text-col4{ 
  top: 6%;
  left: 5%;
}
   

.ahae-text-col p{
	color: #F7FF6C !important;
  font-size: 0.8rem;
}

#new-search{
	color:blue;
}


.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  padding: 0 !important;
  font-size: 13px !important;
  position: relative !important;
  top: -30px !important;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  color: black !important;
  filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}



@media only screen and (min-width: 320px) and (max-width: 800px) and (orientation: portrait) {
	
	.page-id-773{
   background-color: transparent !important;
	}
	
	.member-template-member{
   background-color: transparent !important;
	}	
	.member-template-member #page{
		background: #7BC6B8;
	}
	.page-id-49, .page-id-2061, .page-id-2633, .page-id-2501, .page-id-2503, .page-id-2217, .page-id-150, .page-id-60  {
		background-color: transparent !important;
	}
	/*스튜디오비짓*/
	.page-id-60 #page{
		overflow-x: hidden;
	}
	
	.page-id-60 .entry-footer{
		background: #7BC6B8;
	}     
	
	#wpadminbar{
		display:none;
	}
	#post-773 .entry-content{
/* 		height: 100%; */
	}
	.navbar-brand::after{
		font-size: 1.4rem;
    line-height: 1.4;
		text-align: center;
    left: 50%;
    top: -15%;
    transform: translate(-50%,50%);
	}
	
	#main-nav::after {
		left: 31.5%;
	}
	#main-nav::before {
		left: 63.75%;
	}

	
/* 	.fa [aria-hidden="true"] {
		display: block !important;
		visibility: visible !important;
	} */
	.navbar-toggler{
		border: none;
		position: absolute;
	}
	.navbar-toggler-icon {
		background-image: url("https://clofa.org/wp-content/uploads/2023/11/01_main_menu.svg") !important;
	}
	
	#navbarNavDropdown{
	  position: absolute;
    top: 3rem;
    background: #7BC6B8;
    width: 100%;
    height: auto;
	/*	position: absolute;
 		background: #7BC6B8;
    width: 75%;
    height: 100vh;
    top: 0;
    z-index: 1000; */
  }
	.navbar-collapse{
		z-index:2000;
	}
	
	.navbar-expand-md .navbar-nav {
    justify-content: space-between;
    flex-direction: column;
		align-items: flex-start;
    position: relative;
		width: 100%;
    left: 0%;
		margin-left: 0% !important;
	}
	
	.nav-link {
    color: #8E0DFF !important;
		font-weight: 700;
    font-size: 1.2rem;
		text-align: center;
}
	.astm-search-menu{
		width: 100%;
		position: relative;
    left: 0%;
		height: 2.8rem;
	}
	
	.is-form-style.is-form-style-3 label {
  width: 100% !important;
}
	
	.is-form-style.is-form-style-3 input.is-search-input {
    background: #7BC6B8 !important;
    color: #8E0DFF !important;
    font-weight: bold;
    font-size: 1.2rem !important;
    height: 2.4rem !important;
		border: none !important;
		width: 100px;
		margin-top: 6px !important;
		display: block;
		position: relative;
    margin-left: auto;
		margin-right: auto;
    text-align: center;
    display: block;

  }
	
/* 	#is-form-id-1480::placeholder{
	opacity: 1 !important;
		color: #8E0DFF !important;
} */
	#is-search-input-1480::placeholder{
	  opacity: 1 !important;
		color: #8E0DFF !important;
  }

		#is-search-input-1480:focus::placeholder{
	  opacity: 0 !important;
		color: transparent !important;
  }
	
	
	.is-menu.is-dropdown form {
    left: 0px;
    width: 100%;
		background: #7BC6B8 !important;
		border-bottom: 1px solid #8E0DFF !important;
	}
	
	.is-search-icon {
    background-color: #7BC6B8 !important;
		border:#8E0DFF !important;
	}
	
	.is-form-style button.is-search-submit {
  display: inline-block;
  position: absolute;
  right: 12%;
		top: 5px;
	}
	
	.is-form-style .is-search-submit path {
  
  fill: #8E0DFF;
}
	
	#landing-whole-container {
/*     position:relative;
		z-index: 1000; */
}
	
/* 	.section1, .section2, .section3, .section4, .section5 {
		height: 100%;
	} */

	#wrapper-navbar.foo{
		display: block;
/*     background: rgba(0,0,0,0.7); */
		background: rgba(39,39,39,0.9);
		position: absolute;
    top: 0;
    left: 0%;
    width: 100%;
    height: 100vh;
    margin-top: 0rem;
		z-index: 1000;
	}
	
	 .collapsing { 
		 transition-duration: 0s; 
	} 

	
#menu-item-152,#menu-item-1218, #menu-item-1216  {
    position: relative;
    left: 0%;
    width: 100%;
    border-bottom: 1px solid #8E0DFF;
}

/*버추얼레지던시 스튜디오 비짓*/	
	#menu-item-1218, #menu-item-1216 {
 
}
/*소셜아이콘들*/	
	#menu-item-3922 .nav-link, #menu-item-3921 .nav-link{
		color: white !important;
	}
	#menu-item-3922, #menu-item-3921{
		display: none;
		position: absolute;
		top: -34%;
	}
	#menu-item-3922{
    left: 72%;  
	}
	
	#menu-item-3921{
    left: 80%;
 }
	.fa {
    font: normal normal normal 20px/1 FontAwesome !important;
    font-size: 30px !important;
}
	
	.list-group-item + .list-group-item {
  border-top-width: thin !important;
}
	#post-773 #list-example {
    top: 38%;
    left: 91.5%;
		height: 6.5rem;
	}
	
	#post-773 .article1{
		margin-top: 4.5%;
	}
	
	#main-header-text {
    font-size: 3.4rem;
    line-height: 1.15;
    margin-top: -30%;
    width: 99%;
		/*26 dec 2023 following*/
    margin-left: auto !important;
    margin-right: auto !important;
		position: relative;
    left: -1.5%;
	}
	
	#main-header-text mark{
		background-color: rgba(0, 0, 0, 0);
    color: #7bc6b8;
    font-size: 80px;
    padding: 0 !important;
    display: inline-block;
    line-height: 0 !important;
	}
	
	.bottom-cir{
		position: relative;
    top: 16px;
	}
	
	.main-para-text {
		font-size: 1.15rem;
	}
	
	.des-article{
		top: -3.5%;
	}
	
	.description-header p {
     color: #8E0DFF !important;
    margin-top: 5%;
		font-size: 1.5rem;
    line-height: 1.4;
    margin-bottom: 0;
		
	
	}
	
	.description-detail p {
    width: 94%;
    font-size: 1rem;
    line-height: 1.55;
    margin-bottom: 0;
		margin-top: -5%;
		
		
}
	
		#hr-line{
		margin-top: 1em;
    margin-bottom: 1em;
	}
	
	.section3{
/* 		background-size: 190% 100%; */
		 background-size: 315% 100%;
    background-position-x: center;
	}
	

	.sec4-article {
    width: 80%;
    top: -1.5%;
		margin: 0% auto;
	}
	
	.description-header-4{
		display:none;
		margin-bottom: 1.6rem;
    margin-left: 1%;	
	}	

	.description-header-4, .description-subheader { 
    font-size: 1.2rem;
    line-height: 1.4;
	}
	
	.three-col {
    margin: 6% auto;
}
	
	.description-detail-4 {
    width: 100%;
    font-size: 0.9rem;
    line-height: 1.55;
		margin-top: -2% !important;
	}
	
	.section5 {
    background: #7BC6B8 !important;
  
/* 		display: block;
    position: relative; */
}
	
	.section5 .wp-block-group__inner-container{
		margin-left: initial !important;
		width: 100%;
	}
	
	.section5 p{
		margin-bottom: 20.5%;
    padding-top: 0;
    padding-bottom: 0vh;
/* 		padding-bottom: 16.5vh;
		margin-bottom: 0; */
	}

	#landfooter {
  background: #8E0DFF !important;
  left: 0%;
/*     position: absolute; */
    z-index: 999;
/*     bottom: 0; */
/*   bottom: -3%; */
/*   position: relative; */
/* 		height: 28vh; */
		height: 32vh;
		display: flex;
    align-items: center;
/*     bottom: 0vh; */
/* 	width: 105%; */
		/*왼쪽이 살짝 비어서*/
}
	
	#landfooter p a{
		text-decoration: underline;
		color: white;
	}
	
	
	#spon-logo{
	  justify-content: space-evenly;
    width: 75.5%;
    flex-wrap: wrap;
    top: 15%;
		left: 2%;
	}
	#spon1{
		width:95px;
	}
	#spon2{
		width:80px;
	}
	#spon3{
		width:95px;
	}
	#spon4, #spon5{
/* 		background: orange; */
    width: 80px;
	}
	
	#spon-logo img{
		width: 57%;
	}
	#spon1 img, #spon2 img, #spon3 img{
		width:62%;
	}
	
	#spon4{
	 margin-left:10%;
	}
	#spon5{
		margin-right:30%;
/* 		margin-right:10%; */
	}
	
	#spon4 img{
		margin-left: 40%;
	}
	#spon5 img{
		margin-left: 40%;
	}
	
	#spon-text{
		top: 13%;
	}
	
	#spon-text p {

    width: 96.5%;
    padding: 0 5%;
    font-size: 0.8rem;
    line-height: 145%;
}
	

	
/*Members 전체 모바일*/
		.page-template-members, .page-template-default{
		overflow-x:hidden;
		position: relative !important;
    z-index: 1000;
	}
	.page-template-members.foo, .page-template-default.foo{
				filter: grayscale(100%) brightness(0.7);
	}	

	.page-id-150 #page-wrapper{
		overflow-x:hidden;
/* 		max-height: 112vh; */
/* 		height: auto; */
	}
	
	.page-id-150 #container{
/* 		position: absolute; */
/* 		overflow:hidden; */
	}
	
	.page-template-members .wrapper{
		
	}	
	.page-template-members #page{
		  height: 100%;
/*       overflow-y: auto;  */
    overflow-y: hidden;
    background-color: #7bc6b8;
    position: fixed;
		width: 100%;
	}
	
/* 	.page-template-members{
		 position: relative !important;
     z-index: 1000;
	}
		.page-template-members .row.foo{
			filter: grayscale(100%) brightness(0.7);
	} */
	.page-template-members .row{
/* 		overflow-y: auto;
		height: auto; */
	}
	
	.header-part{
		 top: 5rem;
     width: 80%;
		 height: 3rem;
	}

	
	#title-members-page {
    font-size: 1.3rem;
    display: inline-block;
    width: 58%;
/*     background: yellow; */
    margin-bottom: 0;
	}
	
	#title-eng {
    margin-left: 2%;
}
	#title-number{
		margin-left:3%;
	}
	
	.filters{
	  left: 70%;
		top: -62.5%;
	}
	#alphabet{
		margin-right: 0%;
	}
	/*알파벳순서 필터*/
	#region{
		margin-right: 1.75%;
	}
	
	#thumbimage {
    padding-left: 3px;
}
	
	#members-page {
    width: 85.5%;
/* 		top: 3.75rem; */
		top: 4.5rem;
/* 		    overflow-y: auto; */
    height: auto;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    padding-right: 0;
    padding-left: 0;
    margin-bottom: 6.5rem;
		/*여기에 margin-bottom하면 other filters influence*/
	}
	
		#table-name-list{
			
	}
	
	.tr {
		max-height: 2.6rem;
	}
	
	#name-each-member {
    position: relative;
    left: 3%;
    width: 20%;
}
	#enname-each-member {
    position: relative;
    left: 17%;
		width: 38%;
}
	
	#line-mark5 {
		left: -20%;
	display: none;
}
	
	#province-each-member {
    position: relative;
    left: 25%;
    width: max-content;

}
	
	#position-mem {
    position: relative;
    left: 20%;
    width: max-content;
		text-align: left;
/* 		background: yellow; */
		display: none;
	}
	
	#allkeywords {
		display:none;
	}
	
	/*지역부분 필터*/
	.table-province {
    width: 85.5%;
/*     top: 3.25rem; */
		top: -2.5rem;
/* 		top: -3.3rem; */
/* 		margin-bottom: 6.5rem; */
	}
	
	#info-mem {
		padding-top: 1.2%;
    padding-bottom: 1.2%;     
	}
	
	#prov-allkeywords {
		display: none !important;
	}
	#name-mem {
    left: 5.9%;
/*     width: max-content; */
	  width: 42px;
/* 		background: yellow; */
	}
	#enname-mem {
/*     width: 36%; */
/*     background: orange; */
    left: 16.5%;
		width: 135px;
	}
	#prov-position-mem {
    left: 26%;
/*     width: 10%; */
		width: 53px;
/*     background: grey; */
}
	
	#line-mark6 {
/*     left: -65%; */
		left: -50%;
}
	
	
	/*썸네일 필터*/
	.table-thumbnail {
    width: 85.5%;
    top: -2.5rem;
/* 		top: -3.3rem; */
		height: auto;
		padding-bottom: 0%;
/* 		margin-bottom: 6.5rem; */
	}
	.img-gallery{
		height:100%;
/* 		height: 134vh; */
		height: auto;
		display: grid;
		overflow-y:auto;
		overflow-x:hidden;
		-ms-overflow-style: none;
    scrollbar-width: none;
		grid-template-columns: repeat(3, 1fr);
    grid-template-rows: 1fr;
		
/*     grid-template-columns: repeat(3, 29vw); */
		
/*     grid-template-rows: repeat(7, 32vw); */
/*     grid-template-rows: auto; */
    grid-column-gap: 5px;
    grid-row-gap: 0px;
    grid-auto-flow: dense;
/* 		grid-row-gap: 20px; */

	}

/* 	#thumb-frame{
	display: block;
    overflow-y: hidden;
    height: 82.5%;
	
	}
	
	 #thumb-frame::after {
     counter-increment: grid;
     content: counter(grid);
    }
	

	
	#thumb-frame img {
    object-fit: cover;
    width: 100%;
    height: auto;
    display: block;
}
	

	 */
	
		#thumb-frame a:hover:before{
		display: none; !important;
	}
	
	#thumb-frame::after {
    display: none !important;
}
	
#thumb-frame:nth-of-type(1)::after,
#thumb-frame:nth-of-type(2)::after,
#thumb-frame:nth-of-type(3)::after,
#thumb-frame:nth-of-type(4)::after,
#thumb-frame:nth-of-type(5)::after,
#thumb-frame:nth-of-type(6)::after,
#thumb-frame:nth-of-type(7)::after,
#thumb-frame:nth-of-type(8)::after,
#thumb-frame:nth-of-type(9)::after,
#thumb-frame:nth-of-type(10)::after,
#thumb-frame:nth-of-type(11)::after,
#thumb-frame:nth-of-type(12)::after,
#thumb-frame:nth-of-type(13)::after,
#thumb-frame:nth-of-type(14)::after,
#thumb-frame:nth-of-type(15)::after,
#thumb-frame:nth-of-type(16)::after,
#thumb-frame:nth-of-type(17)::after,
#thumb-frame:nth-of-type(18)::after,
#thumb-frame:nth-of-type(19)::after,
#thumb-frame:nth-of-type(20)::after,
#thumb-frame:nth-of-type(21)::after,
#thumb-frame:nth-of-type(22)::after,
#thumb-frame:nth-of-type(23)::after,
#thumb-frame:nth-of-type(24)::after,
#thumb-frame:nth-of-type(25)::after,
#thumb-frame:nth-of-type(26)::after,
#thumb-frame:nth-of-type(27)::after,
#thumb-frame:nth-of-type(28)::after,
#thumb-frame:nth-of-type(29)::after,
#thumb-frame:nth-of-type(30)::after,
#thumb-frame:nth-of-type(31)::after,
#thumb-frame:nth-of-type(32)::after,
#thumb-frame:nth-of-type(33)::after,
#thumb-frame:nth-of-type(34)::after,
#thumb-frame:nth-of-type(35)::after,
#thumb-frame:nth-of-type(36)::after,
#thumb-frame:nth-of-type(37)::after,
#thumb-frame:nth-of-type(38)::after,
#thumb-frame:nth-of-type(39)::after,
#thumb-frame:nth-of-type(40)::after,
#thumb-frame:nth-of-type(41)::after,
#thumb-frame:nth-of-type(42)::after,
#thumb-frame:nth-of-type(43)::after,
#thumb-frame:nth-of-type(44)::after,
#thumb-frame:nth-of-type(45)::after,
#thumb-frame:nth-of-type(46)::after,
#thumb-frame:nth-of-type(47)::after,
#thumb-frame:nth-of-type(48)::after,
#thumb-frame:nth-of-type(49)::after,
#thumb-frame:nth-of-type(50)::after,
#thumb-frame:nth-of-type(51)::after,
#thumb-frame:nth-of-type(52)::after,
#thumb-frame:nth-of-type(53)::after,
#thumb-frame:nth-of-type(54)::after,
#thumb-frame:nth-of-type(55)::after,
#thumb-frame:nth-of-type(56)::after,
#thumb-frame:nth-of-type(57)::after,
#thumb-frame:nth-of-type(58)::after,
#thumb-frame:nth-of-type(59)::after,
#thumb-frame:nth-of-type(60)::after,
#thumb-frame:nth-of-type(61)::after,
#thumb-frame:nth-of-type(62)::after,
#thumb-frame:nth-of-type(63)::after,
#thumb-frame:nth-of-type(64)::after,
#thumb-frame:nth-of-type(65)::after,
#thumb-frame:nth-of-type(66)::after {
	width: 29.4vw;
}

	
데스크탑 버전 순서 기준으로 맞춰서 작성할게:


#thumb-frame:nth-of-type(1)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "강정인";
}

#thumb-frame:nth-of-type(2)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "공은지";
}

#thumb-frame:nth-of-type(3)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "공지선";
}

#thumb-frame:nth-of-type(4)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "곽은지";
}

#thumb-frame:nth-of-type(5)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "권미정";
}

#thumb-frame:nth-of-type(6)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김다슬";
}

#thumb-frame:nth-of-type(7)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김남희";
}

#thumb-frame:nth-of-type(8)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김노을";
}

#thumb-frame:nth-of-type(9)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김보원";
}

#thumb-frame:nth-of-type(10)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김소진";
}

#thumb-frame:nth-of-type(11)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김수정";
}

#thumb-frame:nth-of-type(12)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김아해";
}

#thumb-frame:nth-of-type(13)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김용선";
}

#thumb-frame:nth-of-type(14)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김윤아";
}

#thumb-frame:nth-of-type(15)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김지혜";
}

#thumb-frame:nth-of-type(16)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김한솔";
}

#thumb-frame:nth-of-type(17)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김하녹";
}

#thumb-frame:nth-of-type(18)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "김현진";
}

#thumb-frame:nth-of-type(19)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "머피염";
}

#thumb-frame:nth-of-type(20)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "문채원";
}

#thumb-frame:nth-of-type(21)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "민효경";
}

#thumb-frame:nth-of-type(22)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "발레리 티 리";
}

#thumb-frame:nth-of-type(23)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박보오리";
}

#thumb-frame:nth-of-type(24)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박소은";
}

#thumb-frame:nth-of-type(25)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박소형";
}

#thumb-frame:nth-of-type(26)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박수정";
}

#thumb-frame:nth-of-type(27)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박연재";
}

#thumb-frame:nth-of-type(28)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박영지";
}

#thumb-frame:nth-of-type(29)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박해솔";
}

#thumb-frame:nth-of-type(30)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "박화연";
}

#thumb-frame:nth-of-type(31)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "백다래";
}

#thumb-frame:nth-of-type(32)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "서영";
}

#thumb-frame:nth-of-type(33)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "손유진";
}

#thumb-frame:nth-of-type(34)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "송유진";
}

#thumb-frame:nth-of-type(35)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "양세진";
}

#thumb-frame:nth-of-type(36)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "엄소완";
}

#thumb-frame:nth-of-type(37)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "안진선";
}

#thumb-frame:nth-of-type(38)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "어밍";
}

#thumb-frame:nth-of-type(39)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "연성";
}

#thumb-frame:nth-of-type(40)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "은산";
}

#thumb-frame:nth-of-type(41)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "옵저버";
}

#thumb-frame:nth-of-type(42)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "윤연우";
}

#thumb-frame:nth-of-type(43)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이수현";
}

#thumb-frame:nth-of-type(44)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이승희";
}

#thumb-frame:nth-of-type(45)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이우수";
}

#thumb-frame:nth-of-type(46)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이지수";
}

#thumb-frame:nth-of-type(47)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이지원";
}

#thumb-frame:nth-of-type(48)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이주은";
}

#thumb-frame:nth-of-type(49)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이채연";
}

#thumb-frame:nth-of-type(50)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "이혜윤";
}

#thumb-frame:nth-of-type(51)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "임성희";
}

#thumb-frame:nth-of-type(52)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "장수영";
}

#thumb-frame:nth-of-type(53)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "장연호";
}

#thumb-frame:nth-of-type(54)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "장한이";
}

#thumb-frame:nth-of-type(55)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "전미";
}

#thumb-frame:nth-of-type(56)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "전영현";
}

#thumb-frame:nth-of-type(57)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "제이리";
}

#thumb-frame:nth-of-type(58)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "정민정";
}

#thumb-frame:nth-of-type(59)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "정원";
}

#thumb-frame:nth-of-type(60)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "조미예";
}

#thumb-frame:nth-of-type(61)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "조영지";
}

#thumb-frame:nth-of-type(62)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "조윤아";
}

#thumb-frame:nth-of-type(63)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "채경서";
}

#thumb-frame:nth-of-type(64)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "최령은";
}

#thumb-frame:nth-of-type(65)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "허은선";
}

#thumb-frame:nth-of-type(66)::after {
	position: absolute;
	background: #8E0DFF !important;
	color: white;
	text-align: center;
	height: 1.2rem;
	font-size: 0.8rem;
	display: flex;
	align-items: center;
	justify-content: center;
	content: "황해연";
}


	
	#thumb-frame:nth-of-type(1)::after, #thumb-frame:nth-of-type(2)::after, #thumb-frame:nth-of-type(3)::after {
	top: 24.3vw;
}

#thumb-frame:nth-of-type(4)::after, #thumb-frame:nth-of-type(5)::after, #thumb-frame:nth-of-type(6)::after {
	top: 58.3vw;
}

#thumb-frame:nth-of-type(7)::after, #thumb-frame:nth-of-type(8)::after, #thumb-frame:nth-of-type(9)::after {
	top: 92.3vw;
}
#thumb-frame:nth-of-type(10)::after, #thumb-frame:nth-of-type(11)::after, #thumb-frame:nth-of-type(12)::after {
	top: 126.3vw;
}
#thumb-frame:nth-of-type(13)::after, #thumb-frame:nth-of-type(14)::after, #thumb-frame:nth-of-type(15)::after {
	top: 160.3vw;
}
#thumb-frame:nth-of-type(16)::after, #thumb-frame:nth-of-type(17)::after, #thumb-frame:nth-of-type(18)::after {
	top: 194.3vw;
}
#thumb-frame:nth-of-type(19)::after, #thumb-frame:nth-of-type(20)::after, #thumb-frame:nth-of-type(21)::after {
	top: 228.3vw;
}
#thumb-frame:nth-of-type(22)::after, #thumb-frame:nth-of-type(23)::after, #thumb-frame:nth-of-type(24)::after {
	top: 262.3vw;
}
#thumb-frame:nth-of-type(25)::after, #thumb-frame:nth-of-type(26)::after, #thumb-frame:nth-of-type(27)::after {
	top: 296.3vw;
}
#thumb-frame:nth-of-type(28)::after, #thumb-frame:nth-of-type(29)::after, #thumb-frame:nth-of-type(30)::after {
	top: 330.3vw;
}
#thumb-frame:nth-of-type(31)::after, #thumb-frame:nth-of-type(32)::after, #thumb-frame:nth-of-type(33)::after {
	top: 364.3vw;
}
#thumb-frame:nth-of-type(34)::after, #thumb-frame:nth-of-type(35)::after, #thumb-frame:nth-of-type(36)::after {
	top: 398.3vw;
}
#thumb-frame:nth-of-type(37)::after, #thumb-frame:nth-of-type(38)::after, #thumb-frame:nth-of-type(39)::after {
	top: 432.3vw;
}
#thumb-frame:nth-of-type(40)::after, #thumb-frame:nth-of-type(41)::after, #thumb-frame:nth-of-type(42)::after {
	top: 466.3vw;
}
#thumb-frame:nth-of-type(43)::after, #thumb-frame:nth-of-type(44)::after, #thumb-frame:nth-of-type(45)::after {
	top: 500.3vw;
}
#thumb-frame:nth-of-type(46)::after, #thumb-frame:nth-of-type(47)::after, #thumb-frame:nth-of-type(48)::after {
	top: 534.3vw;
}
#thumb-frame:nth-of-type(49)::after, #thumb-frame:nth-of-type(50)::after, #thumb-frame:nth-of-type(51)::after {
	top: 568.3vw;
}
#thumb-frame:nth-of-type(52)::after, #thumb-frame:nth-of-type(53)::after, #thumb-frame:nth-of-type(54)::after {
	top: 602.3vw;
}
#thumb-frame:nth-of-type(55)::after, #thumb-frame:nth-of-type(56)::after, #thumb-frame:nth-of-type(57)::after {
	top: 636.3vw;
}
#thumb-frame:nth-of-type(58)::after, #thumb-frame:nth-of-type(59)::after, #thumb-frame:nth-of-type(60)::after {
	top: 670.3vw;
}
#thumb-frame:nth-of-type(61)::after, #thumb-frame:nth-of-type(62)::after, #thumb-frame:nth-of-type(63)::after {
	top: 704.3vw;
}
#thumb-frame:nth-of-type(64)::after, #thumb-frame:nth-of-type(65)::after, #thumb-frame:nth-of-type(66)::after {
	top: 738.3vw;
}

	
패턴 보면 3의 배수+1이 `left: 0%`, 3의 배수+2가 `left: 33.6%`, 3의 배수가 `left: 67.55%`야:

```css
#thumb-frame:nth-of-type(1)::after, #thumb-frame:nth-of-type(4)::after, #thumb-frame:nth-of-type(7)::after,
#thumb-frame:nth-of-type(10)::after, #thumb-frame:nth-of-type(13)::after, #thumb-frame:nth-of-type(16)::after,
#thumb-frame:nth-of-type(19)::after, #thumb-frame:nth-of-type(22)::after, #thumb-frame:nth-of-type(25)::after,
#thumb-frame:nth-of-type(28)::after, #thumb-frame:nth-of-type(31)::after, #thumb-frame:nth-of-type(34)::after,
#thumb-frame:nth-of-type(37)::after, #thumb-frame:nth-of-type(40)::after, #thumb-frame:nth-of-type(43)::after,
#thumb-frame:nth-of-type(46)::after, #thumb-frame:nth-of-type(49)::after, #thumb-frame:nth-of-type(52)::after,
#thumb-frame:nth-of-type(55)::after, #thumb-frame:nth-of-type(58)::after, #thumb-frame:nth-of-type(61)::after,
#thumb-frame:nth-of-type(64)::after {
	left: 0%;
}
#thumb-frame:nth-of-type(2)::after, #thumb-frame:nth-of-type(5)::after, #thumb-frame:nth-of-type(8)::after,
#thumb-frame:nth-of-type(11)::after, #thumb-frame:nth-of-type(14)::after, #thumb-frame:nth-of-type(17)::after,
#thumb-frame:nth-of-type(20)::after, #thumb-frame:nth-of-type(23)::after, #thumb-frame:nth-of-type(26)::after,
#thumb-frame:nth-of-type(29)::after, #thumb-frame:nth-of-type(32)::after, #thumb-frame:nth-of-type(35)::after,
#thumb-frame:nth-of-type(38)::after, #thumb-frame:nth-of-type(41)::after, #thumb-frame:nth-of-type(44)::after,
#thumb-frame:nth-of-type(47)::after, #thumb-frame:nth-of-type(50)::after, #thumb-frame:nth-of-type(53)::after,
#thumb-frame:nth-of-type(56)::after, #thumb-frame:nth-of-type(59)::after, #thumb-frame:nth-of-type(62)::after,
#thumb-frame:nth-of-type(65)::after {
	left: 33.6%;
}
#thumb-frame:nth-of-type(3)::after, #thumb-frame:nth-of-type(6)::after, #thumb-frame:nth-of-type(9)::after,
#thumb-frame:nth-of-type(12)::after, #thumb-frame:nth-of-type(15)::after, #thumb-frame:nth-of-type(18)::after,
#thumb-frame:nth-of-type(21)::after, #thumb-frame:nth-of-type(24)::after, #thumb-frame:nth-of-type(27)::after,
#thumb-frame:nth-of-type(30)::after, #thumb-frame:nth-of-type(33)::after, #thumb-frame:nth-of-type(36)::after,
#thumb-frame:nth-of-type(39)::after, #thumb-frame:nth-of-type(42)::after, #thumb-frame:nth-of-type(45)::after,
#thumb-frame:nth-of-type(48)::after, #thumb-frame:nth-of-type(51)::after, #thumb-frame:nth-of-type(54)::after,
#thumb-frame:nth-of-type(57)::after, #thumb-frame:nth-of-type(60)::after, #thumb-frame:nth-of-type(63)::after,
#thumb-frame:nth-of-type(66)::after {
	left: 67.55%;
}
```
	
	

	/*멤버세부페이지*/
	.member-template {
    position: fixed !important;
    z-index: 1000;
}
	.member-template.foo {
		filter: grayscale(100%) brightness(0.7);
	}	
	.cv-btn, .statement-btn{
		color: black !important;
		text-decoration: none !important;
	}
	
	#member-row {
    position: relative;
/*     top: 1.35rem; */
		top:0;
    height: 100vh;
    display: block;
	 overflow-y: auto;
	}
	/*멤버 각 스무분들*/
	.postid-73 #content, .postid-75 #content, .postid-76 #content, .postid-459 #content, .postid-460 #content, .postid-461 #content, .postid-462 #content, .postid-463 #content, .postid-464 #content, .postid-465 #content, .postid-734 #content, .postid-754 #content, .postid-3936 #content, .postid-4225 #content, .postid-4243 #content,.postid-4262 #content,.postid-4280 #content,.postid-4295 #content,.postid-4313 #content, .postid-4331 #content {
    overflow: auto;
}
	
	.arrows {
    margin-bottom: -6.5%;
		position: relative;
    top: 0.3rem;
}
	
	.basic-sec {
    font-size: 1.25rem;
/*     width: 48%; */
		justify-content: space-between;
		font-size: 1rem;
	}
	.name, .eng-name{
    font-size: 1.25rem;
}
	.artist-position, .artist-province {
		font-size: 1rem;
	}
	
	.basic-sec1, .basic-sec2{
		margin-bottom: 6%;
	}
	
	.basic-sec1 {
		width: 100%;
		/*영문이름짧으신분들에겐 이 너비가좀 넓은데 황해연님같은 경우땜에 어쩔수없음*/
    margin-left: -0.5%;
    margin-bottom: 4%;
    display: flex;
    flex-direction: row !important;
		justify-content: center;
	}
	
	.basic-sec2 {
		width: 30%;
    margin-right: 10%;
    text-align: right;
    position: absolute;
    display: flex;
    flex-direction: row !important;
		justify-content: start;
/* 		top: 6.8rem; */
		top: 7.2rem;
/*     top: 7%; */
		
	}	
	
	.basic-sec1 .name{
		margin-right: 4%;
	}
	
	.basic-sec2 .artist-position{
		margin-left:9%;
	}
	
	.basic-sec-box{
		 border-bottom: 1px solid #272727;
		margin-bottom: 4.25%;
	}
	
	.artist-bio {
    top: 2rem;
		font-size: 0.875rem;
	}
	
	.artist-keywords {
		top: 2.2rem;
	}
	
	.cv-and-statement {
    top: 2.25rem;
}
	
	#single_topic {
		margin-bottom: 10%;
/*     margin-bottom: 7%; */
}
		
	.description-col {
    padding: 3rem 8% 0% 7.5%;
    width: 100%;
		height:auto;
    position: relative;
/* 		top: 0.5%; */
	  top: 1rem;
		overflow-y: hidden;
	}
	
	.cv {
    padding-bottom: 0%;
}
	
	.artist-statment {
    padding-bottom: 0%;
		height: auto;
    padding-bottom: 30%;
}
	
	.gallery-col{
		position: absolute;
		width: 100%;
		overflow-y: hidden;
    height: auto;
	  padding-bottom: 7rem;
	}
	.col-8{
		 align-items: center;
		 margin-top: 2.25rem;
	}
	
	.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption)::before {
   display: none;
   }
	
/* 캡션 있는 이미지의 블러 제거 */
/* figure.wp-block-image,
figure.wp-block-image img,
figure.wp-block-image figcaption {
  filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
  opacity: 1 !important;
  image-rendering: auto !important;
  -webkit-filter: none !important;
  -webkit-backdrop-filter: none !important;
} */

/* 이미지 강제 리사이즈 방지 */
figure.wp-block-image img {
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
}
	
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
  padding: 0 8% !important;
  font-size: 12px !important;
  position: relative !important;
  top: -10px !important;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  color: black !important;
  filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
}
/* 
.wp-element-caption {
  padding: 0 !important;
  font-size: 12px !important;
  position: relative !important;
  top: -10px !important;
  border: none !important;
  box-shadow: none !important;
  background: none !important;
  color: black !important;
  filter: none !important;
  backdrop-filter: none !important;
  text-shadow: none !important;
} */


/* 	padding: 8px 8px 2px 8px;
	
} */
	
	
	/*스튜디오비짓*/
	.page-id-60{
		overflow-y: hidden;
	}
	
/* 	#post-60{
		background-color: #7BC6B8 !important;
		position: relative;
    top: 3rem;
    height: auto;
    overflow-y: hidden;
		
		
	} */
	
	.post-60 .entry-title{
		display: none;
	}
	
	.page-id-60 #page-wrapper
	{
		background-color: #7BC6B8 !important;
		position: fixed;
		overflow-y: auto;
		overflow-x: hidden;
		top: 0;
/* 		top: 6rem; */
	}
	.page-id-60 .row{
	display: block;
    position: relative;
    top: 6rem;
		background-color: #7BC6B8 !important;
	}
	
	#about-studio-visit{
    width: 100%;
    display: block;
	}
	
	#about-visit-title{
    width: 23%;
    font-size: 0.95rem;
    flex-grow: 0 !important;
/*     background: orange; */
    display: inline-block;
    position: relative;
    left: 0%;
    top: 27%;
    margin-left: 3%;
    margin-right: 1.5%;
	} 
	
	#longinfo-studio-visit{
	  font-size: 0.95rem;
    display: inline-block;
    position: absolute;
    left: 28%;
    top: 31%;
    overflow-x: hidden;
		}
	

	#visit-track{
		white-space: nowrap;
		height: 100%;
		display: flex;
		align-items: center;
	}

	#about-des{
		/*#visit-track 의 h2*/
		font-size:0.95rem;
		white-space: nowrap;
		will-change: transform;
		display: flex;
		align-items: center;
		animation: rtl 22s linear infinite;
}
	
	/*Mobile-Studio Visit Main*/
	
	.whole-books-box{
		width: 100%;
    position: relative;
    top: 0rem;
    left: 0;
    overflow-y: scroll;
    overflow-x: hidden;
/*     flex-wrap: nowrap; */
    height: auto;
}

	.studio-visit-main {
		position: relative;
/* 		top: 1rem; */
		width:100%;
    height: 100%;
/*   overflow-y: hidden; */
	background-color: #7BC6B8 !important;
	display:flex;
	justify-content:center;
	align-items: center;
	scrollbar-width:none;
	}
	
	#studio-visit-main1 {
		display: flex;
		flex-direction: column !important;
		margin-top: 0%;
}
	
	 #studio-visit-main1 .wp-container-core-group-is-layout-6 {
  flex-wrap: wrap;
  justify-content: space-between;
		 flex-direction: column !important;
}
	
#book1, #book2, #book3, #book4, #book5, #book6, #book7 {
    text-align: center;
    margin-left: 0 !important;
    transform: none !important; 
    display: block;
    width: 100%;
}

/* [2] 책 사이의 간격 (개별 마진) */
#book2, #book5 {
    margin-top: 5%;
}

#book3 {
    margin-top: 0px !important; 
}
	
#book4 {
    margin-top: 80px !important; 
}

#book6 {
    margin-top: 80px !important; 
}
	
#book7 {
    margin-top: 80px !important; 
}
	
/* [3] 모든 책 이미지: 너비 100% 통일 */
#book1 img, #book2 img, #book3 img, #book4 img, #book5 img, #book6 img, #book7 img {
    width: 65% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
}
	
	
		#books-1 {
		background-color: #7BC6B8 !important;
    position: relative;
		flex-direction: column;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    top: 0%;
		margin-top: 3%;
/* 		margin-top: 30%; */
		padding-bottom: 0%;
}

	
	
		#books-2 {
    position: relative;
		flex-direction: column;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
		margin-top: 0px !important;
		padding-bottom: 7.5%;
}

	
	#books-3 {
		background-color: #7BC6B8 !important;
    position: relative;
		flex-direction: column;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    margin-left: auto;
    margin-right: auto;
    top: 0%;
		margin-top: 0%;
/* 		margin-top: 30%; */
		padding-bottom: 0%;
}

	.studio-sec-visit-col1 {
    position: relative;
    background-color: #7BC6B8 !important;
    width: 60%;
		flex-grow: 0 !important;
}
	
	.studio-sec-visit-col2 {
		width: 49%;
    flex-grow: 0 !important;
	}	
	.studio-sec-visit-col3 {
		width: 65%;
		flex-grow: 0 !important;
	}
	
	.studio-sec-visit-col1, .studio-sec-visit-col2, .studio-sec-visit-col3 {
	  margin-bottom: 5% !important;
	}
	
	.shelf {
		display:none;
	}
	
	/*스튜디오 비짓 인터뷰*/
	/*전체적으로 스크롤링되면서 패런트 글씨보이는등의 문제 고치는것*/
	.page-id-1098{
		position: relative !important;
    overflow: hidden;
	}
	#about-interview{
		
	}
	
	#about-interview p{
		font-size: 0.99rem;
		font-weight: normal !important;
	}
	
	#col1-about-interview, #col3-about-interview {
		visibility: hidden;
	}
	#col2-about-interview{
		width: 170%;
	}
	
	#mob-non1,#mob-non2,#mob-non3,#mob-non4,#mob-non5,#mob-non6, .about-circle, .about-circle-right{
		display:none;
	}
	
	#about-interview figure{
		width: 22px;
	}
	
	#intervieww-left-arrow, #intervieww-right-arrow{
		display: flex;
	align-items: center;
	}
	
/* 	#mobile-move-btn{
		display: flex;
    align-items: flex-start;
		justify-content: space-around;
    position: fixed;
    top: 16%;
    left: 82%;
    z-index: 5;
		width: 24px;
    height: 104px;
	}	
	
	#back-top1, #back-top2, #back-top3{
		border-radius: 50%;
    background: #8E0DFF !important;
		width:28px;
		height:28px;
	} */
	
	#interview-main{
/* 		flex-direction: column; */
    overflow-y: auto !important;
    overflow-x: hidden;
    display: block;
		top: 6rem;
	}
	
	#interview-col1, #interview-col2, #interview-col3 {
		width: 100%;
/* 		height: 100%; */
/* 		height: 100vh; */
		background: #7BC6B8 !important;
		overflow-y: initial;
		z-index:3;
	}
	#interview-col1{
		position: relative;
    top: 0%;
	}	
		
	#interview-col1{
		height: auto;
	}
	
	#interview-col2, #interview-col3{
		height: auto;
	}
	
	#interview-col3{
		margin-bottom: 11.5rem;
	}
	.interview-col h2 {
/*     width: 50%; */
    margin-left: auto;
    margin-right: auto;
		display: block;
		z-index: 4;
/* 	  margin-top: 20%; */
	}
	
	/*첫번째콜럼 h2 마진탑 조정*/
	#col1-h2{
/* 		width: 60%; */
    margin-left: auto;
    margin-right: auto;
		display: block;
		z-index: 4;
	  margin-top: 15%;
	}
	
		/*두번째콜럼 h2 마진탑 조정*/
	#col2-h2, #col3-h2{
    margin-left: auto;
    margin-right: auto;
		display: block;
		z-index: 4;
	  margin-top: 20%;
	}
	
	#col1-about-interview p, #col2-about-interview p{
	font-family: 'Pretendard-Regular';
/* 	font-weight:600; */
		}
	
	#col3-about-interview p{
	font-family: 'Pretendard-Regular';
	margin-left: -7%;
		}	
	
	#interview-final-para1, #interview-final-para2, #interview-final-para3 {
    margin-bottom: 5%;
}
	.interview-img{
		 display: flex !important;
    justify-content: center !important;
    margin-left: -0.5% !important;
	}
	
	#interview-col1 img, #interview-col2 img, #interview-col3 img {
    border-radius: 15px;
    border: 1px solid #272727;
    width: 90%;
}
	#intro-interview{
		 margin-bottom: 14%;
     margin-top: 7%;
	}
	
	.interview-col p {
    width: 90%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
	
	
	.visit-img-caption {
    font-family: 'Pretendard-Regular';
    font-size: 0.8rem;
    margin-top: 2% !important;
    margin-bottom: 3.5% !important;
}
	
	#interview-icon1 img, #interview-icon2 img {
    border: none !important;
    width: 6.5% !important;
		margin-bottom: 0;
	}
	
#mobile-interview-final {
    margin-bottom: 70%;
}
	
	
	/*버추얼 레지던시*/
	
	#post-49 #list-example {
    top: 45%;
    left: 91.5%;
    height: 6.5rem;

	}
	#about-res-title, #about-res-des{
		font-size: 0.95rem;
/* 		font-weight: 600 !important; */
	}
	
	#about-res-title{
		 width: 36%;
		 margin-left: 1%;
		color: #8E0DFF !important;

		
	}
	
	#about-residency #marquee-block {
		margin-left: 0%;
	}
	
	.res-section1, .res-section2, .res-section3, .res-section4, .res-section5 {
/* 		background-size: 500% 100%; */
    background-position-x: 5%;
	}
	
	.frame-svg {
    top: 2rem;
		width: 125%;
	}
	.frame-svg img {
    width: 100%;
/*     height: 85vh; */
		height: 93vh;
/* 		height: 90vh; */
    margin-top: 5%;
	}
	
	#res-header-text1, #res-header-text2, #res-header-text3, #res-header-text4, #res-header-text5 {
    font-size: 4.5rem;
		line-height: 1.2;
	}
	
	#res-subheader-text1, #res-subheader-text2, #res-subheader-text3, #res-subheader-text4,#res-subheader-text5 {
    margin-top: 5rem;
		font-size: 2.35rem;
	}
	
	#res-subheader-text1 {
/*     top: 37.5vh; */
		/*14vh올림*/
		top: 26vh;
 }
	#res-subheader-text2, #res-subheader-text3, #res-subheader-text4, #res-subheader-text5{
/* 		top: 47.5vh; */
		/*14vh올림*/
		top: 36vh;
	}
	
	/*강정인님 레지던시*/
	
	#col1-about-resi-artist, #col3-about-resi-artist {
		display:none;
/*     width: 66.7%;
    justify-content: center !important; */
}
	
	#col2-about-resi-artist{
		width:100%;
	}
	
	#about-resi-artist figure{
		display: flex;
    align-items: center;
	}
	.circle-about{
		position: relative;
		visibility: hidden;
	}
	.circle-about1{
		
    left: 16.5%;
	}
	.circle-about2{
    right: 16.5%;
	}	
	
	#about-resi-artist p{
		font-size: 1.5rem;
		font-weight: normal !important;
	}
	
	#col2-about-resi-artist .bolder-typo  {
		font-family: 'Pretendard-SemiBold';
		font-weight: 500 !important;
	}
	
	#col2-about-resi-artist .bolder-typo strong{
		font-weight: normal !important;
	}
	
	#col2-about-resi-artist p{
	font-size: 0.99rem;
/* 		font-weight: 600; */
	}
	
	.kang-maincol1 {
    background: white !important;
		width: 96%;
	}
	
	.kang-text{
		font-size: 0.85rem;
	}
	
	.kang-box1 {
    width: 52%;
    top: 38%;
    left: 28%;
}
	.kang-box2 {
    width: 40%;
    top: 92%;
    left: 50%;
}
	.resi-caption {
		font-size: 0.7rem;
	}
	.kang-box p{
		font-size: 0.7rem;
	}
	
	#i1 {
    top: 18%;
    left: 85%;
    width: 9%;
}
	
	#i2 {
    top: 16%;
    left: 79%;
    width: 10%;
}
	
	#i3 {
    top: 17%;
    left: 31%;
    width: 20%;
}
	
	#i4 {
        top: 24%;
    left: 54%;
    width: 15%;
}
	
	#i5 {
    top: 52%;
    left: 2%;
    width: 18%;
}
	#i11 {
    top: 50%;
    left: 60%;
    width: 27%;
}
	
	
	#coggle-kang {
    top: 52.5%;
		left: 9%;
	}
	
	.cog-circle1 {
    width: 36px;
    height: 36px;
    left: 94%;
		top: -7%;
	}
	
	.cog-x-btn1 {
    width: 36px;
    height: 36px;
    left: 85%;
		top: 18%;
	}
	
	.x {
		top: 13%;
	}
	
	/*김보원님 레지던시*/
	/*김아해님 레지던시*/
	#coggle-ahae{
	  top: 30%;
    left: 10%;
	}
	   
	
	#ahae-cog {
    height: 30vh;
		width: 79vw;
	}

		.cog-circle5 {
    width: 36px;
    height: 36px;
    left: 94%;
		top: -7%;
	}
	
	.cog-x-btn5 {
    width: 36px;
    height: 36px;
    left: 85%;
		top: 18%;
	}
	
#ahae-video {
    width: 100%;
    height: 94%;
    position: absolute;
    left: 0%;
    top: 0%;
}
	
#ahae-video video {
	  top: -6%;
    height: 100vh;
    position: absolute;
    width: 182vw;
    left: -44%;
/*     transform: translate(-50%, -50%); */
/*     transform: translate(0%) rotate(90deg); */
	
	 left: 0;
    transform: translate(-25%, 0%) rotate(90deg);
}
	
	.ahae-text-col1 {
    top: 2%;
}
	.ahae-text-col2 {
    top: 6%;
}
	
	.ahae-text-col3 {
		top: 3.5%;
	}
	.ahae-text-col4 {
		top: 2%;
	}
	
	.ahae-text-col p {
		font-size:0.75rem;
	}
	
	/*김윤아님 레지던시*/
	#coggle-yoonah{
		top: 52.5%;
    left: 9%;
	}
	
	#yoonah-cog {
    height: 30vh;
    width: 79vw;
}
	
	#hiding-cog-bar {
		display: none;
	}
	
	.cog-circle3 {
    width: 36px;
    height: 36px;
		top: -7%;
    left: 93%;
/*     left: 94%;
		top: -7%; */
	}
	
	.cog-x-btn3 {
    width: 36px;
    height: 36px;
		left: 86%;
    top: 18%;
	}
	
	.cog-circle3 img {
    top: 12%;
    left: 18%;
}
	
	.yoon-para {
    top: 6rem;
		padding: 3.5% 7%;
	}
	
	.s-para {
    text-align: center;
    font-size: 0.8rem;
}
	
	.yoon-col2 figure img{
		width:100%;
	}
	
	.floaty1 {
    top: 20%;
    left: 49%;
		width: 12%;
}
	
	.floaty2 {
    top: 28%;
		left: 58%;
	}
	
	.floaty3 {
    top: 17%;
    left: 73%;
		width: 10%;
	}
	.floaty5 {
    top: 30%;
    left: 77.5%;
		width: 8.5%;
	}
	
	.floaty6 {
    top: 42.5%;
    left: 78.5%;
		width: 12.5%;
	}
	
	.floaty11 {
    top: 85%;
    left: 51.5%;
		width: 11%;
	}
	
	.floaty12 {
    top: 84.65%;
    left: 69%;
		width: 10%;
	}

	
	/*머피염님 레지던시*/
	#coggle-yum {
    top: 30%;
		left: 10%;
	}
	
	#yum-cog {
    height: 30vh;
    width: 79vw;
	}
	
	.cog-circle2 {
    width: 36px;
		height: 36px;
	}
	
	.cog-circle2 img {
    top: 14%;
    left: 16%;
	}
	
	.cog-x-btn2 {
    width: 36px;
    height: 36px;
    left: 84%;
		top: 18%;
	}
	#murphy-text{
		padding: 0% 5% 1% 2%;
	}
	
	#murphy-text p{
		font-size: 0.85rem;
	}
	#yum2 {
    top: 48%;
    left: 81%;
    width: 14.5%;
}
	#yum3 {
    top: 15%;
    left: 64%;
    width: 11.5%;
}
	
	#yum5 {
    top: 64%;
    left: 40%;
    width: 20.5%;
}
	
	#yum10 {
    top: 87%;
    left: 58%;
    width: 11.4%;
}
	
	#yum11 {
    top: 82%;
    left: 8%;
    width: 13.5%;
}
	
	#yum13 {
    top: 75%;
    left: 34%;
    width: 11.5%;
}
	
	#yum14 {
    top: 19%;
    left: 50%;
    width: 18%;
}
	
	#yum15 {
    top: 52%;
    left: 4%;
    width: 12.5%;
}
	
	#yum19 {
    top: 24%;
    left: 28%;
    width: 12%;
}
	#yum12 {
    top: 68%;
    left: 73%;
    width: 14.8%;
}
	
	#yum16 {
    top: 19%;
    left: 9%;
    width: 13%;
}
	
	#yum22 {
    left: 14%;
    top: 64%;
    width: 12%;
}
	

	
}