@charset "utf-8";

* {
  margin: 0;
  padding: 0;
}
a:link { text-decoration: none; color:#000; }
a:visited { text-decoration: none; color:#000; }
a img{border: 0;}

body {
  font-size: 62.5%; /* Resets 1em to 10px */
  line-height: 200%;
  font-family: Verdana, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

h1, h2{font-size: 1.5em; font-weight: normal;}
h3, h4{font-size: 1.4em;}

span.not_display{
  display: none;
}


#container #main a.annotation{
  color: #F00;
  font-weight: normal;
}

#tooltip{
    position: absolute;
    width: 200px;
    background: #FF0;
    color: #000;
    padding: 10px;
    font-size: 1.2em;
}

#tooltip h3, #tooltip div{
    text-align: left;
    font-size: 1em;
    font-weight: normal;
    margin: 0;
}


#container {
  height: 100%;
  min-width: 320px;
}

#header {
  width: 320px;
  height: 140px;
}

#site_title{
  margin: 20px 0 0 20px;
  height: 100px;
  width: 140px;
  display: block;
}
#site_title a{
  background: url('/common/images/common-713.png') no-repeat -520px -255px;
  height: 100px;
  width: 140px;
  display: block;
}

/* menu */

.site_description{
  display: none;
}

#menu{
  width: 112px;
  height: 122px;
  top: 15px;
  right: 15px;
  position: absolute;
  overflow: hidden;
}

#menu li{
  list-style: none;
  float: none;
}

.menu_search{
  display: none;
}

.menu_story{
  position: absolute;
  right: 0;
  top: 0;
}
.menu_story a{
  display: block;
  background: url('/common/images/common-713.png') no-repeat -472px -41px;
  height: 40px;
  width: 112px;
  border-bottom: 1px solid #FFF;
}
.menu_story a.active{
  background: url('/common/images/common-713.png') no-repeat -472px -82px;
}

.menu_category{
  position: absolute;
  right: 0;
  top: 41px;
  z-index: 1;
}
.menu_category a{
  display: block;
  background: url('/common/images/common-713.png') no-repeat -585px -41px;
  height: 40px;
  width: 112px;
  border-bottom: 1px solid #FFF;
}
.menu_category a:hover,
.menu_category a.active{
  background: url('/common/images/common-713.png') no-repeat -585px -82px;
}

.menu_area{
  position: absolute;
  right: 0;
  top: 82px;
}
.menu_area a{
  display: block;
  background: url('/common/images/common-713.png') no-repeat -698px -41px;
  height: 40px;
  width: 112px;
}
.menu_area a.active{
  background: url('/common/images/common-713.png') no-repeat -698px -82px;
}

.menu_lang{
  display: none;
}



/* main */

#main {
  width: 100%;
}

.entry{
  margin-bottom: 20px;
}

.article_title{
  background: #00a0c8;
  width: 320px;
}

.article_title  .inner{
  width: 300px;
  margin: 0 10px;
  margin: auto;
  text-align: left;
}

.article_title ul{
  position: relative;
  height: 80px;
  width: 300px;
}

