.contents_bg{
    background-color: #f7f9ed;
    margin-bottom: 100px;
    font-family: sans-serif;
}
.self_list{
    width: 30%;
    display: inline-block;
    text-align: center;
    padding: 5px;
    color: #ffffff;
    font-weight: bold;
    margin: -3px;
}
.list_contents{
    height: 55px;
    color: #ffffff;
    font-size: 30px;
    padding-top: 15px;
    display: inline-block;
    width: 65%;
    border-radius: 30px;
    margin-top: 10px;
    text-align: left;
    padding-left: 75px;
}
.cov_return_btn{
    display: flex;
    justify-content: center;
}
.return_btn{
    display: inline-block;
    width: 160px;
    text-align: center;
    height: 40px;
    padding-top: 5px;
    border-radius: 25px;
    background-color: #81b870;
    color: #ffffff;
    font-size: 25px;
}
.footer_navi{
    width: 100%;
    text-align: center;
    color: #ffffff;
    position: fixed;
    top: 90%;
}
.top_contents{
    text-align: center;
    margin-bottom: 15%;
    margin-top: 15%;
}
.top_sub_contents{
    text-align: center;
}
.home_contents{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}
.icon_bell{
    width: 20px;
    margin-left: 10px;
}
.self_img{
    width: 180px;
}
.self_intoro{
    font-size: 18px;
    margin-left: 15px;
}
.home_sub_contents{
    text-align: center;
}
.home_sub_contents img{
    width: 50%;
    margin-bottom: 10px;
}

.diary_title{
    background-color: #e5b05a;
    text-align: center;
    padding: 20px;
}
.diary_sub_title{
    font-size: 18px;
    font-weight: bold;
    padding-left: 10px;
}
.diary_contents{
    text-align: center;
    margin-top: 20px;
}
.diary_contents img{
    margin-bottom: 25px;
}

.make_diary_contents{
    padding: 20px;
}
.make_diary_sub_contents{
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 40px;
}
.make_diary_sub_contents p{
    margin-top: 0px;
}
.make_diary_sub_contents .img_box{
    display: flex;
    justify-content: space-between;
}

.look_diary_contents{
    padding: 0px;
}
.look_diary_contents .post_box img{
    width: 49%;
}
.post_name{
    width: 65%;
    background-color: #ffffff;
    margin-right: auto;
    margin-left: auto;
    border-radius: 5px;
    padding: 5px;
    font-weight: bold;
}
.diary_intro{
    background-color: #f7f9ed;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 25px;
    padding: 10px;
    padding-left: 10%;
}
.details_diary_contents{
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 20px;
    padding-top: 10px;
    padding-bottom: 0;
}
.details_diary_contents span{
    margin-left: 10px;
    margin-right: 10px;
}
.details_diary_img_contents{
    padding: 0px;
    padding-top: 0;
}

.details_diary_comment_contents{
    padding: 20px;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}
