@charset "UTF-8";
/*////////////////////////////////////////////////////////////
PetaMap - search.css

Copyright (C) Sony Marketing (Japan) Inc.
------------------------------------------------------------

    0. Import External CSS
    1. Common Style
        . Content Nav (Tab style)
    2. Top Page (Search Spot) Style
    3. Popular Map Search Page Style
    4. Spot Detail Page Style
    5. Map Detail Page Style

////////////////////////////////////////////////////////////*/

/* ------------------------------------------------------------
    0. Import External CSS
   ------------------------------------------------------------ */
@import "common.css";

/* ------------------------------------------------------------
    1. Common Style
   ------------------------------------------------------------ */

/* Content Nav */
div.blockSearch {
    position: relative;
    background: url(/common/images/spr_tab_01.png) no-repeat 0 0;
}

div#blockSearchSpot {}
div#blockSearchMap { background-position: -1000px 0;}
div#blockSearchUser { background-position: -2000px 0;}

body.pageMapDetail div.blockSearch { background-position: -3000px 0; }

ul.navContent { width: 691px; }

/* search box */
div.formSearch {
    width: 691px;
    margin-bottom: 10px;
}

div.formSearch dl.inputSearchWord {
    float: left;
    display: inline; /* For IE */
    width: 557px;
    height: 23px;
    margin: 0 10px;
    padding: 4px 10px;
    background: url(/common/images/bg_input_search_word_01.png) no-repeat 0 0;
}

div.formSearch dl.inputSearchWord dt,
div.formSearch dl.inputSearchWord dd {
    float: left;
    display: inline; /* For IE */
    margin-right: 6px;/*10px*/
    margin-left: 2px;
}

/* place */
div.formSearch dl.inputSearchWord dd.place {
    padding-right: 12px;
    background: url(/common/images/bg_input_search_word_divider_01.png) no-repeat 100% 0
}

div.formSearch dl.inputSearchWord dd.place input {
    width: 174px;
}

/* keyword */
div.formSearch dl.inputSearchWord dd.keyword {
    margin-right: 0;
}

div.formSearch dl.inputSearchWord dd.keyword input {
    width: 215px;/*228px;*/
}

div#blockSearchMap div.formSearch dl.inputSearchWord dd.keyword input {
    width: 480px;
}

/* search button */
div.formSearch ul.utility {
    float: left;
    line-height: 1px;
}

/* choice block */
div.blockChoice {
/*display: none;*/
    position: relative;
    clear: both;
    width: 900px;
    margin: 20px 6px 0;/*0 10px 15px;*/
    padding: 4px 0 0;
    background: #e6e6e6 url(bg_box_round_w900_01.png) no-repeat 0 0;
}

div.blockChoice dl.listChoice {
    width: 870px;
    padding: 10px 15px;
    background: #e6e6e6 url(bg_box_round_w900_01.png) no-repeat -900px 100%;
    font-size: 93%;
}

div.blockChoice dl.listChoice dt {
    margin-bottom: 6px;
}

div.blockChoice dl.listChoice a {
    float: left;
    margin-right: 20px;
    white-space: nowrap;
}

div.blockChoice div.linkClose {
    position: absolute;
    top: 5px;
    right: 10px;
}

/* --- Comment --- */
div#blockComment div.btnWriteComment {
    position: absolute;
    top: 10px;
    right: 15px;
}

div#blockComment div.btnList01 { position: static; } /* with .btnWriteComment */

/* Comment List */
div#blockComment div.blockCommentList {
    margin-bottom: 50px;
}

div#blockComment div.blockCommentList div.total {
    margin-bottom: 4px;
    font-weight: bold;
}

div#blockComment div.blockCommentList div.itemComment {
    position: relative;
    width: 550px;
    margin-bottom: 15px;
}

div#mapDetailExtraContent div#blockComment div.blockCommentList div.itemComment {
    width: 645px;
}

div.itemComment h4 {
    margin-bottom: 10px;
    padding: 5px;
    background: #f7f7f7;
    font-size: 93%;
    line-height: 1.1;
}

