@charset "utf-8";


/* =====================================================================
*
*    salon.css INDEX
*
*    // サロン検索カテゴリのスタイル
*
*
*    1. Main Contents
*       1.1. Keyword Search
*       1.2. Area Search
*       1.3. Products Search
*       1.4. Search Results
*            1.4.1. Result Unit
*            1.4.2. City List
*
*    2. Map
*
*    3. Institut Salon
*       3.1. Salon Top - Institut Salon
*       3.2. Institut Salon
*       3.3. Ambassador Salon
*       3.4. Homme Presale Hair Salon
*
*    4. Side Contents
*
* =================================================================== */


/* =====================================================================
*
*    1. Main Contents
*
* =================================================================== */

h1 {
	height: 56px;
	margin: 0 0 14px 0;
	background: url(../images/ttl.png) no-repeat;
}

#ttlDesc {
	height: 18px;
	margin: 0 0 30px 0;
	background: url(../images/desc.png) no-repeat;
}

/* ------------------------------------------------------------------ */
/*                                                                    */
/* ! 1.1. News */
/*                                                                    */
/* ------------------------------------------------------------------ */

#news {
	position: relative;
	margin-bottom: 34px;
}

#newsRibbon {
	position: absolute;
	right: 2px;
	top: 0;
}

#news .cont {
	padding: 12px 17px;
}

#newsIcon{
	float: left;
}

#newsBody{
	float: right;
	width: 560px;
}

#newsBody h3{
	margin-bottom: 14px;
}

#newsBody p.mt10{
	color:#ec284d;
	margin-top:10px;
}


/* ---------------------------------------------------------------------
*
*    1.1 Keyword Search
*
* ------------------------------------------------------------------- */

#keywordSearch h2 {
	float: left;
	height: 41px;
	width: 304px;
	background: url(../images/keyword_ttl.jpg) no-repeat;
}


/* ---------------------------------
*    Search Form
*/

#keywordSearch form {
	width: 650px;
	height: 32px;
	margin: 17px 0 0 0;
	padding: 18px 12px 16px 12px;
	overflow: hidden;
	background: url(../images/search_base.jpg) no-repeat;
}

#keywordSearch #keyword {
	width: 321px;
	height: 19px;
	margin: 0;
	padding: 5px 5px 5px 5px;
	border: none;
	background: url(../images/search_box.gif) no-repeat;
	vertical-align: top;
}

#keywordSearch #submit {
	width: 85px;
	height: 32px;
}


/* ---------------------------------------------------------------------
*
*    1.2 Area Search
*
* ------------------------------------------------------------------- */

body.index #areaSearch { margin-top: 34px; }

#areaSearch h2 {
	float: left;
	height: 41px;
	width: 234px;
	background: url(../images/area_ttl.jpg) no-repeat;
}

#areaSearch p {
	padding: 10px 0 17px 0;
}


/* ---------------------------------------------------------------------
*
*    1.3 Product Search
*
* ------------------------------------------------------------------- */

#productsSearch {
	float: right;
}

#productsSearch span.ttl {
	display: block;
	float: left;
	width: 129px;
	height: 41px;
}

	#keywordSearch #productsSearch span.ttl { background: url(../images/keyword_item_ttl.jpg) no-repeat; }
	#areaSearch #productsSearch span.ttl { background: url(../images/area_item_ttl.jpg) no-repeat; }

#productsSearch #productsList {
	height: 19px;
	margin: 11px 0 0 0;	
	padding: 0;
}

#keywordSearch p {
	padding-top: 10px;
}


/* ---------------------------------------------------------------------
*
*    1.4 Search Results
*
* ------------------------------------------------------------------- */

#resultHead {
	padding: 27px 17px;
}

