@charset "utf-8";
/* 基本設定位置等 */
.uplog{
    width:40%;
}
.tab_area{
    margin: auto;
    padding:0;
    display: flex;
    width:90%;
    list-style: none;
}

.content_area{
    margin: auto;
    margin-top: 0;
    border-top:3px solid #293b4b;
    width: 90%;
    height: 80%;
}
.con,
.con>iframe{
    width: 100%;
    height: 100%;
}

/* 選択してないときのタブの色 */
.tab{
    background:#f3f3f3;
    width:30%;
    padding:1rem;
    padding-bottom:0;
    margin: 0 auto;
    border:2px solid #08152e;
    border-bottom: 0;
    border-radius: 15px 15px 0 0;
    cursor:pointer;
}

/* 選択されてないinframeはnoneでないない */
.con{
    display: none;
}


/* 選択したら処理 */
/* 選択されたら前に出てるように見えるようにcontent背景と同じ色 */
.now_select{
    background:#08152e;
    color:#f3f3f3;
    border: none;
}
.now_show{
    display: block;
}

@media (max-width:480px){
    /*480px以下に適応されるｃｓｓ（スマホ）*/
    .uplog{
        width:100%;
        max-width: 480px;
        min-width: 1px;
        margin:0;
    }
}