.article_title a:link { text-decoration: none; color:#fff; }
.article_title a:visited { text-decoration: none; color:#fff; }
.article_title a:active { text-decoration: none; color:#fff;}

.article_title  li{
  display: block;
  list-style: none;
  float: left;
}

.new{
 height: 27px;
  width: 40px;
  position: absolute;
  top: -16px;
  left: -10px;
  background: url('/common/images/icon_new-570.png') no-repeat 0 0;
  z-index: 3;
}
.new span{display: none;}

.pickup{
 height: 27px;
  width: 50px;
  position: absolute;
  top: -16px;
  left: -15px;
  background: url('/common/images/icon_pickup-570.png') no-repeat 0 0;
}
.pickup span{display: none;}

.article_title  li.category{
  position: relative;
}

.article_title  li.category span.category_icon{
  display: block;
  float: left;
  margin: 5px 6px 3px 0;
  height: 30px;
  width: 22px;
  background: url('/common/images/common-713.png') no-repeat -129px -149px;
}

.article_title  li.category span.category_name{
  display: none;
}

.article_title  li.entry_icon{
display: none;
}

.article_title  li.area_icon{
  height: 40px;
  width: 40px;
  position: absolute;
  left: 95px;
  top: 0px;
  margin: 0;
  padding: 0;
  background-image: url('/common/images/common-713.png');
  background-repeat: no-repeat;
}

.article_title li.name{
  position: absolute;
  left: 35px;
  top: 5px;
  vertical-align: middle;
  width: 240px;
  line-height: 2em;
    z-index: 10;
}

.name h2{
  color: #FFF;
  font-weight: bold;
  line-height: 1.8em;
}

#spot .name h2{
  white-space: nowrap;

}

.article_title li.name .sub_name{
  font-size: .85em;
}

.article_title  span.lead{
  font-weight: bold;
  font-size: 1.5em;
  display: block;
}
#main a.lead_link{color: #000;}

.article_title li.name .lead .sub{
  display:  none;
}

.article_title  li.entry_id{
  font-size: 1.2em;
  position: absolute;
  right: 0px;
  top: 10px;
  font-weight: bold;
  letter-spacing: .1em;
  color: #fff;
}

.switch span{
  background: url('/common/images/common-713.png') no-repeat -81px -146px;
  height: 40px;
  width: 30px;
  position: absolute;
  right: 5px;
  bottom: 0;
}
.switch span.open{
  background: url('/common/images/common-713.png') no-repeat -81px -185px;
}

#archives .switch span.open{
  background: url('/common/images/common-713.png') no-repeat -81px -185px;
}


/* article  common  */

.article{
   width: 100%;
   margin: auto;
   background: #E6E6E6;
   text-align: left;
}

.article a{text-decoration: none; color: #000;}

.article p.date,
.article p.category_label{
  font-size: 1em;
  color: #808080;
  margin: 0 0 10px 0;
  letter-spacing: .1em;
}

.main p.category_label{
  display: none;
}

/* archives */

#archives .article{
  display: none;
}

#archives .article .title{
  float: left;
  width: 260px;
  margin: 20px 30px 0 10px;
}

#archives h3{
  margin-bottom: 10px;
}

#archives .author{
  background: #FFF;
  height: 80px;
  font-size: 1.2em;
}

#archives img.portrait{
  float: left;
  width: 80px;
  height: 80px;
}

#archives .author .text{
  margin-left: 80px;
  padding: 10px;
}

#archives  .article .author .text .name{
  font-weight: bold;
  margin-bottom: 5px;
}.text .name span{
  font-weight: normal;
  margin-right: 5px;
  font-style: italic
}

#archives  .article .author .text .description{
  line-height: 140%;
}

#archives  .article .lead{
  float: left;
  width: 270px;
  line-height: 160%;
  margin: 20px 0 0 0;
  position: relative;
  font-size: 1.2em;
  height: 160px;
}

#archives .article .lead .entry_detail{
    text-align: right;
    position: absolute;
    right: 0;
    bottom: 0;
    margin-top: 20px;
    line-height: 200%;
}.lead .entry_detail span{
    background: url('/common/images/common-713.png') no-repeat -50px -154px;
    height: 21px;
    width: 21px;
    float: right;
    margin-left: 6px;
}

#archives .article .photo{
  float: right;
}

#main .main .body a{text-decoration: underline; }


/* story */



#story .article{
  overflow: hidden;
  background: #FFF;
}

#story .article .header{
  margin: 0;
  position: relative;
}

#story .article .twitter_oauth{
  float: right;
  margin: 10px;
  width: 124px;
}

#story .article  .twitter_oauth li{
  float: left;
  width: 50px;
  padding: 0;
  margin: 0 0 0 10px;
  list-style: none;
  text-align: center;
  border: 1px solid #CCC;
  background: #E6E6E6;
}

#story .article .header h1{
  clear: both;
  font-size: 1.6em;
  margin-left: 10px;
  font-weight: bold;
}

#story .article .main_photo{
  display: none;
}

