.my-masonry-grid {
  display: -webkit-box; /* Not needed if autoprefixing */
  display: -ms-flexbox; /* Not needed if autoprefixing */
  display: flex;
  /*margin-left: -30px;*/ /* gutter size offset */
  width: auto;
}
.my-masonry-grid_column {
  padding-left: 30px; /* gutter size */
  background-clip: padding-box;
}

/* Style your items */
.my-masonry-grid_column > div { /* change div to reference your elements you put in <Masonry> */
  background: grey;
  margin-bottom: 30px;
}


/*  화면 크기별 리스트 광고 설정  */
@media (max-width: 767px) and (min-width: 576px){
  .col-ad-list { 
    max-width: 141px !important; 
  }  
}
@media (max-width: 1199px) and (min-width: 768px){
  .col-ad-list { 
    max-width: 176px !important; 
  }  
}
@media (max-width: 1199px) and (min-width: 576px){
  /* 소형 정사각 */
  .ad-list-1{
  	height:127px;	
  }
  /* 대형 */
  .ad-list-2{
    height:600px;	
  } 
}
@media (min-width: 1200px){
  .col-ad-list { 
  	max-width: 316px !important; 
  }
  .ad-list-container{
  	top: 80px !important;
  }
  /* 대형 */
  .ad-list-2{
	height:603px;	
  }   
}

/*리스트 광고 카드*/
.ad-card-title{
  padding: 4px 4px 4px 4px;
  font-size: 1rem;
  margin-bottom: 0px;  
}

/* 리스트 광고 컨테이너 기본값 */  
.ad-list-container-small{
  position: -webkit-sticky;
  position: sticky;
  top: 80px;
  margin-bottom: 10px;
  background-color: #F0F0F0;
}

.ad-list-container{
  position: -webkit-sticky;
  position: sticky;
  top: 246px;
  background-color: #F0F0F0;
} 

/* 리스트 광고 기본값 */  
.ad-list{
  background: url(/img/pixelog-loading-gradation.gif) center center no-repeat #F0F0F0;
  background-size: 75px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 0 auto;
  overflow: hidden;    
}

/* 메뉴 네비바  */
.swiper-slide {
  width: 90px;
}
.input {
    display: block;
    width: inherit;
    /* height: calc(1.5em + 0.3rem + 2px); */
    padding: 0.375rem 1rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;	
}


.react-autosuggest__container {
  position: relative;
}

.react-autosuggest__input {
	/*box-sizing: unset;*/
  /*width: 240px;*/
  width: 100%;
  height: 38px;
  padding: 10px;
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  font-size: 16px;
  border: 1px solid #aaa;
  border-radius: 4px;
  -webkit-appearance: none;
}

.react-autosuggest__input--focused {
  outline: none;
}

.react-autosuggest__input::-ms-clear {
  display: none;
}

