@charset "UTF-8";

img{width:100%;}

a{color:#000000;
  text-decoration: none;
  }

a:hover{color:grey;font-weight: bold;}


.rogo{width:300px;
      height:80px;
      margin:0 auto;}


/* 見出しのななめ表示のための背景設定 */
header{
	width: 100%;
    max-width: 500px;
    text-align: center;
    margin:20px auto;
	height : 180px;
	padding: 2px;
	position: relative;}

/* 見出しのななめ表示　文字部分の設定 */
header h1 small{
	position: absolute;
	top: 80px;
	left: 15%;
	font-size: 20px;
	transform: rotate(-13deg);}



/* 見出しの色付き背景の設定 */
h1 small{
  position: relative;
  display: inline-block;
  height: 14px;
  margin-left: 0px;
  padding: 3px 5px 14px 5px;
  color: #fff;
  background: #ffd700;}


nav{width:100%;
    display: block;
    margin-top: 10px;}

ul{list-style: none;}

li{width:22%;
   height:40px;
   float:left;
   font-size:7px;}

.topimg{width:100%;
        max-width: 600px;
        margin:0 auto;}

.topcatch{
   width:100%;}

.topcatch p{width:60%;
            max-width: 300px;
            margin:0px auto;
            padding:25px;
            font-size: 14px;}

.button{width:40%;
        margin:20px auto;
        padding:5px 15px;
        background-color: #00ff00;
        text-align: center;}

.button a{color:white;
          font-weight:bold;}


.backstripe{
    width:100%;
    background:repeating-linear-gradient(45deg, white 0, #7fffd4 10px, white 10px, white 20px); }

.backstripe h2{width:100%;
    padding-top: 20px;
    text-align: center;
    font-size:18px;}


.backstripe h3{
    width:40%;
    margin:0 auto;
    padding-top: 15px;
    text-align: center;
    font-size:15px;
    border-bottom: 3px solid #000;}

.backstripe p{width:60%;
              max-width: 300px;
              margin:0 auto;
              padding:15px 0;
              font-size:14px;}

.tapiocimg{width:280px;
           margin:0 auto;
           padding:0 0 20px 0;}

h4{width:50%;
   margin:0 auto;
   font-size:18px;
   text-align: center;
   padding-top:60px;
    border-bottom: 3px dashed #000;}

.blackhole p{
width:100%;
max-width: 500px;
margin: 25px auto;
font-size:15px;
text-align: left;}




/* ストライプ線のみのコード設定 */
.stripeborder{
  width:100%;  
  max-width: 700px;
  margin:0 auto;
  padding: 1rem 2rem;
  border-bottom: 3px dotted #000;}



.selectbox2{width:100%;
max-width: 700px;
margin:0 auto;
padding:50px 0px 20px 0px;
line-height: 1.5;}



.center{width:90%;
       max-width: 700px;
       margin:0 auto;}

.center p{width:70%;
           margin:0 auto;
           font-size:13px;}

.center .nation{font-size:15px;
    line-height: 2.5;
text-align: center;
color:deeppink;}

.center p.name{font-size:15px;font-weight:bold;
text-align: center;}

.center p.article{padding-top:10px;} 

.centerimg{width:80%;
          margin:20px auto;} 

.instaimg{width:60%;
          margin:20px auto;} 


/* メニュー写真スタイルここから */
.imgframe{
width:330px;
height:470px;
margin:0 auto;
background:url("../images/sozai/126-02.jpg") ;
line-height: 1.7;}

.imgbox{width:70%;
        margin:0 auto;
        padding-top:20px;}



/* チェキ風メニュー写真スタイルここから */
.imgframe2chekiver{
width:330px;
height:400px;
margin:0 auto;
background:url("../images/sozai/126-02.jpg") ;}

.imgnobox{width:70%;
        margin:0 auto;
        padding-top:20px;}


.imgbox img{border:3px solid #fff;}


/* メニュー写真 少しheightを大きめに　商品説明文章多いスタイルここから */
.imgframe3{
width:330px;
height:540px;
margin:0 auto;
background:url("../images/sozai/126-02.jpg") ;
line-height: 1.7;}


.menutitle{text-align: center;}

p.contents{text-align: left；}


/* 展望台メニュースタイルここから */
.imgframe2{
width:330px;
height:530px;
margin:0 auto;
background:url("../images/sozai/126-02.jpg") ;
line-height: 1.7;}



/* 吹き出しスタイルの設定ここから */
.fukidashiballoon{
    width:60%;
    max-width: 330px;
    margin:0 auto;}

.balloon1 {
  position: relative;
  display: inline-block;
  margin: 10px auto;
  padding: 7px 10px;
  min-width: 120px;
  color: #555;
  font-size: 16px;
  background: #eee8aa;
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #eee8aa;
}

.balloon1 p {
  margin:0 auto;
  padding: 0;
}
/* 吹き出しスタイルの設定ここまで */


/*写真にポラロイド風の写真枠ここから*/
.polaroids {
  display: block; /* ブロックレベル表示に */
  width: 200px;
  height: 120px;
  margin: 17px auto;
  background: white; /* 背景色を白 */
  padding: 10px 10px 30px; /*上 左右 下のパディング */
  -moz-box-shadow: 0 4px 10px #333; /* 影を落とす */
  -webkit-box-shadow: 0 4px 10px #333;
  box-shadow: 0 4px 10px #333;}

/*
/*回転　ポラロイド風の写真枠を回転させる場合のソースコード*/
/*
-webkit-transform: rotate(5deg); 
-moz-transform: rotate(5deg);
-ms-transform: rotate(52deg);
transform: rotate(5deg);
*/

/*写真にポラロイド風の写真枠ここまで*/


/*テキストの破線枠ここから*/
.box6 {
    padding: 1.5em 1em;
    margin: 2em 0;
    background: #eee8aa;
    border: dashed 2px #000;/*点線*/
}
.box6 p {
    margin: 0　auto; 
    padding: 0;
    line-height: 1.6;
}

/*テキストの破線枠ここまで*/



    




/* 取材担当者プロフィールのスタイル設定ここから */
  
.profile{width:100%;
         height:333px;
    font-size:12px; background:url("../images/sozai/126-02.jpg") ;
    background-size:100%;
    background-repeat:no-repeat;}

.profile1{width:320px;
          height:200px;
          margin:0 auto;}

.profilebox{width:300px;
            height:170px;}

.profoleleft{width:50px;
             padding:30px 0px 10px 10px;
             float:left;}

.profileleft img{width:100%;}

.profileright{width:150px;
            padding:80px 0 0 0;
            float:right;}

small.black{font-weight:bold;}
small.red{color:red;}

/* 取材担当者プロフィールのスタイル設定ここまで */






/* 画像の円形丸抜き設定 */
.circle {
    border-radius: 50%;
     width: 120px;
    height: 120px;}





/* 取材担当者プロフィールのスタイル設定ここまで */





.adresslist{width:100%;
  max-width: 500px;
  margin:0 auto;
  line-height: 1.5;
  background-color: ghostwhite;}

.adresslist h5{font-size:18px;
color:deeppink;
font-weight: bold;
text-align: center;
line-height: 2.5;}

.adresslist h5 small{color:#000000;}

/* かぎかっこをつけた見出し設定ここから */
h5 {
  position: relative;
  padding: 1em 2em;
  text-align: center;}
h5:before,
h5:after {
  position: absolute;
  content: '';}
h5:after {
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
  border-top: 2px solid #000;
  border-left: 2px solid #000;}
h5:before {
  right: 0;
  bottom: 0;
  width: 50px;
  height: 50px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;}
/* かぎかっこをつけた見出し設定ここまで */


.shop1,.shop2{width:80%;
       padding:15px;
       margin:15px auto;
       background-color: white;}

.name{font-size:15px;}

.adress{font-size:15px;}

.shopshortinfo{
    width:100%;
    height:120px;}

.shopimage{width:35%;
           float:left;}

.taste{width:60%;
       float:right;
       padding:10px 0 10px 0px;}

.linkinfo{
    width:80%;
    margin:0 auto;
    padding:5px 10px;
    text-align: center;
    color:white;
    font-weight:bold;
    background-color: navy;}

.banner{width:90%;max-width: 400px;
margin:20px auto;}


footer{
    margin-top:25px;
    font-size:12px;}