#story .header p.date{
  margin: 10px;
}

#story .main{
  width: 320px;
  margin: 0;
  padding-bottom: 10px;
  position: relative;
}

#story .main .inner{
  background: #FFF;
  padding: 0 10px 10px 10px;
}

#story .main .inner p{
  margin-bottom: 20px;
}

#story .main .body strong{
  display: block;
  font-weight: bold;
  margin-bottom: 30px;
}

#story .main .body span.credit{
  font-weight: normal;
  display: block;
  color: #808080;
  line-height: 1.6em;
  margin-top: 10px;
  font-size: .8em;
}

#story .main .body{
  line-height: 1.8em;
  margin-bottom: 20px;  
  font-size: 1.4em;
  line-height: 1.6em;
}

#story .main .body h2{
  clear: both;
  font-size: 1em;
  padding-top: 10px;
  margin-bottom: 20px;
  font-weight: bold;
}

#story .main .body img.alignright{
  float: none; 
  margin: 0 84px 20px 0;
}

#story .main .recommend_item{
  display: none; /* sample data */
}

#story h2.recommend{
  background: #000;
  color: #FFF;
  height: 40px;
  margin: 40px 0 20px 0;
  font-weight: bold;
}.recommend span{
  display: block;
  padding : 10px ;
  text-align: left;
}

/* sopt */

#spot .article{
  overflow: hidden;
}

#spot .main{
  float: left;
  width: 320px;
  margin: 0;
  padding-bottom: 10px;
}

#spot .main h1{
 display: none;
}

#spot .main .inner{
  background: #FFF;
  padding: 10px 10px 20px 10px;
  overflow: hidden;
  width: 300px;
}

#spot .main .tags{
  display: none;
}

#spot .main .tags a{
  color:#808080;
}

#spot .main .tags .delimiter{
  margin: 0 5px;
}

#spot .main h1 span.title{
  display: block;
  margin: 0 80px 0 10px;
}

#spot .main h1 span.title{
  font-weight: bold;
}

#spot .fave_gallery{
  overflow: hidden;
}

#spot .fave_gallery p img{
  width: 300px;
  height: 225px;
}

#spot .fave_gallery p{
 margin: 0;
 padding: 0;
}

#spot .fave_gallery ul{
  width: 308px;
  overflow: hidden;
  margin: 0 0 20px 0;
  padding: 0;
}

#spot .fave_gallery li img{
 margin: 0;
 padding: 0;
 width: 68px;
 height: 50px;
 cursor: pointer;
}

#spot .fave_gallery li{
  list-style: none;
  float: left;
  margin-right: 9px;
}

#spot .main img.main_photo{
  margin-bottom: 10px; 
}

#spot .main .body{
  line-height: 1.8em;
  margin-bottom: 30px;  
  font-size: 1.4em;
  line-height: 1.6em;
}


#spot .main .body h2{
  font-size: 1em;
  margin-bottom: 10px;
  font-weight: bold;
}

#spot .main .body p{
  margin-bottom: 20px;
}

.area_information{
  margin-bottom: 20px;
  overflow: hidden;
  font-size: 1.2em;
}

#location_data ul{
  list-style: none;
  color: #000;
}

#location_data  li{
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #808080;
  overflow: hidden;
}

#location_data  li.name{
  font-weight: bold;
}

#location_data  span.label{
  float: left;
  width: 80px;
}
#location_data span.data{
  display: block;
    float: left;
    width: 200px;
}.maps a{
  background: url('/common/images/common-713.png') no-repeat -9px -154px;
  height: 21px;
  width: 21px;
  display: block;
}

#spot .main .backto_story{
  display: none;
}


/* sidebar */

.sidebar{
  width: 300px;
  padding: 10px;
  background: #E6E6E6;
}

.sidebar .author{
 background: #fff;
 padding: 10px;
 margin-bottom: 10px;
}

#story .sidebar .author img{
  margin: 0.3em 15px 15px 0;
  float: left;
  width: 80px;
  height: 80px;
}