div.itemComment h4 strong {
    margin-right: 5px;
    padding-left: 8px;
    background: url(/common/images/line_03.png) no-repeat 0 2px;
}

div.itemComment div.commentContent {}

div.itemComment div.commentContent div.thumbAuthor {
    float: left;
    margin-right: 10px;
}

div.itemComment div.commentContent p.commentTxt {
    float: left;
    width: 400px;
    font-size: 93%;
}

div#mapDetailExtraContent div.itemComment div.commentContent p.commentTxt {
    width: 490px;
}

div.itemComment div.commentContent div.thumbSpot {
    float: right;
}

div.itemComment ul.utility {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 93%;
    line-height: 1.1;
}

div.itemComment ul.utility li {
    float: left;
    margin-left: 5px;
    padding-left: 5px;
    border-left: 1px solid #4d4d4d;
}

div.itemComment ul.utility li.linkEdit {
    border-left: none;
}

/* Comment Form */
div#blockComment div.blockInput {
    width: 550px;
    background-image: url(/common/images/bg_blk_input_02.png);
}

div#blockComment div.blockInput div.inner {
    background-image: url(/common/images/bg_blk_input_02.png);
    background-position: -1100px 100%;
}

div#blockComment div.blockInput div.wrapTbl {
    background-image: url(/common/images/bg_blk_input_02.png);
    background-position: -550px 0;
}

div#blockComment table.tblInput01 th {
    width: 130px;
    padding: 10px 10px 10px 22px;
    background-position: -8px -8px;
}

div#blockComment table.tblInput01 td {
    padding: 10px 15px;
}

div#blockComment table.tblInput01 th.empty {
    background-position: 0 -50px;
}

div#blockComment div.blockInput p.note04 {
    margin-top: 8px;
}

div#blockComment div.blockInput ul.listUploadImg li {
    margin-right: 0;
    background-color: #f1f8fe;
}

/* preview / delete comment */
div#blockComment div#blockCommentConfirm tr.first th,
div#blockComment div#blockCommentConfirm tr.first td,
div#blockComment div#blockCommentDelete tr.first th,
div#blockComment div#blockCommentDelete tr.first td { padding-bottom: 5px; }

div#blockComment div#blockCommentConfirm tr.first td p.txtHelp {
    margin-bottom: 0;
    color: #fd8544;
    font-weight: bold;
}

div#blockComment div#blockCommentDelete tr.first td p.txtHelp {
    margin-bottom: 0;
    color: #fd8544;
    font-weight: normal;
}

div#blockComment div#blockCommentConfirm td div.commentTxt,
div#blockComment div#blockCommentDelete td div.commentTxt {
    padding-bottom: 20px;
    font-size: 93%;
}

div#blockComment div#blockCommentConfirm td div.comment ul.listUploadImg,
div#blockComment div#blockCommentDelete td div.comment ul.listUploadImg {
    float: left;
    width: 80px;
    margin-top: 0;
}

div#blockComment div#blockCommentConfirm td div.comment ul.utility,
div#blockComment div#blockCommentDelete td div.comment ul.utility {
    float: right;
    display: inline;
}

div#blockComment div#blockCommentConfirm td div.comment ul.utility li,
div#blockComment div#blockCommentDelete td div.comment ul.utility li {
    float: left;
    margin-top: 46px;
    margin-left: 10px;
}


/* ------------------------------------------------------------
    2. Top Page (Search Spot) Style
   ------------------------------------------------------------ */


/* ------------------------------------------------------------
    3. Popular Map Search Page Style
   ------------------------------------------------------------ */
div#blockWeeklyPopularMap {
    width: 660px;
    margin: 10px 15px 20px;
}

.colMapName,
.colAddDate,
.colSpotNumber,
.colAddAuthor,
.colMapTakeout,
.colComment {}

table#tblWeeklyPopularMap {}

table#tblWeeklyPopularMap tbody th.colMapName {
    text-align: left;
}

