@charset "utf-8";


.style1 {color: #CC00CC}
.style2 {color: #0000FF}
.style3 {color: #00CC00}
.style4 {color: #FFFF00}
.style5 {color: #FF6600}
.style6 {color: #FF00FF}
.style7 {color: #ff0000}


#gallely table.sample1,
#syutten table.sample1,
#color_02 table.sample1
{
    width: 90%;
    margin:20px 0px 20px 20px;
    border-top: 1px solid #CCC;
    border-left: 1px solid #CCC;
    border-spacing:0px;
}

table.sample1 tr th{ 
    width: 30%;
}

table.sample1 tr th,table.sample1 tr td {
    font-size: 12px;
    border-bottom: 1px solid #CCC;
    border-right: 1px solid #CCC;
    padding: 10px;
    height: auto;
}
table.sample1 td ,table.sample1 img{
    display:block;
}


#main dl { 
    width: 90%; 
}

#main dl dt{ 
    float: none;
}

#main dl dt{   
    padding: 20px; 
}

#main dl dd{ 
    padding: 40px 20px; 
}

#main dl dd span{ 
    font-weight: bold;
} 
#power_stone dl {
    border-top: #ccc thin solid;
}

#power_stone dl dt{
    padding:5px 20px;
}

#power_stone dl dd{
    padding:5px;
}

#mame dl dd{
    padding-top:20px; 
    line-height: 200%;
}

#power_stone h4 {
padding-top: 30px;
}

#link .td_01{ width:200px;}

/* 768px */

@media screen and (min-width : 768px){

#main dl dt{ 
    float: left;
}

table.sample1 td,
table.sample1 th{
display:table-cell;
}



    
}

@media screen and (min-width : 1024px) {
/* ここに1024px以上のCSSを記述*/ 

#color_02 table.sample1 {
        width: 70%;
}
    
table.sample1 td,
table.sample1 th{
display:table-cell;
}


   

}


@media screen and (min-width : 1280px) {
/* ここに1280px以上のCSSを記述*/ 



}

/* end */