#story .sidebar .author p.profile{
  font-size: 1.2em;
  margin-bottom: 20px;
}

#spot .sidebar .backto_story a{
  float: left;
  text-decoration: none;
  background: url('/common/images/common-713.png') no-repeat -9px -194px;
  height: 22px;
  width: 21px;
  display: block;
  margin-right: 12px;
}

#story .sidebar .author h3{
 margin-bottom: 10px;
}

#spot .sidebar .author p.story_title{
  margin-left: 33px;
}

#spot .sidebar .author span.title{
  font-weight: bold;
  font-size: 1.3em;
}

#spot .sidebar .author span.name{
  font-size: 1.3em;
}span.name em{
  font-style: italic;
  font-weight: normal;
}

#spot .sidebar .author .description{
    display: block;
    margin-left: 33px;
    font-size: 1.3em;
}

.spot_list{
  background: #fff;
  height: 80px;
  clear: both;
  margin-bottom: 10px;
  position: relative;
  overflow: hidden;
}

.spot_list .photo{
  float: left;
  overflow: hidden;
  margin: 0 15px 15px 0;
  height: 80px;
  width: 80px;
}

.spot_list ul{
  margin-top: 10px;
}

.spot_list li{
  list-style: none;
  font-size: 1.5em;
  display: none;
}

.spot_list li.title{
  font-weight: bold;
  display: block;
}

.spot_list li.tags{
   color:#808080;
}

.spot_list li.tags a{   color:#808080;}

.spot_list  li.tags .delimiter{
  margin: 0 5px;
}

p.spot_detail a{
  background: url('/common/images/common-713.png') no-repeat -9px -154px;
  height: 21px;
  width: 21px;
  margin:0;
  padding: 0;
  display: block;
  position: absolute;
  right: 6px;
  bottom: 6px;
}


#footer {
  clear: both;
  font-size: 1em;
  letter-spacing: .1em;
  margin: 10px;
  text-align: left;
}

ul.tools{
  display: none;
}

div.tools{
  position: relative;
  margin-bottom: 0;
  height: 16px;
  width: 100px;
  list-style: none;
}

.twitter a{
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 22px;
  height: 22px;
  background: url('/common/images/common-713.png') no-repeat -749px -302px;
}

.hatena a{
  position: absolute;
  left: 40px;
  top: 0px;
  display: block;
  width: 24px;
  height: 22px;
  background: url('/common/images/common-713.png') no-repeat -702px -302px;
}


/**************** custom content ****************/

#areaList .area {
  width: 100%;
  margin: 0 0 20px 0;
  clear: both;
}

#areaList .switch span{
  display: block;
  background: url('/common/images/common-713.png') no-repeat -81px -146px;
  height: 38px;
  width: 30px;
  position: absolute;
  right: 5px;
  bottom: 0;
  cursor: pointer;
}
#areaList .switch span.open{
  background: url('/common/images/common-713.png') no-repeat -81px -186px;
}

#areaList .area .article_title{
  position: relative;
}

#areaList .area .article_title .inner {
    cursor: pointer;
}

.area .article_title h2{
  font-size: 1.5em;
  color: #FFF;
}

.area .article_title .count{
  position: absolute;
  right: -20px;
}

#areaList .article_title  li.category_icon{
  display: none;
}

#areaList .faves {
  overflow: hidden;
  padding: 10px;
  width: 300px;
  background: #E6E6E6;
  margin: auto;
  display: none;
}

#areaList p.spot_detail a{
  background: url('/common/images/common-713.png') no-repeat -9px -154px;
  height: 21px;
  width: 21px;
  margin:0;
  padding: 0;
  display: block;
  position: absolute;
  right: 6px;
  bottom: 6px;
}

#areaList .fave, #areaList .faveEmpty {
  background: #fff;
  margin: 0 10px 10px 0;
  width: 300px;
  height: 130px;
  text-align: left;
  position: relative;
  overflow: hidden;
}

#areaList .faveEmpty {
    background: #E6E6E6;
}

#areaList .fave .photo {
    width: 130px;
    height: 130px;
    overflow: hidden;
    float: left;
}

