@charset "utf-8";

#read { position: relative; background:url(../img/bg_read.jpg) left top no-repeat; width: 888px; height: 245px;}
/*-- #read h2 { padding:0 0 15px 0;} --*/
#read h2 { position: absolute; background: url(../img/title01_2.gif) 0 0 no-repeat; padding-top: 2px;
top: 25px; left: 250px; width: 623px; height: 24px; color: #FFFFFF; font-size: 100%; font-weight: normal; text-align: center;}

#read h3 { position: absolute; top: 72px; left: 256px; width: 398px; height: 100px; color: #FFFFFF; text-align: left;}
#read .btn_beginer { position: absolute; left: 665px; top: 116px; width: 198px; height: 52px;}


/*TOP20101122～ --------------*/
#read_02 { position: relative; background:url(../img/topimg/clover_bg.jpg) right top no-repeat; width: 902px; height: 246px;}
#read_02 h2 { position:absolute; top: 0px; left: 0px; height: 90px;}
#read_02 .btn_beginer{ position: absolute; left: 15px; top: 25px;}
#read_02 h3 { position: absolute; left: 15px; top: 70px;}
#read_02 p.btnc{ position: absolute; left: 18px; top: 140px; font-size: x-small; color:#999999; width: 260px;}
#read_02 p.tlink{ position: absolute; left: 20px; top: 180px; font-size: small; }
#read_02 .clover01 {position: absolute; left: 313px; top: 14px;}
#read_02 .clover02 {position: absolute; left: 313px; top: 80px;}
#read_02 .clover03 {position: absolute; left: 313px; top: 102px;}
#read_02 .clover04 {position: absolute; left: 438px; top: 118px;}
#read_02 .clover05 {position: absolute; left: 558px; top: 88px;}
/*-------------------------*/

#step { background:url(../img/bg_bottom.gif) left bottom no-repeat; padding:0 0 3px 0; margin:0 0 5px 0;}
#step ol { background:url(../img/bg_grada.gif) left bottom repeat-x; padding:10px 5px 5px 5px; border-left:#cacaca solid 1px; border-right:#cacaca solid 1px;}
#step li { display:inline; padding:0 7px 0 0;}
#top-flow .stxt {
	float:left;
	width:430px;
}
#top-flow .right_txt {
	padding-top:10px;
}