#resultHead h3 {
	float: left;
	color: #555555;
}

	#resultHead h3 span.quo {
		display: block;
		float: left;
		margin: 0 10px 0 0;
		padding: 7px 0 7px 24px;
		background: url(../images/mark_quot_l.gif) left top no-repeat;
	}

	#resultHead h3 strong {
		padding: 7px 22px 7px 0;
		background: url(../images/mark_quot_r.gif) right bottom no-repeat;
		font-weight: bold;
		color: #00BEF3;
	}

	#resultHead h3 span.desc {
		display: block;
		float: left;
		padding: 10px 0 0 0;
	}

#resultHead p.count {
	float: right;
	padding: 14px 0 0 20px;
	line-height: 100%;
}

/* ---------------------------------------------------------------------
*    1.4.1 Result Unit
* ------------------------------------------------------------------- */

#results .unit {
	position: relative;
	width: 674px;
	padding: 20px 17px 17px 17px;
	background: url(../images/result_bdr.jpg) left top no-repeat;
}

	#results .odd {
		background-color: #F3F3F3;
	}

#results .unit .ttl {
	height: 28px;
	line-height: 28px;
	vertical-align: middle;
}

#results .unit h4 {
	float: left;
	font-weight: bold;
}

#results .unit .iconSet {
	float: right;
}

#results .unit .iconSet img {
	padding: 0 0 0 1px;
}

#results .unit .iconSetFlagship {
	clear: both;
	margin-top: 10px;
}

#results .iconSetFlagship img {
	margin-right: 5px;
	margin-bottom: 5px;}

#results .iconCampaign {
	margin-right: 5px;
}

#results .iconSetFlagship .iconGift {
	margin-right: 7px;
}


/* ---------------------------------
*    Details
*/

#results .unit dl {
	width: 100%;
	margin-top: 15px;
	line-height: 100%;
}

#results .unit dl dt {
	clear: both;
	float: left;
	width: 56px;
	height: 6px;
	margin: 4px 10px 8px 0;
}

	#results .unit dl dt.dtAdd { background: url(../images/dt_address.png) no-repeat; }
	#results .unit dl dt.dtTel { background: url(../images/dt_tel.png) no-repeat; }
	#results .unit dl dt.dtSt  { background: url(../images/dt_station.png) no-repeat; }
	#results .unit dl dt.dtHp  { background: url(../images/dt_homepage.png) no-repeat; }

#results .unit .outLink {
	padding-right: 15px;
	background: url(../images/result_mark_out.gif) right top no-repeat;
}

#results .unit dl dd {
	padding: 2px 0 8px 0;
	color: #555555;
}

	#results .unit dl dd.ddHp { padding-bottom: 0; }


/* ---------------------------------
*    Google Map Button
*/

#results .unit .gmBtn {
	position: absolute;
	right: 15px;
	bottom: 13px;
	width: 186px;
	height: 24px;
	background: url(../images/result_btn_google.jpg) 0 -24px;
}
#results .odd .gmBtn { background-image: url(../images/result_btn_google_g.jpg); }
#results .unit .gmBtn:hover { background-position: 0 0; }


/* ---------------------------------
*    Baloons (Tool Tips)
*/

#balSet { display: none; }



/* ---------------------------------------------------------------------
*    1.4.2 City List
* ------------------------------------------------------------------- */

#cityList .clUnit {
	width: 674px;
	padding: 20px 17px 7px 17px;
	background: url(../images/result_bdr.jpg) left top no-repeat;
}

	#cityList .odd {
		background-color: #F3F3F3;
	}

#cityList .clUnit ul {
	width: 620px;
	padding: 0 0 0 54px;
}

	ul#clA  { background: url(../images/ch_a.gif) no-repeat; }
	ul#clKA { background: url(../images/ch_ka.gif) no-repeat; }
	ul#clSA { background: url(../images/ch_sa.gif) no-repeat; }
	ul#clTA { background: url(../images/ch_ta.gif) no-repeat; }
	ul#clNA { background: url(../images/ch_na.gif) no-repeat; }
	ul#clHA { background: url(../images/ch_ha.gif) no-repeat; }
	ul#clMA { background: url(../images/ch_ma.gif) no-repeat; }
	ul#clYA { background: url(../images/ch_ya.gif) no-repeat; }
	ul#clRA { background: url(../images/ch_ra.gif) no-repeat; }
	ul#clWA { background: url(../images/ch_wa.gif) no-repeat; }

