/* header */
header{ z-index: 1000; transition: .3s; background:#fff; box-shadow: 2px 0 6px rgba(0,0,0,.2); height: 80px; border-bottom: 1px solid #ddd;}
header h1.logo img{opacity: 0;}
header h1.logo img.scroll{ opacity: 1;}
header .wrap1740 a p{ color: #333;}
header .wrap1740 #reser-btn{ border: 1px solid #333; transition: .3s; color: #333;}
/* =================== 1460px =================== */
@media (max-width: 1460px) {
    header{ height: 130px;}
    header .wrap1740 .flex-wrap{ padding-top: 10px;}
    header.scrolldown{ top: -130px;}
    header.scroll{ height: 130px;}
    header h1.logo{ order: 0;}
    header .gnb{ order: 2; width: 100%; text-align: center;}
    header #reser-btn{ order: 1; }
    header .subnavbg.active{ top: 130px; opacity: 1;}
}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    header{height: 50px; transition: .3s;}
    header .wrap1740 .flex-wrap{ padding-top:0;}
    header.scrolldown{ top: -50px;}
    header.scroll{ height: 50px;}
    header #panelbtn span{background-color: #333;} 
    header #m-reser-btn{ color: #333;}
    header:hover{ box-shadow: 2px 0 6px rgba(0,0,0,.2); border-bottom: 1px solid #ddd; background:#fff; }
    header:hover h1.logo img{opacity: 0;}
    header:hover h1.logo img.scroll{ opacity: 1;}
    header:hover .wrap1740 a p{ color: #333;}
    header:hover .wrap1740 #reser-btn{ border: 1px solid #333; transition: .3s; color: #333;}
}


#section01{ padding: 120px 0 200px; text-align: center;}
#section01 .wrap1740 > h3{ width: 100%; font-size: 24px; line-height: 36px; padding-bottom: 40px; text-align: center;}
#section01 .iso-wrap{ font-size: 0;}
#section01 .iso-wrap a{display: inline-block; width: calc(33.33% - 24px); margin-bottom: 24px; background-color: #000; overflow: hidden;}
#section01 .iso-wrap .con:nth-child(1), #section01 .iso-wrap .con:nth-child(5), #section01 .iso-wrap .con:nth-child(9), #section01 .iso-wrap .con:nth-child(10){ height: 423px;}
#section01 .iso-wrap .con:nth-child(2), #section01 .iso-wrap .con:nth-child(6), #section01 .iso-wrap .con:nth-child(7), #section01 .iso-wrap .con:nth-child(8){ height: 752px;}
#section01 .iso-wrap .con:nth-child(3), #section01 .iso-wrap .con:nth-child(4){ height: 1003px;}
#section01 .iso-wrap .con:nth-child(1), #section01 .iso-wrap .con:nth-child(2),
#section01 .iso-wrap .con:nth-child(4), #section01 .iso-wrap .con:nth-child(5),
#section01 .iso-wrap .con:nth-child(7), #section01 .iso-wrap .con:nth-child(8),
#section01 .iso-wrap .con:nth-child(10), #section01 .iso-wrap .con:nth-child(11)
{ margin-right: 24px;}
#section01 .iso-wrap a .bgi{ width: 100%; height: 100%; transition: .5s;}
#section01 .iso-wrap a:hover .bgi{ opacity: .4; transform: scale(1.1);}
#section01 .iso-wrap a .text-wrap{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: .5s; padding: 0 50px; opacity: 0; justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    flex-direction: column;}
#section01 .iso-wrap a .text-wrap p{ font-size: 15px; padding-bottom: 25px; width: 100%; display: block; text-align: left;}
#section01 .iso-wrap a .text-wrap p img{ padding-right: 10px;}
#section01 .iso-wrap a .text-wrap h3{ font-size: 40px; line-height: 56px; padding-bottom: 30px; display: block;}
#section01 .iso-wrap a .text-wrap .content{ font-size: 15px; line-height: 25px; height: 180px; word-break: keep-all; padding-bottom: 40px; text-align: left;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;}
#section01 .iso-wrap a .text-wrap .med{ width: 100%; font-size: 16px; text-align: right; padding-top: 40px; }
#section01 .iso-wrap a:hover .text-wrap{ opacity: 1;}
/* =================== 1780px =================== */
@media (max-width: 1780px) {
    #section01 .iso-wrap .con:nth-child(1), #section01 .iso-wrap .con:nth-child(5), #section01 .iso-wrap .con:nth-child(9), #section01 .iso-wrap .con:nth-child(10){ height: 23.76vw;}
    #section01 .iso-wrap .con:nth-child(2), #section01 .iso-wrap .con:nth-child(6), #section01 .iso-wrap .con:nth-child(7), #section01 .iso-wrap .con:nth-child(8){ height: 42.25vw;}
    #section01 .iso-wrap .con:nth-child(3), #section01 .iso-wrap .con:nth-child(4){ height: 56.35vw;}
    #section01 .iso-wrap a .text-wrap h3{ font-size: 2.25vw; line-height: 3.15vw; }
}
/* =================== 1024px =================== */
@media (max-width: 1024px) {
    #section01{ padding: 40px 0 160px; text-align: center;}
    #section01 .iso-wrap a{display: inline-block; width: calc(50% - 5px); margin-bottom: 40px; background-color: unset;  vertical-align: top;}
    #section01 .iso-wrap .con:nth-child(1), #section01 .iso-wrap .con:nth-child(5), #section01 .iso-wrap .con:nth-child(9), #section01 .iso-wrap .con:nth-child(10){ height: unset;}
    #section01 .iso-wrap .con:nth-child(2), #section01 .iso-wrap .con:nth-child(6), #section01 .iso-wrap .con:nth-child(7), #section01 .iso-wrap .con:nth-child(8){ height: unset;}
    #section01 .iso-wrap .con:nth-child(3), #section01 .iso-wrap .con:nth-child(4){ height: unset;}
    #section01 .iso-wrap .con:nth-child(1), #section01 .iso-wrap .con:nth-child(2),
    #section01 .iso-wrap .con:nth-child(4), #section01 .iso-wrap .con:nth-child(5),
    #section01 .iso-wrap .con:nth-child(7), #section01 .iso-wrap .con:nth-child(8),
    #section01 .iso-wrap .con:nth-child(10), #section01 .iso-wrap .con:nth-child(11)
    { margin-right: unset;}
    #section01 .iso-wrap .con:nth-child(2n-1){ margin-right: 10px;}
    #section01 .iso-wrap a .bgi{ height: 44.80vw; border-radius: 4px;}
    #section01 .iso-wrap a:hover .bgi{ opacity: 1; transform: scale(1);}
    #section01 .iso-wrap a .text-wrap{ position: relative; width: 100%; height: auto; transition: .5s; padding: 10px 0 0; opacity: 1;}
    #section01 .iso-wrap a .text-wrap p{ font-size: 8px; padding-bottom: 0; color: #333;}
    #section01 .iso-wrap a .text-wrap p img{ padding-right: 5px;}
    #section01 .iso-wrap a .text-wrap h3{ font-size: 14px; line-height: 24px; padding-bottom: 5px; width: 100%; color: #333; text-align: left;}
    #section01 .iso-wrap a .text-wrap .content{ display: none;}
    #section01 .iso-wrap a .text-wrap .med{ display: none; }
}