@charset "utf-8";

html { margin: 0px; padding: 0px; background-color: #000000;}
/* add reset */
* {list-style: none; }
a {color: inherit; text-decoration: none;}
img {max-width: 100%; vertical-align: middle;}

/* layout */
.pop_up_wrap { position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 1000; overflow: auto;}
.pop_up_wrap .pop_up {position: absolute; left: 22%; top: 5%;}
.pop_up_wrap .pop_up img {height: 85vh;}
.pop_up_wrap .pop_up .btn_close {position: absolute; cursor: pointer; width: 100%; height: 30px; text-align: right; padding-right: 20px; right: 0; color: #ffffff; font-weight: 600; background-color: #000000; margin-top: -3px; }

.popup {position: fixed; right: 9rem; bottom: 1.2rem; z-index: 99; }
.popup .pc {display: block;}
.popup .pc div {margin-bottom: 0.5rem;}
.popup-m {display: none;}
.inner {max-width: 1100px; padding: 0 20px; margin: 0 auto;}
.cont1 { display: flex; justify-content: center; background-color: #03d1c4; }
.cont1 .pc{display: block;}
.cont1 .mob{display: none;}
.cont1-1 { display: flex; justify-content: center; background-color: rgb(255, 255, 255);}
.cont1-1 .pc{display: block;}
.cont1-1 .mob{display: none;}
.cont2  { display: flex; justify-content: center; background-color: #03d1c4; position: relative; }
.cont2 .bt {position: absolute; bottom: 0;}
.cont2 .pc{display: block;}
.cont2 .mob{display: none;}
.cont3 {background-color: #ffffff; }
.cont3 .pc{display: block; margin: 0 auto;}
.cont3 .mob{display: none;}
@media screen and (max-width: 900px) {
    .popup .pc {display: none;}
    .popup-m {
        display: block;
        position: fixed;
        z-index: 99;
        bottom: 0;
    }
    .popup-m .mob {text-align: center; background-color: #000000; padding: 0.5rem;}
    .popup-m .mob div {display: inline-block; width: 30%;}
}
@media screen and (max-width: 600px) {
    .cont1 .pc{display: none;}
    .cont1 .mob{display: block;}
    .cont2 .pc{display: none;}
    .cont2 .mob{display: block;}
    .cont1-1 .pc{display: none;}
    .cont1-1 .mob{display: block;}
    .cont3 .pc{display: none;}
    .cont3 .pc{display: none;}
    .cont3 .mob{display: block;}
}
@media screen and (max-width: 500px) {
    .pop_up_wrap .pop_up {left: 10%;}
    .pop_up_wrap .pop_up img {height: 60vh;}

}