#cityList .clUnit li {
	float: left;
	padding: 0 20px 10px 0;
}

#cityList .clUnit li a {
	color: #555555;
	text-decoration: none;
	padding-left: 14px;
	background: url(../images/map_mark.gif) 0 2px no-repeat;
}
#cityList .clUnit li a:visited { color: #555555; text-decoration: none; }
#cityList .clUnit li a:hover   {
	color: #00BEF3;
	text-decoration: underline;
	background: url(../images/map_mark_h.gif) 0 2px no-repeat;
}
#cityList .clUnit li a:active  { color: #00BEF3; text-decoration: underline; }


/* =====================================================================
*
*    2. Map
*
* =================================================================== */

#map {
	position: relative;
	width: 674px;
	height: 495px;
	overflow: hidden;
}

#map .areaList {
	font-size: 12px;
}

#map .areaList li {
	padding: 0 10px 3px 0;
	line-height: 15px;
}

#map a         {
	color: #497288;
	text-decoration: none;
	padding-left: 14px;
	background: url(../images/map_mark.gif) 0 2px no-repeat;
}
#map a:visited { color: #497288; text-decoration: none; }
#map a:hover   {
	color: #00BEF3;
	text-decoration: underline;
	background: url(../images/map_mark_h.gif) 0 2px no-repeat;
}
#map a:active  { color: #00BEF3; text-decoration: underline; }


/* ---------------------------------
*    Hokkaido Area
*/

#map #hokkaido {
	position: absolute;
	right: 160px;
	top: 40px;
	padding: 0 59px 0 0;
}

#map #hokkaido h3 {
	position: absolute;
	right: 0;
}

#map #hokkaido ul { padding-top: 3px; }


/* ---------------------------------
*    Tohoku Area
*/

#map #tohoku {
	position: absolute;
	width: 120px;
	left: 530px;
	top: 240px;
}

#map #tohoku h3 {
	position: absolute;
	left: -10px;
	top: -35px;
}

#map #tohoku ul li {
	float: left;
}


/* ---------------------------------
*    Hokuriku Area
*/

#map #hokuriku {
	position: absolute;
	width: 120px;
	left: 315px;
	bottom: 240px;
	padding-bottom: 40px;
}

#map #hokuriku h3 {
	position: absolute;
	bottom: 0;
}

#map #hokuriku ul li {
	float: left;
}


/* ---------------------------------
*    Kanto Area
*/

#map #kanto {
	position: absolute;
	width: 180px;
	left: 460px;
	top: 390px;
}

#map #kanto h3 {
	position: absolute;
	left: -10px;
	top: -35px;
}

#map #kanto ul li {
	float: left;
}


/* ---------------------------------
*    Tokai Area
*/

#map #tokai {
	position: absolute;
	width: 120px;
	left: 320px;
	bottom: 17px;
}

#map #tokai h3 { padding-bottom: 15px; }

#map #tokai ul li {
	float: left;
}


/* ---------------------------------
*    Kinki Area
*/

#map #kinki {
	position: absolute;
	left: 230px;
	bottom: 195px;
	padding-bottom: 40px;
}

#map #kinki h3 {
	position: absolute;
	bottom: 0;
}


/* ---------------------------------
*    Shikoku Area
*/

#map #shikoku {
	position: absolute;
	width: 120px;
	left: 175px;
	bottom: 17px;
}

#map #shikoku h3 { padding-bottom: 15px; }

#map #shikoku ul li {
	float: left;
}


/* ---------------------------------
*    Chugoku Area
*/

