/* A            A A                 :                   A                   :                   A                   :                   A                   :                   */
    html.with-fancybox body.hide-scrollbar
    {
   width: auto;
    margin-right: 0 !important;
    overflow: auto !important;
    overscroll-behavior-y: none;
   }     
   
   .daeseung_sub.sub7 form
                { width             : 100%;             height              : auto;             display             : flex;             flex-direction      : column;       
                  align-items       : center;           justify-content     : center;           background          : #f7f7f7;          font-size           : min(1.6vw,18px);}
   .daeseung_sub.sub7 form .listWrap
                { width             : 95%;              height              : auto;             display             : grid;             grid-template-columns : repeat(4, calc(calc(100% - 3.6em) / 4));
                  gap               : 3.6em 1.2em;      max-width           : 1200px;           padding             : 5em 0 6em;}              
   .daeseung_sub.sub7 form .listWrap .list
                { width             : 100%;             height              : auto;             display             : flex;             align-items         : center;
                  justify-content   : flex-start;       flex-direction      : column;}          
   .daeseung_sub.sub7 form .listWrap .list .imgWrap
                { width              :100%;             height              : auto;             aspect-ratio        : 285 / 408;        overflow            : hidden;}
   .daeseung_sub.sub7 form .listWrap .list .imgWrap img
                { width             : 100%;             height              : 100%;             object-fit          : cover;            transition          : .2s;}
   .daeseung_sub.sub7 form .listWrap .list:hover .imgWrap img
                { transform         : scale(1.1);       transition          : .4s;}
   .daeseung_sub.sub7 form .listWrap .list .title             
                { color             : #767677;          font-weight         : 200;              text-align          : center;           word-break          : keep-all;
                  margin-top        : 0.6em;            transition          : .2s;}          
   .daeseung_sub.sub7 form .listWrap .list:hover .title                          
                { color             : #000;             transition          : .2s;}
   #sub7-3.daeseung_sub .sectionWrap.tit
                { padding           : 4.5em 0 1.2em;}
   #sub7-3 .sectionWrap.cate
                { width             : 100%;              height              : auto;             display             : flex;             align-items         : center;
                  justify-content   : center;           margin-bottom       : 3em;}             
   #sub7-3 .sectionWrap.cate input
                { display           : none;}
   #sub7-3 .sectionWrap.cate .cateList
                { width             : 95%;             height              : auto;             display             : grid;             grid-template-columns : repeat(3,calc(calc(100% - 1em) / 3));
                  gap               : 1em 0.5em;       max-width           : 600px;}                        
   #sub7-3 .sectionWrap.cate .cateList .catebtn
                { line-height       : 1em;              color               : #323232;          border              : 1px solid #323232;    transition      : .2s;
                  cursor            : pointer;          text-align          : center;           width               : 100%;             position            : relative;
                  overflow          : hidden;}             
   #sub7-3 .sectionWrap.cate .cateList .catebtn:hover
                { border            : 1px solid #37a5de; transition         : .35s;}
   #sub7-3 .sectionWrap.cate .cateList .catebtn::after
                { content           : "";               background          : #37a5de;          width               : 100%;             height              : 100%;
                  position          : absolute;         top                 : 0;                left                : -100%;            z-index             : 1;                                           
                  transition        : .2s;}             
   #sub7-3 .sectionWrap.cate .cateList .catebtn:hover::after
                { left              : 0;                transition          : .35s;}
   #sub7-3 .sectionWrap.cate .cateList .catebtn p
                { line-height       : 1em;              padding             : 0.4em 0;          z-index             : 2;                position            : relative;
                  transition        : .2s;}             
   #sub7-3 .sectionWrap.cate .cateList .catebtn:hover p
                { color             : #fff;             transition          : .35s;}                
   #sub7-3 .sectionWrap.cate .cateList input:checked + .catebtn
                { border            : 1px solid #37a5de; background         : #37a5de;}
   #sub7-3 .sectionWrap.cate .cateList input:checked + .catebtn p
                { color             : #fff;}                                       
   .daeseung_sub.sub7 .noneWrap
                { width             : 100%;             height              : auto;             display             : flex;             flex-direction      : column;
                  align-items       : center;           justify-content     : center;           padding             : 4em 0;}
   .daeseung_sub.sub7 .noneWrap img
                { height            : 6.5em;            opacity             : .2;               margin-bottom       : 0.5em;}               
/* 페이징 */
   #otiumListForm .pagingWrap
                { width             : 100%;             height              : auto;             display             : flex;                 align-items         : center;
                  justify-content   : center;           margin              : 0em 0 3em;}
   #otiumListForm .pagingWrap .pagingBtn
                { width             : 2em;              height              : 2em;              margin              : 0 0.2em;               display             : flex;
                  align-items       : center;           justify-content     : center;           cursor              : pointer;                
                  color             : #999999;        transition        : .2s;              font-size           : max(14px,0.8em);                    border-radius       : 50%;
                  line-height       : 1em;              }               
   #otiumListForm .pagingWrap .pagingBtn.btns.on
                { background        : #00b3ff;          color               : #fff;             pointer-events      :  none;}
   #otiumListForm .pagingWrap .pagingBtn:hover
                { background        : #999;          color               : #fff;          transition          : .2s;}                 
   #otiumListForm .pagingWrap .pagingBtn svg
                { pointer-events    : none;}   
   #otiumListForm .pagingWrap .pagingBtn.first
                { margin            : 0;                margin-right         : 0.2em;           background          : #fff;                 color              : #999999;
                  border-radius     : 0;}
   #otiumListForm .pagingWrap .pagingBtn.before
                { margin-left       : 0;                color                : #999999;       border-radius     : 0;                        background          : #fff;
                  margin-right      : 1em;}
   #otiumListForm .pagingWrap .pagingBtn.last
                { margin            : 0;                margin-left          : 0.2em;           background          : #fff;                  color              : #999999;
                  border-radius     : 0;                }
   #otiumListForm .pagingWrap .pagingBtn.first:hover,
   #otiumListForm .pagingWrap .pagingBtn.last:hover
                { background        : #999999;          color               : #fff;}                
   #otiumListForm .pagingWrap .pagingBtn.next
                { margin-right      : 0;                background          : #fff;             color              : #999;              border-radius     : 0;
                  margin-left       : 1em;}             
   #otiumListForm .pagingWrap .pagingBtn.before:hover,
   #otiumListForm .pagingWrap .pagingBtn.next:hover
                { background        : #999;             color               : #fff;}
   
   #otiumListForm .pagingWrap .pagingBtn.first svg,
   #otiumListForm .pagingWrap .pagingBtn.before svg,
   #otiumListForm .pagingWrap .pagingBtn.next svg,
   #otiumListForm .pagingWrap .pagingBtn.last svg
                { font-size         : 0.8em;            }                  


@media(max-width : 1024px){

.daeseung_sub.sub7 form .listWrap
                { grid-template-columns : repeat(3,calc(calc(100% - 1em) / 3));}   
                
                
}  

@media(max-width : 640px){

.daeseung_sub.sub7 form .listWrap
                { grid-template-columns : repeat(2,calc(calc(100% - 0.5em) / 2));}    
#sub7-3 .sectionWrap.cate .cateList
                { width             : 95%;             height              : auto;             display             : grid;             grid-template-columns : repeat(3,calc(calc(100% - 1em) / 3));
                  gap               : 1em 0.5em;       }       
    
    
}