.rightbox { width:314px; float:right;}
.leftbox { width:314px; float:left;}
.pictbox { padding:10px 0 0 0;}
.pictbox dt { float:left; width:134px;}
.pictbox dt a { border:#e7b5c4 solid 2px; padding:3px; display:block; background:#fff;}
.pictbox dt a:hover { border:#d44772 solid 2px;}
.pictbox dd { padding:0 0 0 140px;}

.box .sub_tit { font-size:14px; border-bottom:#CCC solid 3px; background:url(../img/eyecatch3.gif) left center no-repeat; margin-bottom:15px; padding:5px 0 2px 10px;}

#example ul { margin:0 0 15px 0;}
#example ul li { background:url(../img/eyecatch.gif) left center no-repeat; border-bottom:#d3d3d3 dotted 1px; padding:8px 0 8px 20px; margin:0 0 5px 0; line-height:1em;}

#consultant dl { border:#cacaca solid 1px; padding:10px;}
#consultant dt { float:left;}
#consultant dt a { border:#e7b5c4 solid 2px; padding:3px; display:block; background:#fff;}
#consultant dt a:hover { border:#d44772 solid 2px;}
#consultant dd { padding:0 0 0 110px;}
#consultant dd h4 { color:#d44772; border-bottom:#d44772 dotted 1px; font-size:small;}
#consultant dd p { font-size:x-small; padding:10px 0 0 0;}
.dlred { float:left; width:374px; background:#f8ebef;}
.dlgray { float:right; width:226px; background:#f4f4f4; padding:10px 8px;}

#pickup ul { margin:0 0 15px 0;}
#pickup ul li { border-bottom:#d3d3d3 dotted 1px; margin:0 0 5px 0; padding:5px 0;}
#pickup ul li a { background:url(../img/eyecatch2.gif) left center no-repeat; padding:8px 0 8px 20px; line-height:1em; text-decoration:none;}
#pickup ul li a:hover { text-decoration:underline;}



/* topics */
#topics .topics_ttl,
#job .topics_ttl,
#area .topics_ttl { position: relative; background:url(../img/sttl_bg.jpg) 0 0 no-repeat; height: 45px; width: 648px;}
#topics h3,
#job h3,
#area h3 { position: absolute; top: 8px; left: 11px; width:107px;}

/* update */
#topics .update,
#area .update,
#job .update { position: absolute; top: 11px; left: 575px; color:#D44772; font-size: 100%; font-weight: bold;}


#topics ul,
#job ul { margin:0 0 15px 0;}
#topics ul li,
#job ul li { border-bottom:#d3d3d3 dotted 1px; margin:0 0 2px 0; padding:2px 0;line-height:120%;}
#topics ul li a,
#job ul li a { background:url(../img/eyecatch2.gif) left center no-repeat; padding:8px 0 8px 20px; line-height:1em; text-decoration:none;}
#topics ul li a:hover,
#job ul li a:hover { text-decoration:underline;}


/* tab */
ul.simpleTabsNavigation { margin:0; padding:0; text-align:left; }
ul.simpleTabsNavigation li { float:left; width:80px; height:30px; }
ul.simpleTabsNavigation li a { display:block; background:url(../img/tabbg_n.gif) left center no-repeat; }
ul.simpleTabsNavigation li a:hover { background:url(../img/tabbg_on.gif) left center no-repeat; }
ul.simpleTabsNavigation li a.current { background:url(../img/tabbg_on.gif) left center no-repeat; }
div.simpleTabsContent { background:#dc6388; padding:5px; display:none; }
div.simpleTabsContent.currentTab { display:block; }

div.simpleTabs ul:after {content:"."; display:block; height:0; clear:both; visibility:hidden; line-height:0; font-size:0;}
div.simpleTabs ul {display:inline-block;}
/* except Mac IE5 \*/
* htmldiv.simpleTabs ul { height:1%;}
div.simpleTabs ul {display:block;}
/* end of Holly Hack */

.bg_w { background:#f5f5f5; padding:10px;}

p.tabnote { color:#666666;font-size:small;line:height:120%; }

.form { background:#fff; border:#cacaca solid 1px; padding:10px;}
.form label { display:block;}
.form label.labelTitle { float:left; width:105px;}
.form label.labelTitle2 { float:left; width:85px;}
.form label .gray{ font-size: x-small; color:#999999;}

.form .city { overflow-y:scroll; height:148px; padding:5px; border:#cacaca solid 1px; /*width:470px;*/ line-height:120%; width:300px;}
.form .city input {vertical-align:middle;}

.form .ensen { overflow-y:scroll; height:148px; padding:5px; border:#cacaca solid 1px; width:220px;line-height:120%;}
.form .ensen input {vertical-align:middle;}
.form .station { overflow-y:scroll; height:148px; padding:5px; border:#cacaca solid 1px; width:220px;line-height:120%;}
.form .station input {vertical-align:middle;}

.form .border { border-bottom:#cacaca dotted 1px; margin-bottom:10px; padding-bottom:10px;}
.form .left { float:left;}
.form .left2 { float:left; margin-right:30px;}
.form .right { float:right;}
.form ul li { float:left; padding-right:5px;}
.form .free { width:300px; display:block; margin-bottom:5px;}
.form span.stxt { padding-left:105px;}

.simpleTabsContent p.check1 { float:left; width:195px; padding:7px 0 0 12px; font-size:x-small; background: url(../img_cmn/arrow.gif) no-repeat 0px 11px;}
.simpleTabsContent p.check2 { float:left; width:125px; padding:7px 0 0 12px; font-size:x-small; background: url(../img_cmn/arrow.gif) no-repeat 0px 11px;}
.simpleTabsContent p.uncheck {   float:left; width:85px;padding:7px 0 0 12px; font-size:x-small; background: url(../img_cmn/icon_delete.gif) no-repeat 0 11px;}
.simpleTabsContent label.ttl-ensen {padding:0 0 0 5px; background:#FFE2EE;}
.simpleTabsContent hr { height: 0px; border: 0px; border-top: 1px dotted #999;}
.simpleTabsContent .city hr { width:200px;margin-left:0;}
.simpleTabsContent .station hr { width:150px;margin-left:0; }


/* twitter */
#main #rigth_box_s .doda_box_t { border-top:#d9d9d9 solid 1px; border-bottom:#d9d9d9 solid 3px; border-right:#d9d9d9 solid 1px; border-left:#d9d9d9 solid 1px; padding:0 0 5px 0; margin:0 0 10px 0;}
#main #rigth_box_s .doda_box_t h4 { background-color:#f6f6f6; margin:1px; font-size:small; padding:5px 0 5px 3px;}
#main #rigth_box_s .doda_box_t p { border-top:#d9d9d9 solid 1px; font-size:x-small; line-height:150%; padding:8px 8px 10px 8px;}