.react-autosuggest__input--open {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.react-autosuggest__suggestions-container {
  display: none;
}

.react-autosuggest__suggestions-container--open {
  text-align: left;
  padding-left: 10px;  
	/*box-sizing: unset;*/
  display: block;
  position: absolute;
  top: 38px;
  /*width: 280px;*/
  width: 100%;
  border: 1px solid #aaa;
  background-color: #fff;
  font-family: 'Open Sans', sans-serif;
  font-weight: 300;
  font-size: 16px;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
  z-index: 2;
}

.react-autosuggest__suggestions-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.react-autosuggest__suggestion {
  cursor: pointer;
  padding: 10px 0px;
}

.react-autosuggest__suggestion--highlighted {
  background-color: #ddd;
}

.react-autosuggest__section-container {
  border-top: 1px dashed #ccc;
}

.react-autosuggest__section-container--first {
  border-top: 0;
}

.react-autosuggest__section-title {
  padding: 10px 0 0 10px;
  font-size: 12px;
  color: #777;
}

.react-nav{
  padding: 0px !important;
}
/* 모바일 100% */
@media (max-width: 575px) and (min-width: 0px){  
  .gridCentered { 
    width: 100%; 
  }
  .card-area{
    width: 100%;
    height: 100%;
    border:none !important;
    display:block !important;
  }
  .card-area img {
    border-radius: 0px !important;
    height: auto !important;
    max-width: 100% !important;   
  }
  /*그림일기 뷰 우측 섹션  */
  .diary-right-section{
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  /*일반 뷰 우측 섹션  */
  .pixelog-right-section{
    padding-left: 1rem !important;
    padding-right: 1rem !important;    
    padding-bottom: 1rem !important;    
  }
   /* 뷰 광고 - 컨테이너 */  
  .ad-view-conatainer{    
    background-color: #F0F0F0;
    padding-top: .5rem!important;
    padding-bottom: .5rem!important;
    border-top: 1px solid #e5e5e5;
    /*border-bottom: 1px solid #e5e5e5;*/
  }
  /* ë·° ê´‘ê³  */
  .ad-view{
    height: 100px;
    background: url(/img/pixelog-loading-gradation.gif) center center no-repeat #fff;
    background-size: 75px;
  }
  /* 뷰 하단 광고 패딩 기본값 */  
  .ps-ad{
    padding-left:0px !important;
  }

}
/* 모바일 - S - 100% */
@media (max-width: 320px) and (min-width: 0px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 280px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 290px !important;
  }
}
/* 모바일 - M - 100% */
@media (max-width: 375px) and (min-width: 321px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 308px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 320px !important;
  }
}
/* 모바일 - L - 100% */
@media (max-width: 425px) and (min-width: 376px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 364px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 376px !important;
  }
}
/* 모바일 - XL - 100% - 1 */
@media (max-width: 485px) and (min-width: 426px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 392px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 400px !important;
  }
}
/* 모바일 - XL - 100% - 2 */
@media (max-width: 535px) and (min-width: 486px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 448px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 456px !important;
  }
}
/* 모바일 - XL - 100% - 3 */
@media (max-width: 575px) and (min-width: 536px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 476px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 484px !important;
  }
}
/* PC - small */
@media (max-width: 991px) and (min-width: 576px){
  /*그림일기 내용 컨테이너*/
  .diary-textarea-container{
    width: 448px !important;
  }
  /*그림일기 내용*/
  .diary-textarea{
    width: 460px !important;
  }
  .gridCentered { 
    width: 480px; 
  }
  .card-area{
    width: 450px;
    height: 450px;
  }
  .card-area .card-height {
    height: 450px !important;
  }
  .card-area .card-width {
    width: 450px !important;
  }
  /*이미지 컨테이너*/
  .img-container{
    margin-right:4px;
  }
  /* 반응형 pc - small */
  .d-small-block{
    display: block !important;
  }  
   /* 뷰 광고 - 컨테이너 */  
  .ad-view-conatainer{
    padding-top: .5rem !important;
    padding-bottom: .5rem!important;  
  }
  /* ë·° ê´‘ê³  */  
  .ad-view{
    height: 100px;
    background: url(/img/pixelog-loading-gradation.gif) center center no-repeat #F0F0F0;
    background-size: 75px;
  } 
}
/* PC - wide */
@media (min-width: 992px){
  .gridCentered { 
    width: 917px; 
  }
  .card-area{    
    width: 450px;
    height: 450px;
  }
  .card-area .card-height {
    height: 450px !important;
  }
  .card-area .card-width {
    width: 450px !important;
  }  
  /* 뷰 우측 섹션  */
  .diary-right-section{
    padding-left:21px !important;
  }
  .pixelog-right-section{
    padding-left:21px;
  }
  /*이미지 컨테이너*/
  .img-container{
    margin-right:4px;
  }
  /* 반응형 pc - wide */
  .d-wide-block{
    display: block !important;
  }
  .d-small-none{
    display: none !important; 
  }
   /* 뷰 광고 - 컨테이너 */  
  .ad-view-conatainer{
    width: 728px;
    margin: 0 auto;    
    padding-bottom: .5rem !important;
    padding-top: .5rem !important;
  }
  /* ë·° ê´‘ê³  */  
  .ad-view{
    height: 90px;
    background: url(/img/pixelog-loading-gradation.gif) center center no-repeat #F0F0F0;
    background-size: 75px;    
  } 
}