table#tblWeeklyPopularMap tbody th.colMapName a {
    display: block;
    margin-left: 4px;
    padding-left: 8px;
    border-left: 3px solid #1e8cba;
}

table#tblWeeklyPopularMap td.colComment {
    padding-top: 0;
    padding-left: 18px;
    font-size: 83%;
    text-align: left;
}

/* ------------------------------------------------------------
    4. Spot Detail Page Style
   ------------------------------------------------------------ */

/*  -. Header
   ------------------------------------------------- */
/* Spot Name & Genre */
div#spotDetailHeader .spotName {
    padding: 11px 0 16px 40px;
    background: url(/common/images/ico_ttl_spot_a_01.png) no-repeat 0 0;
    font-size: 123.1%;
    line-height: 1.2;
    font-weight: bold;
}

div.pageOfficial div#spotDetailHeader .spotName {
    background-image: url(/common/images/ico_ttl_spot_b_01.png);
}

div#spotDetailHeader .spotName span {
    display: block;
    width: 380px;
}

div.pageBuzz div#spotDetailHeader .spotName span {
    width: 790px;
}

div#spotDetailHeader div.genre {
    position: absolute;
    top: 20px;
    right: 15px;
    text-align: right;
}

/* Tel & Cuopon */
div#spotDetailHeader ul.useful {
    position: absolute;
    top: 20px;
    right: 60px;
    padding-right: 15px;
    background: url(/common/images/line_02.png) repeat-y 100% 0;
}

div#spotDetailHeader ul.useful li { float: left; }

div#spotDetailHeader ul.useful li.reserve {
    margin-right: 12px;
    background: url(/common/images/bg_reserve_tell_01.png) no-repeat 0 0;
}

div#spotDetailHeader ul.useful li.reserve img {
    float: left;
    padding: 9px 0 8px 15px;
    margin-right: 6px;
}

div#spotDetailHeader ul.useful li.reserve strong.tel {
    float: left;
    padding: 9px 15px 8px 0;
    background: url(/common/images/bg_reserve_tell_01.png) no-repeat 100% 0;
    color: #e40a27;
    font-size: 16px;
    line-height: 1.1;
    white-space: nowrap;
}

div#spotDetailHeader ul.useful li.coupon { margin-top: 5px; }

/* Info & Utiltiy */
div#spotDetailHeader div.group { }

div#spotDetailHeader ul.info {
    float: left;
    width: 466px;
}

div#spotDetailHeader ul.utility {
    float: right;
}

div#spotDetailHeader ul.utility li {
    float: left;
    padding-left: 6px;
    text-align: right;
}
div#spotDetailHeader ul.utility li.addFav {}
div#spotDetailHeader ul.utility li.editSpotInfo {}
div#spotDetailHeader ul.utility li.goBackMap {}

/*  -. Content
   ------------------------------------------------- */
div#spotDetailContent {
    padding: 20px 15px 30px;
}

/* --- Map --- */
div#spotDetailContent div#blockMap02 {
    float: left;
    width: 446px;
    height: 512px;
    padding: 15px 10px;
    background: url(/common/images/bg_map_spot_detail_01.png) no-repeat 0 0;
}

div#spotDetailContent div#blockMap02 ul.mainUtility {
    position: relative;
    margin-bottom: 10px;
    padding: 5px 7px;
    background: #f2f2f2;
}

div#spotDetailContent div#blockMap02 ul.mainUtility li {
    position: relative;
    float: left;
    margin-right: 10px;
}

div#spotDetailContent div#blockMap02 ul.mainUtility li.actGoWebsite {
    float: none;
    position: absolute;
    top: 9px;
    right: 7px;
    margin-right: 0;
}

div#spotDetailContent div#blockMap02 ul.mainUtility li a span.tooltip {
    display: none;
    position: absolute;
    top: 35px;
    left: -24px;
    width: 87px;
    padding: 20px 8px 18px 5px;
    background: url(/common/images/bg_tooltip_01.png) no-repeat 0 0;
    color: #fff;
    font-size: 12px;
    text-align: center;
}