.fave a{text-decoration: none; color: #000;}

.fave .photo img{
    width: 130px;
    height: 130px;
}

.fave .tags{
  display: none;
}



.fave  h3{
  margin: 10px 10px 10px 140px;
}

.fave  .description{
  margin: 0 10px 10px 140px;
  font-size: 1.2em;
}


.pageNavi {
  text-align: center;
  font-size: 1.2em;
  clear: both;
  height: 21px;
  position: relative;
}

.nextPageNavi .decoration{
  background: url('/common/images/common-713.png') no-repeat -49px -154px;
  height: 21px;
  width: 21px;
  display: block;
  position: absolute;
  right: 10px;
   top: 0;
}

.nextCount{
  position: absolute;
  right: 36px;
  top: 0px;
}

.prevPageNavi .decoration {
  background: url('/common/images/common-713.png') no-repeat -49px -194px;
  height: 21px;
  width: 21px;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
}

.prevCount{
  position: absolute;
  left: 26px;
  top: 0px;
}




/* search */


#search .article_title li.name{
  position: absolute;
  left: 40px;
  top: 10px;
  vertical-align: middle;
}

#search .article_title li.count{
  font-size: 1.3em;
  position: absolute;
  right: 30px;
  top: 10px;
  color: #fff;
}

#search .article{
   background: #E6E6E6;
  width: 320px;
  margin: auto;
  text-align: left;
  overflow: hidden;
  margin-bottom: 40px;
}

#search .article h3{
  padding: 20px 15px 10px 15px ;
  overflow: hidden;
}

#search .article .description{
  line-height: 1.8em;
  font-size: 1.3em;
  width: 320px;
  padding: 0 15px 0 15px;
  margin-bottom: 20px;
}

#search .description strong{
  background: #FF0;
  font-weight: normal;
  padding: 0 3px;
}

.pagination{
  text-align: center;
  font-size: 1.3em;
  letter-spacing: .1em;
  margin-bottom: 20px;
}

.pagination a{
  padding: 0 0.5em;
}

.pagination .arrow_left{
  background: url('/common/images/common-713.png') no-repeat -49px -194px;
  height: 21px;
  width: 21px;
  font-size: 18px;
}

.pagination .arrow_right{
  background: url('/common/images/common-713.png') no-repeat -49px -154px;
  height: 21px;
  width: 21px;
  font-size: 18px;
}

/* widget_download */


#widget_download .article_title li.name{
  position: static;
  margin-left: 20px;
  margin-top: 10px;
  vertical-align: middle;
}

#widget_download h1{
  font-weight: bold;
  color: #FFF;
}

#widget_download .article{
  overflow: hidden;
  margin-bottom: 20px;
}

#widget_download .article .inner{
   width: 320px;
   padding:  20px 10px 20px 10px ;
   text-align: left;
   overflow: hidden;
}

#widget_download .article h2{
  margin-bottom: 20px;
    font-weight: bold;
}

#widget_download .description{
  margin: 0 0  40px 0;
}

#widget_download .article h3{
  margin-bottom: 10px;
}

#widget_download .article p{
  font-size: 1.3em;
  margin-bottom: 20px;
}

#widget_download .article .main{
  width: 320px;
  padding: 20px 10px 10px 10px;
  background: #FFF;
  float: left;
}

.screen{
  float: right;
  text-align: center;
  margin: 0;
  width: 320px;
}

#widget_download .article .download_caption{
  width: 320px;
  margin-top: 10px;
  font-size: 1em;
}

.download_caption a{
  text-decoration: none;
}

.download_caption a:hover{
  text-decoration: none;
}

.screen img{
  margin-bottom: 20px;
}

.download_btn a{
  margin: auto;
  display: block;
  background: url('/common/images/common-713.png') no-repeat -562px -274px;
  height: 40px;
  width: 150px;
}

.download_btn a:hover{
  display: block;
  background: url('/common/images/common-713.png') no-repeat -562px -314px;
  height: 40px;
  width: 150px;
}

.download_btn span{
  display: none;
}