#map #chugoku {
	position: absolute;
	left: 130px;
	bottom: 175px;
	padding-bottom: 56px;
}

#map #chugoku h3 {
	position: absolute;
	padding-bottom: 15px;
	bottom: 0;
}


/* ---------------------------------
*    Kyusyu Area
*/

#map #kyusyu {
	position: absolute;
	left: 17px;
	bottom: 165px;
	padding-bottom: 40px;
}

#map #kyusyu h3 {
	position: absolute;
	bottom: 0;
}


/* ---------------------------------
*    Okinawa Area
*/

#map #okinawa {
	position: absolute;
	left: 27px;
	top: 27px;
	padding: 4px 0 0 56px;
}

#map #okinawa h3 {
	position: absolute;
	left: 0;
	top: 0;
}


/* =====================================================================
*
*    3. Institut Salon
*
* =================================================================== */

/* ---------------------------------------------------------------------
*
*    3.1. Salon Top
*
* ------------------------------------------------------------------- */

body.index .pick h2 {
	height: 52px;
	margin: 15px 0 0 0;
}

	body.index #hommeSalon h2 { background: url(../images/index_ho_ttl.png) left top no-repeat; }
	body.index #institutSalon h2 { background: url(../images/index_flag_ttl.png) left top no-repeat; }
	body.index #ambassadorSalon h2 { background: url(../images/index_amb_ttl.png) left top no-repeat; }
	body.index #privilegeSalon h2 { background: url(../images/index_privilege_ttl.png) left top no-repeat; }

body.index .pick ul {
	width: 708px;
	padding: 7px 0 7px 0;
}

body.index .pick ul li {
	position: relative;
	margin: 0 0 12px 0;
	padding: 0 17px 13px 7px;
	background: url(../../common/images/bdr_panel.jpg) left bottom no-repeat;
}

body.index .pick ul li.last {
	margin-bottom: 0;
	padding-bottom: 0;
	background: none;
}

body.index .pick ul li .cont {
	float: right;
	width: 468px;
	padding: 10px 0;
}

body.index .pick ul li .subttl {
	padding: 0 0 10px 0;
}

body.index .pick h3 {
	height: 23px;
	margin: 0 0 7px 0;
}

	body.index #hommeSalon h3 { background: url(../images/index_ho_subttl.gif) 0 0 no-repeat; }
	body.index #institutSalon h3 { background: url(../images/index_flag_subttl.gif) 0 0 no-repeat; }
	body.index #ambassadorSalon h3 { background: url(../images/index_amb_subttl.gif) 0 0 no-repeat; }
	body.index #privilegeSalon h3 { background: url(../images/index_privilege_subttl.gif) 0 0 no-repeat; }

body.index .pick ul img.thm {
	float: left;
}

body.index .pick ul img.btn {
	position: absolute;
	right: 15px;
	bottom: 3px;
}

body.index .iconDesc {
	margin: 10px 0 37px 0;
}
body.index .iconDesc p {
	color: #888888;
}
body.index .iconDesc .explain {
	margin: 4px 0 0 0;
	letter-spacing: 0;
}

p.pt5 { padding-top: 5px; }

/* ---------------------------------------------------------------------
*
*    3.2. Institut Salon
*
* ------------------------------------------------------------------- */

body.flag h1 {
	background: url(../images/flag_ttl.png) no-repeat;
}

body.flag #flagTtl {
	height: 28px;
	margin: 0;
	background: url(../images/flag_ttl_desc.png) no-repeat;
}

body.flag #flagTtlDesc {
	margin: 0 20px 0 20px;
}

body.flag .iconDesc {
	width: 668px;
	margin: 20px auto 0 auto;
}
body.flag .iconDesc p {
	color: #888888;
	margin: 0 0 4px 0;
}
body.flag .iconDesc .explain {
	margin: 4px 0 0 0;
	letter-spacing: 0;
}

#flagList .pad {
	padding: 0 17px;
}

