@media screen and (min-width: 812px){


.container {
        margin-bottom: 50px;
    }
.wrap_img_zoom {
        display: none;
        position: absolute;
        z-index: 10;
        left: 50%;
        -webkit-transform: translate(-50%, -185%);
        -moz-transform: translate(-50%, -185%);
        transform: translate(-50%, -185%);
        padding: 10px;
        margin-bottom: 80px;
        background-color: #fff;
        border-radius: 4px;
    }

    .img_zoom{

    }
    
    .btnOpen {
        width: 180px;
        height: 40px;
        margin: 0 auto;
        line-height: 40px;
        text-align: center;
        font-weight: bold;
        font-size: 1.4rem;
        background: #fff;
        border: 2px solid #e5e5e5;
        cursor: pointer;
    }
    
    .btnOpen:hover {
        opacity: 0.6;
    }
    
    .btnClose {
        position: absolute;
        top: -40px;
        right: 0;
        width: 32px;
        height: 32px;
        cursor: pointer;
    }
    
    .btnClose::before,
    .btnClose::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 50%;
        width: 20px;
        height: 3px;
        margin-right: -10px;
        background: #fff;
    }
    
    .btnClose::before {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    
    .btnClose::after {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    
    #glayLayer {
        display: none;
        position: fixed;
        z-index: 9;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        padding-bottom: 100px;
        background: #000;
        opacity: 0.85;
    }

    #logo, .inner02{
    	z-index: 8
    }
}

@media screen and (min-width: 768px) and (max-width: 811px){
.container {
        margin-bottom: 50px;
    }
.wrap_img_thumbnail img{
    width: 80%
}
.wrap_img_zoom {
        display: none;
        position: absolute;
        z-index: 10;
        left: 50%;
        -webkit-transform: translate(-50%, -295%);
        -moz-transform: translate(-50%, -295%);
        transform: translate(-50%, -295%);
        padding: 10px;
        margin-bottom: 80px;
        background-color: #fff;
        border-radius: 4px;
    }

    .img_zoom{
        padding: 0px;
        margin-bottom: 80px;
        border-radius: 4px;

    }

    .img_room img{
        position: relative;top:0%;
    }
    
    .btnOpen {
        width: 180px;
        height: 40px;
        margin: 0 auto;
        line-height: 40px;
        text-align: center;
        font-weight: bold;
        font-size: 1.4rem;
        background: #fff;
        border: 2px solid #e5e5e5;
        cursor: pointer;
    }
    
    .btnOpen:hover {
        opacity: 0.6;
    }
    
    .btnClose {
        position: absolute;
        top: -40px;
        right: 0;
        width: 32px;
        height: 32px;
        cursor: pointer;
    }
    
    .btnClose::before,
    .btnClose::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 50%;
        width: 20px;
        height: 3px;
        margin-right: -10px;
        background: #fff;
    }
    
    .btnClose::before {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    
    .btnClose::after {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    
    #glayLayer {
        display: none;
        position: fixed;
        z-index: 9;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        padding-bottom: 100px;
        background: #000;
        opacity: 0.85;
    }

    #logo, .inner02{
        z-index: 8
    }
}

@media screen and (max-width: 767px){
    .container {
        margin-bottom: 50px;
    }
.wrap_img_zoom {
        display: none;
        position: absolute;
        z-index: 10;
        left: 50%;
        -webkit-transform: translate(-50%, -595%);
        -moz-transform: translate(-50%, -595%);
        transform: translate(-50%, -595%);
        padding: 10px;
        margin-top: -100px;
        margin-bottom: 80px;
        background-color: #fff;
        border-radius: 4px;
    }

    .img_zoom{
        margin-top: -1000px;
        width: 95%;
    }

    .img_zoom img{width: 100%}
    
    .btnOpen {
        width: 180px;
        height: 40px;
        margin: 0 auto;
        line-height: 40px;
        text-align: center;
        font-weight: bold;
        font-size: 1.4rem;
        background: #fff;
        border: 2px solid #e5e5e5;
        cursor: pointer;
    }
    
    .btnOpen:hover {
        opacity: 0.6;
    }
    
    .btnClose {
        position: absolute;
        top: -40px;
        right: 0;
        width: 32px;
        height: 32px;
        cursor: pointer;
    }
    
    .btnClose::before,
    .btnClose::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 50%;
        width: 20px;
        height: 3px;
        margin-right: -10px;
        background: #fff;
    }
    
    .btnClose::before {
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    
    .btnClose::after {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    
    #glayLayer {
        display: none;
        position: fixed;
        z-index: 9;
        left: 0;
        top: 0;
        height: 100%;
        width: 100%;
        padding-bottom: 100px;
        background: #000;
        opacity: 0.85;
    }

    #logo, .inner02{
        z-index: 8
    }
}