﻿@charset "utf-8";
html{
    background: #f7f8f8;
}
.main{
    background: #fff;
}
.details_box{
    /*margin-left: 20px;*/
    margin-left: 4.84vw;
    /*margin-right: 20px;*/
    margin-right: 4.84vw;
    /*padding-top: 20px;*/
    padding-top: 4.84vw;
    height: 100%;

    -webkit-overflow-scrolling: touch;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.posted_date{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
    /*font-size: 12px;*/
    font-size: 2.9vw;
    color: #9f9fa0;
}
.posted_date p{
    display: inline-block;
}

.how_nice_btn{
    display: inline-block;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
    /*font-size: 12px;*/
    font-size: 4vw;
    color: #595757;
    float: right;
}

.how_nice_btn img{
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    margin-top: -5px;
}

.how_nice_btn p{
    display: inline-block;
    margin-left: -5px;
}

/*詳細タイトル*/
.details_title p{
    color: #221814;
    /*font-size: 13px;*/
    font-size: 4vw;
    font-weight: bold;
    /*letter-spacing: 1px;*/
    /*line-height: 18px;*/
    line-height: 5.7vw;
}


.details_contents p{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
    color: #4b4b4b;
    /*font-size: 12px;*/
    font-size: 3.5vw;
    /*line-height: 20px;*/
    line-height: 5.2vw;
    word-break: break-all;
    /*letter-spacing: 1px;*/
    /*text-align: justify;*/
    /*text-justify: inter-ideograph;*/
}

.details_icon{
    /*width: 70%;*/
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /*text-align: center;*/
    text-align: left;
}

.img_box{
    display: inline-block;
    /*width: 70px;*/
    /*height: 70px;*/
    width: 25vw;
    height: 25vw;
}

.img_box img{
    /*display: block;*/
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    position: relative;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.my_recruitment{
    /*display: inline-block;*/
    /*margin: 5px;*/
    vertical-align: top;
    /*display: inline-flex;*/
    display: inline-block;
    /*align-items: center;*/
    /*height: 70px;*/
    /*height: 25vw;*/

    width: 100%;
    text-align: center;
    margin-top: 40px;
    padding-bottom: 40px;
}

.my_recruitment a{
    /*display: block;*/
    display: inline-block;
    text-align: center;
    /*width: 120px;*/
    width: 29vw;
    /*margin-left: 10px;*/
    /*margin-left: 2vw;*/
    /*font-size: 13px;*/
    font-size: 3.7vw;
    font-weight: bold;
    /*line-height: 26px;*/
    line-height: 9vw;
    color: #fff;
    border-radius: 7px;
    letter-spacing: 0px;
}

.my_recruitment a.rec_stop_btn{
    /*background: #e73828;*/
    background: #d7a507;
    /*margin-bottom: 7px;*/
}
.my_recruitment a.rec_stop_btn:active{
    background: #7d6127;
}
.my_recruitment a.rec_edit_btn{
    /*background: #f18d00;*/
    margin-left: 2vw;
    background: #ed6c00;
}

.my_recruitment a.rec_edit_btn:active{
    background: #884122;
}

.detailed_item{
    width: 100%;
    max-width: 300px;
    max-width: 81vw;
    min-height: 85px;
    min-height: 185px;
    margin-left: auto;
    margin-right: auto;
    color: #4b4b4b;
    font-size: 12px;
    font-size: 3.5vw;
    letter-spacing: 0;
}

.detailed_item p{
    /*line-height: 25px;*/
    line-height: 6.1vw;
}

.level_select{
    display: inline-block;
}
.level_select span{
    margin-left: -4px;
}
.map_link{
    margin-left: 10px;
    color: #036eb8;
    text-decoration: underline;
    -webkit-tap-highlight-color: rgba(0,0,0,0.4);
    cursor: pointer;
}

/*コメント送信関係*/
.send_img_icon{
    display: inline-block;
    /*width: 10.89vw;*/
    width: 12vw;
    /*height:10.89vw;*/
    height: 12vw;
    border-radius: 50%;
    overflow: hidden;
    vertical-align: middle;
}

.send_img_icon img{
    display: block;
    width: 100%;
    height: 100%;
    /*position: absolute;*/
    position: relative;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.comment_send_box{
    text-align: left;
    /*	margin-top: 30px;
        margin-bottom: 10px;*/
    /*position: fixed;*/
    width: 100%;
    /*bottom: 0;*/
    bottom: 7.62%;
    left: 0;
    background: #ffffff;
    padding: 10px 0;
    padding-bottom: 0px;
}

.comment_send_box form textarea{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
    font-size: 3.5vw;
    line-height: 4.4vw;
    width: 65vw;
    padding: 2vw 2vw;
    height: 9.2vw;
    max-height: 18vw;
    vertical-align: middle;
    border: 1px solid #0057a8;
    border-radius: 13px;
    overflow: hidden;
    overflow-wrap: break-word;
    resize: horizontal;
    box-sizing: border-box;
    -webkit-appearance: none;
    resize: none;
}

button.send_btn{
    background: none;
    border: 0;
    vertical-align: middle;
    /*width: 33px;*/
    width: 7.99vw;
    margin-top: 4px;
    margin-left: -3px;
}

button.send_btn img{
    width: 100%;
}

.comment_login_pop .popup_contents{
    padding: 35px 20px;
    padding-bottom: 25px;
}

.user_profile_date{
    display: inline-block;
    vertical-align: top;
    text-align: left;
    margin-left: 10px;
    line-height: normal;
    width: calc(100% - 33vw);
}

.user_profile_date p{
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", sans-serif;
    /*font-size: 3.7vw;*/
    font-size: 3.5vw;
}
.user_profile_date p.text_team,
.user_profile_date p.text_nickname{
    font-weight: bold;
}

.font_normal{
    font-weight: normal;
}

.details_table table{
    width: 100%;
    border-spacing: 0;
    border-bottom: 1px solid #a8a8a8;
}

.details_table table tr th,.details_table table tr td{
    border-top: 1px solid #a8a8a8;
    border-right: 1px solid #a8a8a8;
    height: 25px;
    padding: 5px 10px;
    color: #595757;
}

.details_table table tr{

}
.details_table table tr th{
    border-left: 1px solid #a8a8a8;
    font-weight: normal;
    text-align: left;
    width: 33%;
}

.details_scroll{
    height: calc(100% - 11%);
    overflow-y: auto;
}

.edit_show .details_scroll{
    height: 100%;
}

.details_scroll.full{
    height: 100%;
}

.mt5{
    margin-top: 5px;
}

.inline_block{
    display: inline-block;
}

.v_top{
    vertical-align: top;
}

@media screen and (min-width: 481px) {
    .detailed_item{
        padding-bottom: 15vw;
    }
}
/* *** レスポンシブ *** */
@media screen and (max-width: 375px) {
    .my_recruitment a{
        width: 115px;
    }

}
@media screen and (max-width: 360px) {

}
@media screen and (max-width: 320px) {
    .details_icon{
        /*text-align: center;*/
    }
    .my_recruitment{
        display: inline-block;
    }
    .my_recruitment a{
        /*display: block;*/
    }
    .my_recruitment a.rec_edit_btn{
        margin-top: 5px;
    }
    .send_img_icon{
        width: 35px;
        height: 35px;
    }
    .comment_send_box form textarea{
        height: 34px;
    }
}

/*キーボードを表示している間*/
@media screen and (max-height: 440px) {
    .contents_box {
        height: auto;
        overflow: initial;
    }
}