#flagList .desc {
	padding: 17px 0 0 0;
	line-height: 195%;
}

#flagList .flagPad {
	width: 680px;
	height: auto;
	overflow: hidden;
	margin: 0 14px 0 14px;
	padding: 12px 0 12px 0;
}

#flagList h2 {
	padding-bottom: 17px;
}

#flagList .row {
	clear: both;
	width: 688px;
	padding: 17px 0 0 0;
}

#flagList .salonCont {
	float: left;
	width: 336px;
	padding: 0 8px 0 0;
}

#flagList img.salonCatch {
	margin-bottom: 12px; 
}

#flagList .detail {
	width: 323px;
	padding: 0 0 0 6px;	
}

#flagList h3 {
	float: left;
	width: 198px;
	height: 24px;
}

	body.flag #salon1  h3 { background: url(../images/flag_salon01_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon2  h3 { background: url(../images/flag_salon02_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon3  h3 { background: url(../images/flag_salon03_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon4  h3 { background: url(../images/flag_salon04_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon5  h3 { background: url(../images/flag_salon05_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon6  h3 { background: url(../images/flag_salon06_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon7  h3 { background: url(../images/flag_salon07_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon8  h3 { background: url(../images/flag_salon08_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon9  h3 { background: url(../images/flag_salon09_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon10 h3 { background: url(../images/flag_salon10_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon11 h3 { background: url(../images/flag_salon11_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon12 h3 { background: url(../images/flag_salon12_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon13 h3 { background: url(../images/flag_salon13_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon14 h3 { background: url(../images/flag_salon14_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon15 h3 { background: url(../images/flag_salon15_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon16 h3 { background: url(../images/flag_salon16_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon17 h3 { background: url(../images/flag_salon17_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon18 h3 { background: url(../images/flag_salon18_ttl.jpg) 0 2px no-repeat; }
	body.flag #salon19 h3 { background: url(../images/flag_salon19_ttl.jpg) 0 2px no-repeat; }


#flagList .mapBtn {
	float: right;
}

#flagList .add {
	clear: both;
	padding: 13px 0 0 0;
}

#flagList .tel {
	padding-top: 7px;
}

#campaignBanner {
	text-align: center;
	padding: 0 0 19px 0;
}

#flagList .textR {
	clear: both;
	text-align: right;
	color: #888888;
	margin: 0;	
}


/* ---------------------------------
*    Data
*/

#flagList dl.data {
	clear: both;
	width: 100%;
	line-height: 120%;
	padding-top: 7px;
}

#flagList dl.data dt {
	clear: both;
	float: left;
	width: 56px;
	height: 6px;
	margin: 4px 0 8px 0;
}

	#flagList dl.data dt.dtAdd { background: url(../images/dt_address.png) no-repeat; }
	#flagList dl.data dt.dtTel { background: url(../images/dt_tel.png) no-repeat; }
	#flagList dl.data dt.dtSt  { background: url(../images/dt_station.png) no-repeat; }
	#flagList dl.data dt.dtHp  { background: url(../images/dt_homepage.png) no-repeat; }

#flagList dl.data dd {
	display: block;
	float: right;
	width: 257px;
	padding: 2px 0 6px 0;
	color: #555555;
}

* html #flagList dl.data dd { float: none; }
*:first-child+html #flagList dl.data dd { float: none; }


/* ---------------------------------------------------------------------
*
*    3.3. Ambasaddor Salon
*
* ------------------------------------------------------------------- */

/* ------------------------------------------------------------------ */
/* ! Header */
/* ------------------------------------------------------------------ */

body.amb #catchBody {
	float: left;
	width: 300px;
	margin: 0 0 0 17px;
}

body.amb #catchTitle {
	height: 51px;
	margin: 28px 0 35px 0;
	background: url(../images/amb_catch_ttl.png) no-repeat;
}