div#spotDetailContent div#blockMap02 ul.mainUtility li a:hover span.tooltip {
    display: block;
}

div#spotDetailContent div#blockMap02 div#mapBody {
    margin-bottom: 10px;
}

div#spotDetailContent div#blockMap02 ul.subUtiltiy {
    width: 466px;
}

div#spotDetailContent div#blockMap02 ul.subUtility li {
    float: left;
    margin-top: 5px;
}

div#spotDetailContent div#blockMap02 ul.subUtility li.printMap {
    float: right;
    margin-top: 0;
}

div#spotDetailContent div#blockMap02 ul.subUtility li.recomMap {
    margin-top: 0;
    font-size: 93%;
}

div#spotDetailContent div#blockMap02 ul.subUtility li.recomMap select {
   width: 188px;
}

/* --- Details --- */
div#spotDetailContent div#details {
    float: right;
    width: 408px;
}

/* author */
div#spotDetailContent div#details ul.spotAuthor {
    float: left;
    position: relative;
    width: 262px;
    height: 87px;
    margin-right: 10px;
    padding-bottom: 10px;
    background: url(/common/images/bg_spot_author_a_01.png) no-repeat 0 0;
}

div#spotDetailContent div#details ul.spotAuthor li.thumb {
    position: absolute;
    top: 12px;
    left: 15px;
}

div#spotDetailContent div#details ul.spotAuthor li.name {
    position: absolute;
    top: 40px;
    left: 114px;
    color: #1e8cba;
    font-size: 93%;
    line-height: 1.1;
}

div#spotDetailContent div#details ul.spotAuthor li.name img {
    float: left;
}

div#spotDetailContent div#details ul.spotAuthor li.name span {
    display: block;
    margin-left: 45px;
}

div.pageOfficial div#spotDetailContent div#details ul.spotAuthor {
    background-image: url(/common/images/bg_spot_author_b_01.png);
}

div.pageOfficial div#spotDetailContent div#details ul.spotAuthor li.thumb {
    top: 26px;
    left: 11px;
}

div.pageOfficial div#spotDetailContent div#details ul.spotAuthor li.name {
    top: 8px;
    left: 13px;
}

/* mobile site */
div#spotDetailContent div#details dl.infoMobileSite {
    float: left;
    position: relative;
    width: 136px;
    height: 87px;
    background: url(/common/images/bg_view_mobile_site_a_01.png) no-repeat 0 0;
}

div.pageOfficial div#spotDetailContent div#details dl.infoMobileSite {
    background-image: url(/common/images/bg_view_mobile_site_b_01.png);
}

div#spotDetailContent div#details dl.infoMobileSite dt {
    position: absolute;
    top: 4px;
    left: 1px;
    text-align: left;

}

div#spotDetailContent div#details dl.infoMobileSite dd {
	position: absolute;
    top: 5px;
    left: 55px;

}

/* Spot Image List*/
div#spotDetailContent div#details ul.listSpotImg {
    clear: both;
    width: 408px;
    margin: 0 -5px 10px 0;
}

div#spotDetailContent div#details ul.listSpotImg li {
    float: left;
    margin-right: 4px;
}

div#spotDetailContent div#details ul.listSpotImg li a {
    display: block;
    width: 62px;
    height: 62px;
    border: 1px solid #1b85b4;
}

div.pageOfficial div#spotDetailContent div#details ul.listSpotImg li a {
    border-color: #dd364c;
}

/* Spot Info Block */
div#spotDetailContent div#details div#blockSpotInfo dl {
    height: 300px;
    overflow: auto;
}

/*  -. Extra Content
   ------------------------------------------------- */
div#spotDetailExtraContent {}

/* --- Tag --- */
div#blockTag p.lead {
    margin-bottom: 10px;
    font-size: 85%;
    line-height: 1;
}

ul.listTag {
    width: 270px;
}

