/* P
------------------------------------- */

p {margin-top:0px;margin-bottom:15px;/* 上下、一行空ける。基本はコレ */
margin-right:20px;margin-left:20px;}
	
.pt1 {margin-top:10px;margin-bottom:0px;/* 上だけ一行、空ける*/
margin-right:20px;margin-left:20px;}
	
.pb1 {margin-top:0px;margin-bottom:10px;/* 下だけ一行、空ける */
margin-right:20px;margin-left:20px;}

.p0 {padding:0em;margin:0em;/* 一行空けない */
margin-right:20px;margin-left:20px;}

.ptop {text-indent: 1em;/* 行頭1文字分空ける*/
margin-right:20px;margin-left:20px;}


a img {
    border-style:none;
}

.no_border {
    border-style:none;
}


.p1 {padding:0em;margin:0em;/* 一行空けない */}
.pone {text-indent: 1em;/* 行頭1文字分空く*/}



.tabletop { 
width: 585px; /* テーブルの横幅 */ 
border-collapse: collapse; /* 枠線の表示方法 */ 
border: 1px #191970 solid; /* テーブル全体の枠線（太さ・色・スタイル） */ 
background-color:#FFFFFF;text-align: center;} 


.tabletop TD { 
border: 1px #191970 solid; /* セルの枠線（太さ・色・スタイル） */ 
padding: 5px; /* セル内の余白 */ 
font-size:10pt;
color:#191970;text-align: center;} 



.tablebank { 
clear:both;
width: 585px; /* テーブルの横幅 */ 
border-collapse: separate; /* 枠線の表示方法 */ 
border-spacing: 0;
border-right: 1px #b2b2b2 solid;/* テーブル全体の枠線（太さ・色・スタイル） */ 
border-bottom: 1px #b2b2b2 solid; /* テーブル全体の枠線（太さ・色・スタイル） */ 
background-color:#FFFFFF;
} 

.tablebank TD { 
    border-left: 1px #b2b2b2 solid;/* テーブル全体の枠線（太さ・色・スタイル） */ 
    border-top: 1px #b2b2b2 solid; /* テーブル全体の枠線（太さ・色・スタイル） */ 
    padding: 5px 6px; /* セル内の余白 */ margin:0em;
    font-size:10pt;/* 10ptは、約13px  */
    color:#232323; vertical-align:top;
} 

.tablebank TD.app { padding-top: 14px;
    background-color:#d1d1d1; 
} 

.tablebank TD.app2 { padding-top: 14px;
    background-color:#ffffff; 
} 



.tablebank TH,
.tablebank TH.paypay, 
.tablebank TH.ebank, 
.tablebank TH.sumisin,
.tablebank TH.sinsei, 
.tablebank TH.olive  {
    border-left: 1px #b2b2b2 solid;
    border-top: 1px #b2b2b2 solid;
    text-align:center;
    background-color:#1e4999;/* デフォルト、ジャパンネット銀行カラー */ 
    padding:3px; 
    font-size:11pt;
    color:#ffffff;
    font-weight:bold;} 
   
.tablebank TH.paypay
{ background-color:#FF0033;/* paypayブランドカラー */  } 

.tablebank TH.ebank
{ background-color:#BF0000;/* ebankカラー #ffae19;*/ }



.tablebank TH.sumisin
    { background-color:#0058A0;/* 住信カラー */    } 

.tablebank TH.sinsei
        { background-color: #00aaff;/* 新生銀行カラー */    } 
   
.tablebank TH.olive
{ background-color: #004832;/* Oliveカラー */    } 

.tablebank TH.olive2
{ background-color: #C4D700;/* Oliveカラー2 */    } 

.tablebank TH.olive3
{ background-color: #F68213;/* Oliveカラー2 */    } 



.tablebank .tdbank,.tablebank .tdbank2, 
.tablebank .tdpaypay,
.tablebank .tdebank,
.tablebank .tdsumisin,
.tablebank .tdsinsei,
.tablebank .tdolive
{
    /* tablecのtd内のclass名tdc
    ------------------------------------- */
    background-color: #E8E8E8!important;/* デフォルト、ジャパンネット銀行カラー */ 
    width: 25%;
    margin:0px;   
    } 
    

    .tablebank .tdpaypay {
        /* paypayブランドカラー */
        background-color: #FF8F6B!important;
        } 
    .tablebank .tdebank {
        /* ebankカラー */
        background-color: #FFFBE0!important;
        } 

        .tablebank .tdsumisin {
            /* sbiカラー */
            background-color: #e5fff6!important;
            } 
    
            .tablebank .tdsinsei {
                /* shinseiカラー */
                background-color: #E8E8E8!important;
                } 
                
            .tablebank .tdolive {
                /* Oliveカラー */
                background-color: #f2f4d4!important;
                } 


    .tablebank .tdbank,
    .tablebank .tdpaypay,
    .tablebank .tdebank,
    .tablebank .tdsumisin,
    .tablebank .tdsinsei,
    .tablebank .tdolive
    {
    text-indent:-1em;
    padding-left:18px;
    /* ◇取扱い銘柄（通貨）
       数----------
       　↑こうじゃなく
    
       ◇取扱い銘柄（通貨）
         数----------
         ↑こうなるように調整
       */
    
    } 
    
    
    .tablebank .tdbank2 {
    /* ※尚、利用できるポイントサイトや獲得できるポイント数などには……のところ
    ------------------------------------- */
    width:100%;background-color:#DEEFFF;
    } 
    


    
    .tablebank .star, 
    .tablebank .starebank,
    .tablebank .starsumisin,
    .tablebank .starsinsei,
    .tablebank .starolive {
        background-color: #E8E8E8;
        width:25%;
        margin:0px;padding-top:10px;
    }
    
    .tablebank .starebank {
        background-color: #FFFBE0;
    }

    .tablebank .starsumisin  {
        /* sbiカラー */
        background-color: #e5fff6;
        } 

        .tablebank .starsinsei {
            background-color: #E8E8E8;
        }

        .tablebank .starolive {
            background-color: #C4D700;
        }


        
.tablebank P {margin-top:0px;margin-bottom:15px;/*tablepoint2内のP 下、一行空ける、上は空けない。 */
margin-right:20px;margin-left:20px;/* 左右20pxづつあける */
font-size:10pt;}


/* 保留中 */ 

h2.bankhead,h2.ebhead  {
    border-left: 5px #b2b2b2 solid;
    border-top: 1px #b2b2b2 solid;
    text-align:left;
    background-color:#1e4999;/* デフォルト、ジャパンネット銀行カラー */ 
    padding:3px; padding-left: 15px;
    font-size:11pt;
    color:#ffffff;
    font-weight:bold; 
    margin-bottom:5px;
    } 

    h2.ebhead  {background-color: #BF0000;} 

  
.tablebank TD.maintext {  padding-left: 0px; padding-right: 0px;
    } 

h3.hbank,h3.holive,h3.hpaypayb,h3.hrakutenb,h3.hsumisin,h3.hsinsei {/* こういうのも渋いかもな、
    
上の.tablebank TD.maintext {  padding-left: 0px; padding-right: 0px;
} とあわせて使う
    */
    font-size: 11pt;font-weight:bold;
    color:#191970;
    background-color:#ffffff;
    border: #b2b2b2 1px solid;
    border-left:#191970 5px solid;
    border-right:#191970 5px solid;
    padding:4px 15px;/* 上下3px、左右15px空ける */
    margin: 0px;
    margin-bottom: 3px;
    }


    h3.holive { color:#004832;
            border-left:#C4D700 5px solid;
            border-right:#C4D700 5px solid;
            }
        
    h3.hpaypayb { color:#FF0033;
        border-left:#808080 5px solid;
        border-right:#808080 5px solid;
        }
    
        h3.hrakutenb { color:#BF0000;
            border-left:#ff8c00 5px solid;
            border-right:#ff8c00 5px solid;
            }
        
     h3.hsumisin { color:#1451cc;
        border-left:#808080 5px solid;
        border-right:#808080 5px solid;
                }

                h3.hsinsei { color:#00aaff;
                    border-left:#808080 5px solid;
                    border-right:#808080 5px solid;
                            }
            



h3.bankhead
{
font-size: 11pt;
color:#ffffff;
padding:0px 0px 0em 5px; 
background-color:#808080;
margin:0em;
font-weight:bold;}


h3.bhead {
    font-size: 10pt;
    color:#191970;
    background-color:#ffffff;
    border-left:#191970 3px solid;
    padding:3px 20px;/* 上下3px、左右15px空ける */
    margin: 0px 0px 0px 0px;font-weight:bold;text-align:left;
    }




h3.jbhead,
h3.pay2head,
h3.ebhead,
h3.sbihead,
h3.sinhead,
h3.olivehead
{
    font-size: 11pt;
    color:#191970;/* 文字色を紺 */
    background-color:#ffffff;       /* 背景色を設定 */   
    border-left:solid 7px #5e90ed; 
    padding:0px 0px 0em 12px;                 /* 文字間隔 */
    margin:0px 0px 6px 0em;
font-weight:bold;}


h3.pay2head {  
    border-left:solid 7px #FF0033; }

h3.ebhead {
    border-left:solid 7px #BF0000; }
h3.sbihead {
    border-left:solid 7px #1451cc; }

h3.sinhead {   
    border-left:solid 7px #00aaff; }
    
h3.olivehead {   
        border-left:solid 7px #C4D700; }
    
h3.olivehead2 {   
            border-left:solid 7px #F68213; }

h4.pay2head {
    font-size: 11pt;font-weight:bold;
    color:#FF0033; }

h4.ebhead {font-size: 11pt;font-weight:bold;
    color: #ff8c00; }


h4.sbihead {font-size: 11pt;font-weight:bold;
    color: #1451cc; }

h4.sinhead {   font-size: 11pt;font-weight:bold;
    color:  #00aaff; }


 h4.olivehead {   font-size: 11pt;font-weight:bold;
        color:  #004832; }
    


            



.banklist 
{ list-style:square; margin:15px 0px 15px 50px;} 






/* メディアクエリ。　　ウィンドウ幅が0?500pxの場合に適用するCSS */


@media screen and ( max-width:500px )
{
 
/*==〜以下、画面の横幅が500pxまでの場合のスタイル記入〜==*/




/* 重要！！！スマホで見るとなぜwidthが効かないtdがあるのか解決 */

.col1 { width: 25%;/* 100pxとかでもいけるが */
    
    /* テーブル内にcolspanがあって横幅指定が効かない時の対処法 
    https://techmemo.biz/css/table-layout-colgroup/ */ 
    /* スマホで見るとtdbank内の横幅が広くなりすぎる問題
 　 
    <colgroup>
    <col class="col1">
    <col class="col2">
  </colgroup> 　もhtmlの方へ追加してやると効くようになる。
  でもよく考えたらここで指定やれば、tdbankで指定しなくてもよくないか？
  */ 
  
}

.tabletop { table-layout: fixed;/* tableの列幅を均等にする*/ 
word-break: break-word;/* 文字を行から、はみださないように制御*/ 
width: 98%; /* テーブルの横幅 */} 


.tablebank { table-layout: fixed;/* tableの列幅を均等にする*/ 
word-break: break-word;/* 文字を行から、はみださないように制御*/ 
width: 98%; /* テーブルの横幅 */
} 


.tablebank TD {font-size:0.9em; } 

.tablebank .tdbank,.tablebank .tdbank2,
.tablebank .tdpaypay,
.tablebank .tdebank,
.tablebank .tdsumisin,
.tablebank .tdsinsei,
.tablebank .tdolive

{
    /* tablecのtd内
    
    width:100%;/* これは別にいらんくないか？
    table-layout: fixed;/* tableの列幅を均等にする*/ 
    word-break: break-word;/* 文字を行から、はみださないように制御*/ 
    }
    
    
    .tablebank .star
    .tablebank .starebank,
    .tablebank .starsumisin,
    .tablebank .starsinsei, .tablebank .starolive {padding-top:12px;
        /* スマホで見るとやや上ぎみにズレてるので
        ------------------------------------- */
    }

    h3.hbank,h3.holive{
            padding-top:5px ;/* スマホで見ると上の空きが狭く感じたので */
            padding-bottom: 4px;
            }
        
        


}