@charset "utf-8";

/* リセットCSS部分ここから */
/* リセットCSS部分ここから */
/* 
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com 
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
	display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;   
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* 本書サンプル用に以下のコードを追加しています。 */
ol, ul {
    list-style: none;
}
/* clearfix */
.cf {
	zoom: 1;
}
.cf:before, .cf:after {
	content: "";
	display: table;
}
.cf:after {
	clear: both;
}


/* リセットCSS部分ここまで */
/* リセットCSS部分ここまで */


nav ul {
    list-style:none;
}





/* スマホ向け：10px～ */
@media only screen and (min-width: 10px) {
body {
	width: 100%;
    margin:0px auto 0 auto;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color:#000;}
    
    
        

a {color:#000;
	text-decoration:none;}
a:hover {
	color:darkgrey;
    text-decoration:none;}
a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}
    
    
img{width:100%;}    
    
 
    
    #wrapper{
    width:100%;
    background: url("../images/sozai/126-02.jpg") ;
    background-size:100%;
    background-repeat:repeat;}    
    
    
/*==========================================
 ヘッダーのスタイル
===========================================*/
/*logoの設定*/  
header{
    width:100%;
    max-width: 600px;
    margin:0px auto;
    padding:10px 0 0 0px;
    }
header h1 {
    display: block;
	margin:0 auto 0; 0;
	width:100%;
    text-align:center;
}
header h1 img {
	width:100%;
	max-width:350px;
    
}
header a {
    color:#000;
    text-decoration:none;}
header a:hover {
	color:#000;
    text-decoration:none;}


nav{ 
    width:100%;
    margin-left:auto;
    margin-right:auto;
    margin-top: 20px;
    margin-bottom:20px;}
    
nav ul li {
  float: left;
  text-align: center;
  width: 31%;
  margin:1%;
  background: url("../images/sozai/126-06.jpg") ;
  background-size:100%;
  background-repeat:repeat;}   
 nav ul li:first-child{
  width: 31%;
  height:50px;}
nav ul li:nth-child(2){
    width:32%;
    height:50px;}  
nav ul li:nth-child(3){
    width:31%;
    height:50px;}
nav ul li:nth-child(4){
    width:31%;
    height:50px;}
nav ul li:nth-child(5){
    width:32%;
    height:50px;}
nav ul li:nth-child(6){
        width: 31%;
        height:50px;}        
nav ul li a{
  display:block;
  padding-top: 17px;
  padding-bottom: 20px;
  font-size: 14px;
}

nav ul li a:hover {
text-decoration: none;
color:grey;
font-weight:bold;
background: url("../images/sozai/126-01.jpg") ;
background-size:100%;
background-repeat:repeat;} 

    
    
 
    

/*! TVの枠 */   
    #eagletvwaku{
        display: block;
        border: 13px solid black;
        max-width: 500px;
        margin:30px auto 0 auto;} 
    .tvwakuashi{width:25px;
               margin: 0 auto;
               height:30px;
               background-color: black;}
            
/*! 埋め込み動画をレスポンシブ対応させる */
.video {
position: relative;
height: 0;
padding: 0 0 56.25%;
overflow: hidden;
}

.video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;}    
    
    
     

/* フッターとの間隔 設定なし */ 
/* ヘッダーとフッター以外の横幅の制限あり */ 
#contents{width:90%;
   max-width: 600px;
   margin:0 auto 0px auto;}

    
    .topimage{width:100%;
              max-width: 580px;
              margin-left: auto;
              margin-right: auto;}
    
    .girlsmessagebox{width:370px;margin-left: auto;margin-right: auto;margin-top: 30px;margin-bottom: 30px;height:200px;}
    
    .leftman{width:35%;
             height: 150px;
             margin-top: 20px;
             float:left;
             background: url("../images/girlsstationguidemiyako.png") ;
             background-size:100%;
             background-repeat:no-repeat;}
    
    .hukidashi{width:60%;
             height: 180px;
             float:left;
             background: url("../images/sozai/099-08yoko.png") ;
             background-size:100%;
             background-repeat:no-repeat;
             font-size: 13px;}
    
    .hukidashi p{padding:50px 10px 40px 30px;
                 line-height: 2.0;
                 font-weight: bold;}
    
  
   
/*! 情報掲載のボックス */
    .gourmetbox{width:90%;
                height:2900px;
                margin:30px auto 30px auto;
        background-size:100%;
        background-repeat:no-repeat;}
    .gourmetbox h5{display:block;
        margin-top: 40px;
        text-align: left;
        width:100%;height:40px;}
    #yokoku{width:100%;}
    
    .gourmetguidebox{background-color: white;
                     width:43%;
                     height:250px;
                     margin:2%;
                     padding:1.5%;
                     float:left;}
    .menyusentence h6{display:block;font-size:11px;line-height: 1.5;margin:5px;text-align: left;}
    .menyusentence p{font-size: 12px;line-height: 1.5;}
    
    .playbutton{display:block;width:100%;margin:10px auto;}
    .playbutton a{color:hotpink;font-weight: bold;}
    
    
    
   
    
footer{ background-color: #000;
        color:white;
        margin-top: 0px;
        padding-top:100px;
        width:100%;
        text-align:center;}
footer p{
        display:block;
        width:92%;
        margin-left:auto;
        margin-right: auto;
        font-size:12px;
        text-align: left;
        line-height: 20px;
    }     
footer p small{ 
    display:block;
    margin-top: 25px;
    font-size:12px;
    padding-bottom: 25px;}  

}


/* スマホ向け：420pxまで～ */
@media only screen and (min-width: 550px) {
   
 
.gourmetbox{width:97%;
        max-width: 900px;
        height: 1900px;
        margin:30px auto 30px auto;
        background-size:100%;
        background-repeat:no-repeat;}    
    
    
 .gourmetbox h5{display:block;
        width:100%;
        margin-top: 40px;
        text-align: center;
        width:100%;height:40px;}
    #yokoku{width:100%;}
    
    .gourmetguidebox{background-color: white;
                     width:28%;
                     height:250px;
                     margin:1%;
                     padding:1%;
                     float:left;}
    .menyusentence h6{display:block;font-size:11px;line-height: 1.5;margin:5px;text-align: left;}
    .menyusentence p{font-size: 12px;line-height: 1.5;}
    
    .playbutton{display:block;width:100%;margin:10px auto;}
    .playbutton a{color:hotpink;font-weight: bold;}
        
    
    
              
}