@charset "utf-8";

#main-title { border-bottom:#CCCCCC 1px solid; margin:0px 15px;}
#main-title h1 { float:left; width:300px; padding:5px 0px 8px 5px;}
.txt-right{margin: 0px auto;}

/*  block01  */

#block-area01 { padding:20px 40px 0px 40px}
#block-area01 .left-box { width:278px; float:left;}
#block-area01 #caption { width:515px; float:right;}

#block-area01 #caption h2 { color:#000000; font-size:115%; font-weight:bold; padding:2px 0px 2px 25px;
background:url(/personal/what-people-say/images/block_icon.gif) 0 2px no-repeat; font-size:12px}
#block-area01 #caption h2 img { vertical-align:middle;}
#block-area01 #caption p { padding:15px 0px 0px; font-size:12px}

#block-area01 #caption .txt-name { font-weight:bold;}


/*  block02  */
#block-area02 { padding:10px 20px 0px 20px}

.select-box { width:131px; float:left; padding:15px 20px 0px;}
.select-box img {cursor:pointer}
.select-box p { font-size:90%; line-height:130%; padding:5px 0px 0px ; color: #666666;cursor:pointer; font-size:10px}
.select-box p span { font-size:10px;line-height:130%; padding:5px 0px 0px ; color: #666666;cursor:pointer}
.select-box p img { vertical-align:middle; padding:0px 4px 0px 0px;cursor:pointer }

.select-box p a:link,
.select-box p a:visited,
.select-box p a:active,
.select-box p a:hover { color: #666666; text-decoration:none;}

.select-box2 { width:308px; float:right; padding:15px 20px 0px;}
.select-box2 img {cursor:pointer}
.select-box2 p { font-size:90%; line-height:130%; padding:5px 0px 0px ; color: #666666;cursor:pointer; font-size:10px}
.select-box2 p span { font-size:10px;line-height:130%; padding:5px 0px 0px ; color: #666666;cursor:pointer}
.select-box2 p img { vertical-align:middle; padding:0px 4px 0px 0px;cursor:pointer }

.select-box2 p a:link,
.select-box2 p a:visited,
.select-box2 p a:active,
.select-box2 p a:hover { color: #666666; text-decoration:none;}
 

/*  left-column --------------- */

#left-column { width:596px; float:left; padding : 10px 0px 0px 17px; }


/* block-area01 */
#block-area01 { padding:20px 60px 0px 24px}
#block-area01 .left-box { width:278px; float:left;}
#block-area01 .right-box { width:515px; float:right;}

#block-area01 .right-box h3 { color:#000000; font-size:115%; font-weight:bold}
#block-area01 .right-box h3 img { vertical-align:middle; }
#block-area01 .right-box p { padding:15px 0px 0px;}



/* block-area03 */
#block-area03	{padding:5px 0 5px 0px;}

#block-area03-in {background: url(/personal/what-people-say/images/block03_bk.gif) repeat-y 0 0; padding:15px 20px;}

#block-area03-in  h2 { color:#000000; font-size:115%; font-weight:bold; padding:10px 15px 0px; font-size:12px;}
#block-area03-in  h2 img { vertical-align:middle;}
#block-area03-in  p { padding:12px 20px 0px ; font-size:12px; line-height:145%}




/*  right-column --------------- */

#right-column { width:269px; float:right; padding:16px 9px 0px 0px}

#right-column01 { background:url(/jp_stone/img/personal/common/right_bg.gif) 0 0 repeat-y; margin:0px 0px 0px}
#right-column01 p { color:#666666;padding:0px 20px 15px; font-size:85%; line-height:130% }
#right-column01 p.bot { padding:0px 0px 5px; text-align:center; }
#right-column01 p.bot a img {opacity:1; filter: alpha(opacity=100);}
#right-column01 p.bot a:hover img {opacity:0.8; filter: alpha(opacity=80);}
#right-column01-in { width:234px ; margin:0px auto}
#right-column #banner-box { text-align:center;padding:5px 0px 10px}


#right-column02 { padding:10px 0px 0px;background:url(/jp_stone/img/personal/common/right_bg.gif) 0 0 repeat-y;}
#right-column02 p { color:#666666;padding:0px 20px 15px; font-size:85%; line-height:130% }
#right-column02-in { padding:0px 0px 0px; text-align:center;}

#right-column03 { text-align:center;padding:20px 0px 0px;}


/* language */
#right-column 	#language { padding:0px 0px 10px;background-color:#fff;
width:272px;background: url(/jp_stone/img/personal/common/right_bg.gif) 0 0 repeat-y;height:auto;}
#right-column 	#language  p { text-align:center;}
#right-column 	#language ul { padding:5px 7px;}
#right-column 	#language ul li { width:115px; display:block; background:url(/jp_stone/img/language/icon_arrow.gif) 0 50%  no-repeat; float:left;
 padding:2px 0px 3px 14px ; margin:0px 0px 0px 0px ;color:#666666; line-height:100%;font-size:10px; }
#right-column 	#language ul li a:link { color:#669900;text-decoration:underline;}
#right-column 	#language ul li a:visited {color:#669900; text-decoration:underline; }
#right-column 	#language ul li a:active { color:#669900; text-decoration:none;}
#right-column 	#language ul li a:hover { color:#0099cc; text-decoration:underline;}

#right-column	.banner-box a { display:block; padding:0 0 0 ; }


/* 保証--------------- */
#guarantee_box h2 { padding-bottom:0 ; padding-top:15px}
#guarantee_box { background-color:#FFFFFF;width:271px}
#guarantee_box p { padding:7px 10px 3px; font-size:12px; line-height:180%; background: url(/jp_stone/img/personal/common/right_bg.gif) 0 0 repeat-y;}
#guarantee_box p img { float:left;}
#guarantee-bot { text-align:right; padding:0px 10px 0px; background: url(/jp_stone/img/personal/common/right_bg.gif) 0 0 repeat-y;}
#guarantee-bot a img {opacity:1;filter: alpha(opacity=100); }
#guarantee-bot a:hover img {opacity:0.8;filter: alpha(opacity=80);}

/*  ポップアップ --------------- */
#mov1 {display:none;} 
#mov1-in {padding:20px 0px 0px 25px} 


/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    font-family: "Trebuchet MS", Trebuchet, Verdana, Helvetica, Arial, sans-serif;
    font-size: 12px;
}
.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 4px;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0 0 0 1px;
}
li a#tab01 { width:124px; height:31px; text-indent:-9999px; overflow:hidden;
    display: block;
    padding: 0 0px;
    background: url(/personal/what-people-say/images/tab_img01.gif) 0 0 no-repeat;
}



li a#tab02 { width:124px; height:31px; text-indent:-9999px;overflow:hidden;
    display: block;
    padding: 0 0px;
    background: url(/personal/what-people-say/images/tab_img02.gif) no-repeat;
}




li.ui-tabs-selected a#tab01 ,
li.ui-tabs-selected a#tab02 { background-position:0px -31px;}


li a#tab01:hover ,li a#tab02:hover  { background-position:0px -31px}

.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-unselect a:hover, .ui-tabs-nav .ui-tabs-unselect a:focus, .ui-tabs-nav .ui-tabs-unselect a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}
.ui-tabs-panel {
    padding: 1em 8px;
    background: #fff; /* declare background color for container to avoid distorted fonts in IE while fading */
}
.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(/jp_assets/javascripts/images/loadingAnimation.gif) no-repeat 0 50%;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}