.details_diary_comment_contents .left{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.details_diary_comment_contents .right{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.details_diary_comment_contents p{
    background-color: #dddddd;
    border-radius: 10px;
    padding: 10px;
    width: 60%;
}
.details_diary_comment_contents span{
    font-weight: bold;
}
.details_diary_comment_contents img{
    width: 100px;
}
.details_diary_comment_contents .comment{
    text-align: center;
    padding: 20px;
}
.details_diary_comment_contents .text{
    margin-bottom: 20px;
    width: 80%;
    height: 80px;
}
.game_title{
    background-color: #a77fb1;
    text-align: center;
    padding: 20px;
}
.game_sub_contents{
    text-align: center;
    margin-top: -1px;
}
.detils_game{
    text-align: center;
}
.movi_title{
    background-color: #90a2d2;
    text-align: center;
    padding: 20px;
}
.movi_tab{
    display: flex;
    padding: 0px;
    margin: 5px 0px 5px 0px;
    height: 40px;
    border-bottom: 2px solid #90a2d2;
}
.movi_tab li{
    display: block;
    margin: 0 2px;
    padding: 10px 20px;
    width: 50%;
}

.look_movi_contents{
    text-align: center;
}
.details_movi_comment_contents{
    padding: 20px;
}
.details_movi_comment_contents .left{
    display: flex;
    justify-content: flex-start;
    align-items: inherit;
    text-align: left;
}
.details_movi_comment_contents .right{
    display: flex;
    justify-content: flex-end;
    align-items: inherit;
    text-align: right;
}
.details_movi_comment_contents p{
    background-color: #dddddd;
    border-radius: 10px;
    padding: 10px;
    width: 60%;
}
.details_movi_comment_contents span{
    font-weight: bold;
}
.details_movi_comment_contents img{
    width: 130px;
}
.details_movi_comment_contents .comment{
    text-align: center;
    padding: 20px;
}
.details_movi_comment_contents .text{
    margin-bottom: 20px;
    width: 80%;
    height: 80px;
}
.movi_sub_title{
    font-size: 18px;
    font-weight: bold;
    margin-bottom: -20px;
}
.friend_title{
    background-color: #81b870;
    text-align: center;
    padding: 20px;
    font-weight: bold;
    font-size: 16px;
    color: #ffffff;
}
.wap_tabs{
    text-align: center;
    letter-spacing: -1em;
    border-bottom: 1px solid #81b870;
}
.tabs{
    width: 50%;
    display: inline-block;
    letter-spacing: 0em;
    padding-top: 10px;
    padding-bottom: 10px;
}
.friend_sub_title{
    font-size: 18px;
    font-weight: bold;
    margin: 0px;
    padding: 20px;
}
.friend_wap_tabs{
    text-align: center;
    letter-spacing: -1em;
    border-bottom: 1px solid #81b870;
    display: flex;
}
.friend_tabs{
    width: 50%;
    letter-spacing: 0em;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    align-items: flex-start;
    font-size: 20px;
}
.friend_tabs img{
    width: 50%;
}
.friend_tabs2{
    width: 50%;
    letter-spacing: 0em;
    padding-top: 10px;
    padding-bottom: 10px;
    display: flex;
    align-items: flex-end;
}
.massege_title{
    background-color: #81b870;
    text-align: center;
    padding: 20px;
    font-weight: bold;
    font-size: 16px;
    color: #ffffff;
}
.message_sub_title{
    font-size: 18px;
    font-weight: bold;
    margin: 0px;
    padding: 20px;
}
.massege_tabs{
    display: flex;
    padding: 15px;
    justify-content: flex-start;
    align-items: center;
    border-bottom: 1px solid #81b870;
}
.massege_tabs span{
    margin-left: 10px;
}
.trip_title{
    background-color: #d88b93;
    text-align: center;
    padding: 20px;
}
.trip_sub_title{
    font-size: 18px;
    font-weight: bold;
    padding-left: 20px;
    margin-bottom: 0px;
}
.make_trip_contents{
    padding: 20px;
}
.make_trip_sub_contents{
    padding: 20px;
    padding-top: 0px;
    padding-bottom: 40px;
}
.make_trip_sub_contents p{
    margin-top: 0px;
}
.make_trip_sub_contents .img_box{
    display: flex;
    justify-content: space-between;
}
.trip_input{
    width: 100%;
    height: 30px;
    border-radius: 10px;
}
.look_trip_contents{
    padding: 0px;
}
.look_trip_contents .post_box img{
    width: 100%;
}
.album_title{
    background-color: #77bcd1;
    text-align: center;
    padding: 20px;
}
.album_btn{
    display: inline-block;
    background-color: #77bcd1;
    padding: 15px;
    border-radius: 15px;
    color: #ffffff;
}

.bg_w{
    background-color: #ffffff;
}
.center{
    text-align: center;
}
.m_l_20p{
    margin-left: 20px;
}
.b_b{
    border-bottom:2px solid #ffffff ;
}
.b_r{
    border-right:2px solid #ffffff ;
}
.navi_box{
    width: 100%;
    height: 105px;
    text-align: center;
    background-color: #00552e;
    color: #ffffff;
    font-weight: bold;
    position: fixed;
    top: 82%;
}
.navi_box td{
    width: 50%;
    height: 50px;
}
.navi_box td a{
    display: block;
    color: #ffffff;
    text-decoration: none;
}

@media only screen and (max-width: 768px) {
    .home_sub_contents img{
        width: 85%;
        margin-bottom: 10px;
    }
    .self_img{
        width: 130px;
    }
}