body.amb #catchDesc {
	height: 47px;
	background: url(../images/amb_catch_desc.png) no-repeat;
}

body.amb #catchImg {
	float: right;
	margin: 0 30px 0 0;
}

body.amb h1 {
	background: url(../images/amb_ttl.png) no-repeat;
}


/* ------------------------------------------------------------------ */
/* ! Catch */
/* ------------------------------------------------------------------ */

body.amb #flagList .ptop {
	background-image: url(../images/amb_pabel_top.png);
}

#amb-panelTop {
	position: relative;
	min-height: 122px;
	height: auto !important;
	height: 122px;
	padding: 22px 17px 20px 17px;
	background: #29292B url(../images/amb_panel_bg.jpg) no-repeat;
}

#amb-panelTop .catch {
	width: 402px;
	height: 42px;
	background: url(../images/amb_panel_ttl.png) no-repeat;
}

#amb-panelTop .desc {
	margin-top: 0 0 0 0;
	padding: 27px 0 0 0;
	color: #9B9B9B;
}

#amb-panelTop .pic {
	position: absolute;
	left: 417px;
	top: -15px;
}


/* ------------------------------------------------------------------ */
/* ! Prefecture Index */
/* ------------------------------------------------------------------ */

#prefIndex {
	position: relative;
	z-index: 10;
	width: 674px;
	margin-top: 7px;
	padding-top: 27px;
}

#prefIndex li {
	float: left;
	width: 135px;
	padding-bottom: 7px;
}

#prefIndex li.wrap {
	width: 134px;
}

#prefIndex a {
    padding: 0 0 0 14px;
    background: url(../../common/images/ch/li_mark.png) 0 2px no-repeat;
    color: #D4D3D3;
    text-decoration: none;
}
#prefIndex a:visited { color: #D4D3D3; text-decoration: none; }
#prefIndex a:hover   {
    background: url(../../common/images/ch/li_mark_h.png) 0 2px no-repeat;
    color: #FAFCFD;
    text-decoration: underline;
}
#prefIndex a:active  { color: #FAFCFD; text-decoration: underline; }


/* ------------------------------------------------------------------ */
/* ! List */
/* ------------------------------------------------------------------ */

body.amb .list-footer {
	margin-top: 10px;
	padding-bottom: 18px;
	background: url(../images/result_bdr.jpg) left bottom repeat-x;
}

body.amb #list-footer-last {
	padding-bottom: 0;
	background: none;
}

body.amb .list-footer a {
	width: 125px;
	height: 10px;
	margin-left: 540px;
	background: url(../images/amb_btn_index.gif) 0 -10px no-repeat;
}
body.amb .list-footer a:hover { background-position: 0 0; }

body.amb .prefTitle {
	width: 236px;
	height: 18px;
	margin-bottom: 13px;
	padding-left: 8px;
	border-left: 1px solid #222222;
	background: transparent 8px 0 no-repeat;
}