ul.listTag li.itemTag {
    padding: 5px 4px;
}

ul.listTag li.itemTag div.tagName {
    float: left;
    width: 250px;
    padding-left: 8px;
    background: url(/common/images/line_03.png) no-repeat 0 0;
    font-size: 93%;
    line-height: 1.1;
}

ul.listTag li.itemTag ul.rating {
    float: left;
}

div#blockTag div.linkEditTag {
    position: absolute;
    top: 16px;
    right: 10px;
    font-size: 85%;
}

/* --- Related Content --- */
div#blockRelatedContent div.content {
    margin-bottom: 20px;
}

div#blockRelatedContent div.content ul.linkList02 {
    font-size: 93%;
    margin-bottom: 15px;
}

div#blockRelatedContent div.content div.btnWriteDiary,
div#blockRelatedContent div.content div.btnReportSpot {
    text-align: center;
}

/* ------------------------------------------------------------
    5. Map Detail Page Style
   ------------------------------------------------------------ */
div#mapDetailHeader {
    width: 910px;
    padding-right: 5px;
    padding-left: 5px;
}

div#mapDetailHeader .mapName {
    padding: 5px 0 5px 45px;
    background: url(/common/images/ico_ttl_map_01.png) no-repeat 15px 0;
    border-bottom: none;
    font-size: 123.1%;
    line-height: 1.2;
    font-weight: bold;
}

div#mapDetailHeader .mapName span {
    display: block;
    width: 380px;
}

div#mapDetailHeader div.statusAdd {
    position: absolute;
    top: 20px;
    right: 15px;
    text-align: right;
}

div#mapDetailHeader div.blockDetailInfo {
    width: 910px;
    margin-bottom: 20px;
    padding-top: 20px;
    background: url(/common/images/bg_map_detail_a_01_top.png) no-repeat 0 0;
}

div.pageOfficial div#mapDetailHeader div.blockDetailInfo {
    background-image: url(/common/images/bg_map_detail_b_01_top.png);
}

div#mapDetailHeader div.blockDetailInfo div.inner {
    width: 870px;
    padding: 0 20px 10px;
    background: url(/common/images/bg_map_detail_a_01_btm.png) no-repeat 0 100%;
}

div.pageOfficial div#mapDetailHeader div.blockDetailInfo div.inner {
    background-image: url(/common/images/bg_map_detail_b_01_btm.png);
}

/* Basic Info */
div.blockDetailInfo div.basicInfo {
    float: left;
    width: 500px;
    padding-bottom: 10px;
}

div.blockDetailInfo div.basicInfo p.copy {
    margin-bottom: 20px;
    font-size: 93%;
}

div.blockDetailInfo div.basicInfo ul.meta li {
    display: inline;
    font-size: 93%;
}

div.blockDetailInfo div.basicInfo ul.meta li span.label {
    font-weight: bold;
}

/* 2010.03.09 Mod Start */
/*
 * div.blockDetailInfo div.basicInfo ul.meta li span.datedata {
 *     margin-right: 25px;
 * }
 */
div.blockDetailInfo div.basicInfo ul.meta li span.countdata {
    font-size: 135%;
    margin-right: 25px;
}

div.blockDetailInfo div.basicInfo ul.meta li span.datedata {
    margin-right: 25px;
}
/* 2010.03.09 Mod End */

/* Info Provider */
div.blockDetailInfo div.infoProvider {
    float: right;
    width: 360px;
}

div.blockDetailInfo div.infoProvider div.bnr,
div.blockDetailInfo div.infoProvider p.txt {
    float: right;
}

div.blockDetailInfo div.infoProvider div.bnr {
    padding-left: 10px;
}

div.blockDetailInfo div.infoProvider p.txt strong {
    font-size: 93%;
    font-weight: normal;
}

div.blockDetailInfo div#groupInfo02 {
    padding-top: 10px;
    background: url(/common/images/line_05.png) repeat-x 0 0;
}

div.pageOfficial div.blockDetailInfo div#groupInfo02 {
    background-image: url(/common/images/line_06.png);
}

