@charset "UTF-8";

/*
information{
    file name : /css/styles/individual/international_report.css;
    site name : 金沢工業大学ホームページ;
    copyrihgt : Copyright Kanazawa Institute of Technology.;
    explanation : 留学体験報告 対応css;
}
*/

/* contents
--------------------------------------------------------------------------

--------------------------------------------------------------------------
*/


/* [#reportListBoundary] 
-----------------------------------------------    */
#reportListBoundary div.container {
    min-height: 1px;
    border-bottom: 1px solid #cfd0d1;
    border-left: 1px solid #dddddd;
    background-image: url("https://www.kanazawa-it.ac.jp/h1s/images/common/bg_lines/box_foot.gif");
    background-repeat: repeat-x;
    background-position: left bottom;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container {
        display: table;
        width: 100%;
    }
}

#reportListBoundary div.container:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

#reportListBoundary div.container div.letter {
    float: right;
    width: 610px;
    border-top: 3px solid #91c8d2;
    border-right: 1px solid #dddddd;
    border-left: 1px solid #dddddd;
    min-height: 141px;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter {
        display: table-cell;
        width: auto;
        float: none;
        vertical-align: top;
        border-top: 2px solid #91c8d2;
    }
}

#reportListBoundary div.container div.letter div.header {
    padding: 10px 15px 10px 13px;
    border: 1px solid #ffffff;
    background-color: #f3f7f8;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.header {
        padding: 6px 10px 6px 10px;
    }
}

#reportListBoundary div.container div.letter div.header:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden;
}

#reportListBoundary div.container div.letter div.header h3 {
    float: left;
    font-size: 18px;
    font-weight: bold;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.header h3 {
        font-size: 13px;
    }
}

#reportListBoundary div.container div.letter div.header p.cap {
    float: right;
    font-size: 14px;
    margin-top: 4px;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.header p.cap {
        font-size: 12px;
        margin-top: 1px;
    }
}

#reportListBoundary div.container div.letter div.column.report {
    padding: 12px 14px;
    border-top: 1px solid #dddddd;
    color: #999999;
    font-size: 14px;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.column.report {
        font-size: 12px;
        padding: 6px 10px;
    }
}

#reportListBoundary div.container div.letter div.column.report ul.linkList {
    overflow: hidden;
}

#reportListBoundary div.container div.letter div.column.report ul.linkList li {
    float: left;
    width: 33%;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.column.report ul.linkList li {
        width: 100%;
    }
}

#reportListBoundary div.container div.photo {
    float: left;
    width: 129px;
    border-top: 1px solid #dddddd;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.photo {
        float: none;
        display: table-cell;
        width: 80px;
    }
}

#reportListBoundary div.container div.photo p {
    padding: 14px;
    font-size: 0;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.photo p {
        padding: 10px;
    }
    #reportListBoundary div.container div.photo p img {
        width: 80px;
        height: auto;
    }
}

#reportListBoundary div.container div.letter div.column.description {
    padding: 0 14px 12px;
    font-size: 14px;
}
@media screen and (max-width: 767px) {
    #reportListBoundary div.container div.letter div.column.description {
        font-size: 12px;
        padding: 0 10px 6px;
    }
}

/* [#ryugakuReportImg] 
-----------------------------------------------    */
@media screen and (max-width: 767px) {
    div.ryugakuReportImg {
        padding: 10px 15px;
    }
} 

div.ryugakuReportImg img {
    width: 356px;
    height: auto;
}
@media screen and (max-width: 767px) {
    div.ryugakuReportImg img {
        width: 100%;
    }
}