::-webkit-scrollbar {
    display: none;
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
    background: transparent;
}

@font-face {
    font-family: 'MochiyPopOne-Regular';
    src: url("../../res/font/MochiyPopOne-Regular.ttf");
}

html {
    min-width: 1280px;
    overflow-x: hidden;
    -webkit-user-select: none; /* Chrome, Safari, Opera */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* 일반적인 표준 */
}

p {
    text-align: center;
    justify-content: center; /* 수평 가운데 정렬 */
    align-items: center; /* 수직 가운데 정렬 */
    display: flex;
    font-family: "MochiyPopOne-Regular";
}

.wrapper {
    position: relative;
    padding-bottom: 1px;
    overflow: hidden;
}

.top {
    position: relative;
}

.main {
    width: 100%;
}

.top_main {
    position: relative;
}

.top_log {
    position: absolute;
    top: 0;
}

.top-gra img{
    width: 100%;
}

.top_log_img {
    width: 39.5%;
    margin-top: 12%;
    margin-left: 12%;
}

.twitter_feed_bg {
    width: 100%;
}

.twitter_feed {
    height: 71%;
    width: 83%;
    position: absolute;
    margin: 8%;
    border: 1px solid black;
    border-radius: 12px;
}

.notice_frame{
    position: relative;
}

.notices_bg{
    width: 100%;
}

.notice_content {
    display: flex;
    top: 0;
}

.notices_img {
    padding: 2%;
    display: flex;
    margin-top: 3%;
    margin-bottom: 3%;
    align-items: center; /* 수직 가운데 정렬 */
}

.btn_logo {
    width: 20%;
    margin-right: 2%;
}

.notices_board {
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
}

.btn_list p {
    background: url("../../res/img/notice/notice_on.png") no-repeat;
    background-size: 100% 100%;
}

.notice {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
}

.notices_list {
    background: url("../../res/img/notice/notice_info.png") no-repeat;
    -webkit-background-size: 100%;
    background-size: 100% 100%;
    width: 100%;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
}

.notice_txt {
    display: flex;
    flex-direction: row;
    text-align: left;
    justify-content: flex-start;
    overflow: hidden;
    font-size: 180%;
    margin-left: 6%;
    margin-top: 1%;
    align-items:center;
    flex: 1 1 0;
}

.modal {
    flex-direction: column;
    flex: 1 1 0;
}

.modal textarea, input {
    pointer-events: none;
    width: 100%;
    box-sizing: border-box;
    border: solid 2px #1E90FF;
    border-radius: 5px;
    font-size: 16px;
    resize: both;
    background-color: rgba(0, 0, 0, 0.2);
    padding-right: 1%;
    padding-left: 1%;
    font-size: 30px;
}

.btn_store {
    display: flex;
    margin: 4% 0% 6% 5%;
}

.notices_area {
    margin-top: 6%;
}

.btn_app, .btn_google {
}

.btn_store img {
}

.top-gra img{
    position: absolute;
    width: 100%;
}

.main_area {
    background: url("../../res/img/main-bg.png") no-repeat;
    -webkit-background-size: 100%;
    background-size: 100% auto;
}

.main_area .game_explanation {
    padding: 10% 7% 0% 7%;
    display: flex;
    justify-content: center; /* 수평 가운데 정렬 */
    align-items: center; /* 수직 가운데 정렬 */
}

.game_explanation_txt {
    padding-top: 10%;
}

.main_area .game_summary {
    display: flex;
    justify-content: center; /* 수평 가운데 정렬 */
    align-items: center; /* 수직 가운데 정렬 */
}

.game_summary{
    background: url("../../res/img/img_frame.png") no-repeat;
    background-size: 100% 100%;
    padding: 20% 0% 20% 0%;
}

.main_area .game_info {
    padding-bottom: 3%;
}

.game-img {
    margin-top: 5%;
    margin-left: -7%;
    display: flex;
    align-items: flex-start;
}

.game_ad {
    margin-top: 20%;
    margin-bottom: 20%;
}

.game_ad p {
    font-size: 5rem;
    font-weight: bold;
}

.game_profile {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    margin-left: 10%
}

.game_profile img, .game_ad img, .game_summary img, .game_explanation img{
    width: 100%;
}


.profile_board{
}

.profile_board p{
    background: url("../img/profile-info-frame.png");
    background-size: 100% 100%;
    margin-left: 10%;
    margin-right: 10%;
    padding: 15% 10% 15% 10%;
    font-size: 125%;
}

.profile_character {
}

.profile_character img {
}

.approach {
    padding: 15% 5% 15% 5%;
    display: flex;
    justify-content: center; /* 수평 가운데 정렬 */
    align-items: center; /* 수직 가운데 정렬 */
}

.approach img {
    width: 100%;
}

.company_log {
    display: flex;
    justify-content: center; /* 수평 가운데 정렬 */
    align-items: center; /* 수직 가운데 정렬 */
}

.footer {
    position: relative;
    background: black;
    padding-top: 3%;
    padding-bottom: 3%;
}

.btn_twitter {
    position: absolute;
    top: 18%;
    right: 3%;
    width: 5%;
}

.btn_twitter img {
    width: 100%;
    border-radius: 20px
}

.about_company {
}

.about_company img {
    width: 100%;
}

.game_explanation_txt {
    padding-top: 10%;
}

.game_explanation_txt, .game_summary_txt, .approach_txt{
    font-size: 300%;
    font-weight: bold;
    padding-left: 5%;
    padding-right: 5%;
}

.approach_txt {
    font-size: 5rem;
    padding-bottom: 20%;
    padding-top: 20%;
}

.top_log_img2 {
    width: 100%;
    height: 100%;
    border: 3px solid plum;
}