#aichi-list     .prefTitle { background-image: url(../images/amb_list_ttl_aichi.gif); }
#ishikawa-list  .prefTitle { background-image: url(../images/amb_list_ttl_ishikawa.gif); }
#osaka-list     .prefTitle { background-image: url(../images/amb_list_ttl_osaka.gif); }
#saitama-list   .prefTitle { background-image: url(../images/amb_list_ttl_saitama.gif); }
#tokyo-list     .prefTitle { margin-top: 17px; margin-bottom: 0; background-image: url(../images/amb_list_ttl_tokyo.gif); }
#hiroshima-list .prefTitle { background-image: url(../images/amb_list_ttl_hiroshima.gif); }
#hyogo-list     .prefTitle { background-image: url(../images/amb_list_ttl_hyogo.gif); }
#fukuoka-list   .prefTitle { background-image: url(../images/amb_list_ttl_fukuoka.gif); }
#hokkaido-list  .prefTitle { background-image: url(../images/amb_list_ttl_hokkaido.gif); }
#miyagi-list    .prefTitle { background-image: url(../images/amb_list_ttl_miyagi.gif); }

	body.amb #salon1  h3 { background: url(../images/amb_salon01_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon2  h3 { background: url(../images/amb_salon02_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon3  h3 { background: url(../images/amb_salon03_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon4  h3 { background: url(../images/amb_salon04_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon5  h3 { background: url(../images/amb_salon05_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon6  h3 { background: url(../images/amb_salon06_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon7  h3 { background: url(../images/amb_salon07_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon8  h3 { background: url(../images/amb_salon08_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon9  h3 { background: url(../images/amb_salon09_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon10 h3 { background: url(../images/amb_salon10_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon11 h3 { background: url(../images/amb_salon11_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon12 h3 { background: url(../images/amb_salon12_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon13 h3 { background: url(../images/amb_salon13_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon14 h3 { background: url(../images/amb_salon14_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon15 h3 { background: url(../images/amb_salon15_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon16 h3 { background: url(../images/amb_salon16_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon17 h3 { background: url(../images/amb_salon17_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon18 h3 { background: url(../images/amb_salon18_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon19 h3 { background: url(../images/amb_salon19_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon20 h3 { background: url(../images/amb_salon20_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon21 h3 { background: url(../images/amb_salon21_ttl.jpg) 0 2px no-repeat; }
	body.amb #salon22 h3 { background: url(../images/amb_salon22_ttl.jpg) 0 2px no-repeat; }


/* ---------------------------------------------------------------------
*
*       3.4. Homme Presale Hair Salon
*
* ------------------------------------------------------------------- */

/* ------------------------------------------------------------------ */
/* ! Header */
/* ------------------------------------------------------------------ */

body.ho #header       { background: url(../../products/homme/images/head_bg.png) 0 0 repeat-x; }
body.ho #header .cont { position: static; left: 0; margin: 0 auto; }

/* ------------------------------------------------------------------ */
/* ! Catch */
/* ------------------------------------------------------------------ */

body.ho h1      { background: url(../images/ho_ttl.png) no-repeat; }
body.ho .pmid p { height: 17px; padding: 20px 0 0; background: url(../images/ho_ttl_desc.gif) 20px 20px no-repeat; }

/* ------------------------------------------------------------------ */
/* ! Prefecture Index */
/* ------------------------------------------------------------------ */
body.ho #prefIndex               { margin-top: 0; padding: 15px 0 10px 20px; }
	body.ho #prefIndex a         { background: url(../images/ho_li_mark.gif) 0 2px no-repeat; color: #444444; }
	body.ho #prefIndex a:visited { color: #444444; }
	body.ho #prefIndex a:hover   { background: url(../images/ho_li_mark_h.gif) 0 2px no-repeat; color: #111111; }
	body.ho #prefIndex a:active  { color: #111111; }

/* ------------------------------------------------------------------ */
/* ! List */
/* ------------------------------------------------------------------ */

body.ho .panel .ptopHeadBlueGray    { height: 59px; padding-top: 18px; background: url(../images/ho_col_base_top.png) left bottom no-repeat;}

body.ho .panel .ptopHeadBlueGray h2 { padding-top: 18px; }
* html body.ho .panel .ptopHeadBlueGray h2 { padding-top: 1px; margin-top: -18px; }

body.ho #results .unit .outLink     { background: url(../images/ho_result_mark_out.gif) right top no-repeat; }

body.ho #results .unit .gmBtn       { background: url(../images/ho_result_btn_google.jpg) 0 -24px; }
body.ho #results .odd .gmBtn        { background-image: url(../images/ho_result_btn_google_g.jpg); }
body.ho #results .unit .gmBtn:hover { background-position: 0 0; }

body.ho .list-footer         { padding: 18px 0 0; }
* html body.ho .list-footer  { padding-bottom: 18px; }
body.ho .list-footer a       { width: 125px; height: 10px; margin-left: 570px; background: url(../images/ho_amb_btn_index.gif) 0 -10px no-repeat; }
body.ho .list-footer a:hover { background-position: 0 0; }


