/* CSS Document */

/* 枠なしテーブルのスタイル */
table.table-noframe { border-style:hidden; }
table.table-noframe td { border-style:hidden; padding:0px 5px; }

/* 細枠テーブルのスタイル */
table.table-frame { border:1px solid #808080; border-collapse: collapse; }
table.table-frame td { border:1px solid #808080; padding:0px 5px; }

/* プロフィールのスタイル */
div.profile { border:#a0a0a0 2px solid; width:730px; margin-left:auto; padding:5px; overflow-x:hidden; overflow-y:auto; }
div.profile .profile-photo { float:left; width:250px; }
div.profile .profile-name { float:left; width:470px; height:2rem; margin-left:10px; padding-top:0.5rem; border-bottom:1px solid #a0a0a0; font-weight:bold; font-size:1.1rem; }
div.profile .profile-text { float:left; width:470px; margin-left:10px; margin-top:5px; }

/* 左詰画像のスタイル */
div.img250L { float:left; width:260px; padding:5px; margin:5px; border:#a0a0a0 1px solid; color:#808080; font-size:85%; line-height:1.1em; }
div.img250L img { width:250px; border:#f0f0f0 0px solid; }

/* 右詰画像のスタイル */
div.img250R { float:right; padding:5px; margin:5px; border:#a0a0a0 1px solid; color:#808080; font-size:85%; line-height:1.1em; }
div.img250R img { width:250px; border:#f0f0f0 0px solid; }

h3 { font-weight:bold; font-size:18px; margin-top:10px; margin-bottom:5px; }
h4 { font-weight:bold; font-size:16px; margin-top:10px; margin-bottom:5px; }
ol li { margin-bottom:5px; }

/* インタビューのスタイル */
p.kikite { background:rgb(240,240,240); margin:20px 0 0 5px; padding:5px 10px; border-right:3px solid rgb(220,220,220); border-radius:5px; color:rgb(0,0,0); font-weight:bold; font-size:1.1rem; }
p.katarite-m1 { background:rgb(255,255,255); margin:5px 5px 0 0; padding:5px 10px; border-left:3px solid rgb(220,220,255); border-radius:5px; color:rgb(0,0,0); }
p.katarite-f1 { background:rgb(255,255,255); margin:5px 5px 0 0; padding:5px 10px; border-left:3px solid rgb(255,220,220); border-radius:5px; color:rgb(0,0,0); }

/*===============================================
tablet（画面の横幅が960px以下）
===============================================*/
@media screen and (max-width:960px){
/* プロフィールのスタイル */
div.profile { width:650px; padding:5px; }
div.profile .profile-photo { width:250px; }
div.profile .profile-name { width:390px; }
div.profile .profile-text { width:390px; margin-left:10px; float:left; }
}

/*===============================================
tablet??（画面の横幅が700px以下）
===============================================*/
@media screen and (max-width:700px){
/* プロフィールのスタイル */
div.profile { width:460px; padding:5px; margin:0 auto; }
div.profile .profile-photo { width:180px; }
div.profile .profile-name { width:460px; }
div.profile .profile-text { width:460px; margin-left:0px; }
}

/*===============================================
smartphone（画面の横幅が640px以下）
===============================================*/
@media screen and (max-width:640px){
}

/*===============================================
smartphone（画面の横幅が480px以下）
===============================================*/
@media screen and (max-width:520px){
/* プロフィールのスタイル */
div.profile { width:90%; float:none; margin:0 auto; padding:5px; }
div.profile .profile-photo { width:50%; max-width:250px; }
div.profile .profile-name { width:100%; }
div.profile .profile-text { width:100%; }

/* 右詰画像のスタイル */
div.img250R { float:right; padding:5px; margin:5px; border:#a0a0a0 1px solid; color:#808080; font-size:85%; line-height:1.1em; }
div.img250R img { width:150px; border:#f0f0f0 0px solid; }
}
