@charset "Shift_JIS";

/*----全ての要素の余白をゼロに指定----*/
*{ padding:0px; margin:0px;}

img{ border:none;}

a{ text-decoration:none; color:#ff0000;}

body{ font-family:'ヒラギノ丸ゴ Pro W3','Hiragino Maru Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; line-height:1.8em; padding-top:3px; background-attachment: fixed; background:url(../img/m4back.jpg) /*,radial-gradient(#1a0033,#000d33);*/}

table{ width:100%; margin-left:auto; margin-right:auto; margin-bottom:15px;}

th{ text-align:left;}

td{ padding:5px;}

.center{ text-align:center;}

.red{ color:#d9333f;}
.orange{ color:#ec6800;}

.lin a { color:#d9333f;}
.lin a:hover{ color:#b33e5c;}

h3{ padding:5px 15px 5px 0px; text-align:center; color:#f8e58c; font-size:20px;}

/*-----------------*/
#container{ width:800px; overflow:hidden; margin:auto; position:relative; margin-top:50px; margin-left:auto; margin-right:auto; top:11px;}

#header{ padding:6px;}

#container:after { content:""; display:block; clear:both; height:1px; overflow:hidden;}

/*\*/
* html #container { height:1em; overflow:visible;}
/**/

dl.kou{ width:90%; margin-left:auto; margin-right:auto; margin-top:15px;}
dl.kou dt{ color:#f8e58c; font-size:17px; font-weight:bold; padding-top:5px;}
dl.kou dd{ margin-left:20px; color:#fff}
dl.kou dd a{ color:#ffea00;}

#box{ width:210px; position:absolute; left:579px; top:391px; color:#fff;}

/*---------------------------------------------------------*/
.tab_wrap{margin:0px auto;}
input[type="radio"]{display:none;}
.tab_area{font-size:0; margin:0 0px;}
.tab_area label{width:150px; margin:0px; display:inline-block; padding:12px 0; color:#999; background:#fff; text-align:center; font-size:13px; border:none; cursor:pointer; transition:ease 0.2s opacity;}
.tab_area label:hover{opacity:0.5;}
.panel_area{background:;}
.tab_panel{width:100%; padding:0; display:none;}
.tab_panel p{font-size:14px; letter-spacing:1px; text-align:center;}
 
#tab1:checked ~ .tab_area .tab1_label{background:#dccb18; color:#000; font-weight:bold; letter-spacing:3px;}
#tab1:checked ~ .panel_area #panel1{display:block;}
#tab2:checked ~ .tab_area .tab2_label{background:#dccb18; color:#000; font-weight:bold; letter-spacing:3px;}
#tab2:checked ~ .panel_area #panel2{display:block; background:#7f172e;}


@media (min-width:320px) and (max-width:900px) {

#container{width:95%; margin:auto;}
#container img{width:100%; margin:auto;}

}