/* =====================================================================
*
*    4. Side Contents
*
* =================================================================== */

body.index #sideCont {
	margin-top: 118px;
}

body.result #sideCont {
	margin-top: 71px;
}


/* ---------------------------------
*    Search Form
*/

#sideSearchBox {
	width: 206px;
	padding: 20px 7px;
	background: url(../../common/images/side_col_base.png) no-repeat;
}

	body.ch #sideSearchBox { background-image: url(../../common/images/ch/side_col_base.png); }

	.town #sideSearch { margin: 20px 0 0 0; }

#sideSearchBox #keyword {
	width: 126px;
	height: 19px;
	margin: 0;
	padding: 5px 5px 5px 5px;
	border: none;
	background: url(../images/search_box.gif) no-repeat;
	vertical-align: top;
}

	body.ch #sideSearchBox #keyword {
		color: #FAFCFD;
		background: url(../images/amb_search_box.gif) no-repeat;
	}

#sideSearchBox #submit {
	width: 70px;
	height: 32px;
}

	body.ch #sideSearchBox #submit { height: 29px; }


/* ---------------------------------
*    Map Mini
*/

#mapMini {
	margin: 10px 0 0 0;
}

#mapMini #mapContainer { display: none; }

#mapMini .map {
	width: 220px;
	padding: 20px 0;
	background: url(../images/side_col_base_map.png) no-repeat;
	text-align: center;
}

	body.ch #mapMini .map { background-image: url(../images/amb_side_col_base_map.png); }


/* ---------------------------------
*    Salon Icon List
*/

#salonIcons {
	margin: 20px 0 40px 0;
}

#salonIcons h4 {
	line-height:15px;
}

#salonIcons .cont {
	min-height: 28px;
	height: auto !important;
	height: 28px;
}

#salonIcons .iconList ul {
	margin-bottom: 10px;
}

#salonIcons .iconList li {
	margin-bottom: 9px;
	line-height: 20px;
	vertical-align: middle;
	color: #555555;
}


/* ---------------------------------
*    Products Icon List
*/

#prodIcons {
	margin: 20px 0 10px 0;
}

#prodIcons .cont {
	min-height: 28px;
	height: auto !important;
	height: 28px;
}

#iconList ul {
	min-height: 100px;
	margin-bottom: 10px;
}

#iconList li {
	text-indent: -30px;
	margin-left: 30px;
	margin-bottom: 10px;
	line-height: 20px;
	vertical-align: middle;
	color: #555555;
}

#iconList li img {
	margin-right: 10px;
}


/* ---------------------------------
*    Side Banners
*/

body.result #sideBnr {
	margin-top: 30px;
}

body.amb #sideCont {
	margin-top: 14px;
}


/* ------------------------------------------------------------------ */
/*                                                                    */
/* ! 2.1. Product Info */
/*                                                                    */
/* ------------------------------------------------------------------ */

#pInfo { margin: 17px 0 27px 0; }

#pInfo .cont {
	width: 190px;
	margin: -67px 0 0 0;
	padding: 20px 15px;
}

#pInfo a.pttl {
    padding: 0 0 0 14px;
    background: url(../../common/images/ch/li_mark.png) 0 2px no-repeat;
    color: #D4D3D3;
    text-decoration: none;
    font-weight: bold;
}
#pInfo a.pttl:visited { color: #D4D3D3; text-decoration: none; }
#pInfo a.pttl:hover   {
    background: url(../../common/images/ch/li_mark_h.png) 0 2px no-repeat;
    color: #FAFCFD;
    text-decoration: underline;
}
#pInfo a.pttl:active  { color: #FAFCFD; text-decoration: underline; }

#pInfo p { color: #BBBBBB; margin: 10px 0 0 0; }