/* --- Author Comment --- */
div#mapDetailHeader div.blockDetailInfo div.blockAuthorComment {
    float: left;
    padding-top: 17px;
    font-size: 93%;
}

div.pageOfficial div#mapDetailHeader div.blockDetailInfo div.blockAuthorComment {
    background-image: url(/common/images/bg_blk_b_103_top.png);
}

div#mapDetailHeader div.blockDetailInfo div.blockAuthorComment div.inner {
    width: 659px;
    padding: 0 16px 20px;
    background-image: url(/common/images/bg_blk_b_102_btm.png);
}

div.pageOfficial div#mapDetailHeader div.blockDetailInfo div.blockAuthorComment div.inner {
    background-image: url(/common/images/bg_blk_b_103_btm.png);
}

div#mapDetailHeader div.blockDetailInfo div.blockAuthorComment h3 {
    padding-bottom: 10px;
}

/* --- Utility --- */
div.blockDetailInfo div#groupInfo02 ul.utility {
    flaot: right;
    text-align: right;
}

div.blockDetailInfo div#groupInfo02 ul.utility li {
    padding-bottom: 5px;
}
/* common */
ul.cnav11, 
ul.cnav02, 
ul.cnav03, 
ul.cnav04{
	width:691px;
	height:35px;
	position:relative;
}

/* view.xhtml */

ul.cnav11 {
	background: url(/common/images/bg_search2_box_01_top.jpg) no-repeat 0px 0px;
}

ul.cnav11 li {
	display:block;
	position:absolute;
}


ul.cnav11 li.navItem01 {
	top: 10px;
	left: 22px;
	margin:0px;
}

ul.cnav11 li.navItem02 {
	top: 10px;
	left: 196px;
	margin:0px;
}
ul.cnav11 li.navItem03 {
	top: 10px;
	left: 370px;
	margin:0px;
}
ul.cnav11 li.navItem04 {
	top: 10px;
	left: 540px;
	margin:0px;
}

/* view_spot.xhtml */
ul.cnav02 {
	background: url(/common/images/bg_search2_box_01_top.jpg) no-repeat -1000px 0px;
}

ul.cnav02 li {
	display:block;
	position:absolute;
}

ul.cnav02 li.navItem01 {
	top: 10px;
	left: 22px;
	margin:0px;
}
ul.cnav02 li.navItem02 {
	top: 10px;
	left: 191px;
	margin:0px;
}
ul.cnav02 li.navItem03 {
	top: 10px;
	left: 368px;
	margin:0px;
}
ul.cnav02 li.navItem04 {
	top: 10px;
	left: 540px;
	margin:0px;
}

/* search.html */
ul.cnav03 {
	background: url(/common/images/bg_search2_box_01_top.jpg) no-repeat -2000px 0px;
}

ul.cnav03 li {
	display:block;
	position:absolute;
}

ul.cnav03 li.navItem01 {
	top: 10px;
	left: 22px;
	margin:0px;
}
ul.cnav03 li.navItem02 {
	top: 10px;
	left: 193px;
	margin:0px;
}
ul.cnav03 li.navItem03 {
	top: 10px;
	left: 363px;
	margin:0px;
}
ul.cnav03 li.navItem04 {
	top: 10px;
	left: 540px;
	margin:0px;
}

/* search_user.html */
ul.cnav04 {
	background: url(/common/images/bg_search2_box_01_top.jpg) no-repeat -3000px 0px;
}

ul.cnav04 li {
	display:block;
	position:absolute;
}

ul.cnav04 li.navItem01 {
	top: 10px;
	left: 22px;
	margin:0px;
}
ul.cnav04 li.navItem02 {
	top: 10px;
	left: 196px;
	margin:0px;
}
ul.cnav04 li.navItem03 {
	top: 10px;
	left: 368px;
	margin:0px;
}
ul.cnav04 li.navItem04 {
	top: 10px;
	left: 540px;
	margin:0px;
}