/* 뷰 하단 광고 패딩 기본값 */  
.ps-ad{
  padding-left:12px;
}

/* 뷰 광고 기본값 */  
.ad-view{
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 0 auto;
  overflow: hidden;    
} 

/*그림일기 내용 컨테이너*/
.diary-textarea-container{
  background-image: url(/img/note-cell.png);
  width: 420px;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}

/*그림일기 내용*/
.diary-textarea{
  font-size: 1.0rem !important;
  letter-spacing: 0.89rem;
  line-height: 2.5;
  white-space: pre-line;
  padding-left: 0.4rem;
  text-indent: 1.75rem;
  margin-bottom: 0px;
  width:428px;
  height: auto;
  min-height: 1px;
  max-height: 999999px;
}

.card-area{
  background-image: url(/static/resources/animated-preview-checker-background.png);
  border: 1px solid rgba(0, 0, 0, 0.125);  
  border-radius: 0.25rem;  
  display: flex;
  justify-content: center;
  align-items: center;    
}

.card-area img{
  border-radius: 0.25rem; 
}

.view-animated-preview-widget {
  display: block;
  background-color: white;
  background-image: url(/static/resources/animated-preview-checker-background.png);
  border-radius: 16px;
  border: 1px solid rgba(0, 0, 0, 0.125);    
}

.pixelog-view-name{
  color:black;
  font-size:26px;
}

.view-shadow{
  box-shadow:0 0.1rem 1rem 0.1rem rgba(0, 0, 0, 0.15) !important;
}

/*좋아요 아이콘*/
.view-likes-icon{
  position: absolute;
  height: 34px;
  width: 28px;
  line-height: 2;
  right: 10px;
  top: 5px;
  font-size: 18px;
  color: #dc3545!important;
  z-index:1;
}

/* 좋아요-마우스오버 영역 */
.view-likes-no-icon {
  position: absolute;
  height: 34px;
  width: 28px;
  line-height: 2;
  right: 10px;
  top: 5px;
  font-size: 18px;
  color: #6c757d!important;
  z-index:1;
}

/*좋아요 스피너*/
.view-likes-spinner{
  position: absolute;
  height: 34px;
  width: 34px;
  line-height: 2;
  right: 10px;
  top: 6px; 
  font-size: 18px;
  z-index:1;
}

/* 비공개 카드 표시*/
.card-container-private{
  background-image: url('/static/resources/iconmonstr-lock-3-icon.svg');
  background-position-x:right;
  background-position-y:bottom;
  background-repeat: no-repeat;
  background-size:30px;
}


/*팔로우 유저 프로필 마우스오버*/
.pixelog-img-profile-follow{
  cursor:pointer;
  position:absolute;
  right:0;
  bottom:0;
  overflow:hidden;
  background-color:rgba(0,0,0,0.3);
  width: 100%; 
  height : 100%;
  transition : transform  0.3s;
  display:none;
}
.card-follow-container:hover .pixelog-img-profile-follow{
  display:inline-block;
}

/*팔로우 이미지*/
.img-follow{
  width:32px;
  height:32px;
  border-radius:50%;
  border: 1px solid black;
}

.img-follow-null{
  width:32px;
  border-radius:50%;
  border: 1px solid black;
}

.card-follow-container canvas{
  background-image:none !important;
  border: 1px solid black;
  border-radius: 50%;    
}

.scrollspy {
    position: relative;
    height: 200px;
    margin-top: .5rem;
    overflow: auto;
}

.scrollspy-nologin {
    position: relative;
    height: 240px;
    margin-top: .5rem;
    overflow: auto;
}

/*메인 스피너*/
.spin-container{
  width: 100%;
  text-align: center;      
}

/*태그 리스트*/
.tag-list:nth-child(n+2){
  margin-left: 0.25rem !important;
}

/*pixelog뱃지*/
.badge-pixelog{
  position: absolute;
  left: 10px;
  bottom: 10px;
}

/*# sourceMappingURL=style.css.map*/