@charset "utf-8";

/* ============================================
	/oshiete/index.html
============================================ */
.sectionAbout {
	background: url(/oshiete/img/about_bg_01.gif) no-repeat left top;
	margin-bottom: 20px;
	width: 620px;
	height: 72px;
	position: relative;
	overflow: hidden;
}
	.sectionAbout p {
		position: absolute;
		bottom: 15px;
	}
	.sectionAbout p.txt {
		left: 17px;
		bottom: 10px;
	}
	.sectionAbout p.btn {
		right: 23px;
		bottom: 37px;
	}
	.sectionAbout p.txt02 {
		left: 384px;
		bottom: 15px;
		background: url(/oshiete/common/img/ico_arrowR_01.gif) no-repeat left 0.2em;
		padding-left: 17px;
	}

.sectionSearch { background: url(/oshiete/common/img/qa_bg_03.jpg) no-repeat left top;
	width: 639px;
	height: 74px;
	position: relative;
	font-size: 85%;
}
	.sectionSearchTop {


		
		width: 639px;

	}
		.sectionSearchTop div {
			padding: 8px 0 0 40px;
		}
			.sectionSearchTop div .txt { position:absolute; top:14px ; left:185px;
			}
	.sectionSearchBtn01,
	.sectionSearchBtn02 {
		position: absolute;
		top: 0;
		width: 170px;
		height: 74px;
	}
	.sectionSearchBtn01 {
		left: 267px;
	}
	.sectionSearchBtn02 {
		right: 0;
	}
		.sectionSearchBtn01 .txt,
		.sectionSearchBtn02 .txt {
			padding: 3px 3px 0;
		}
.sectionSearchMiddle {
	width: 639px;
	height: 49px;
	overflow: hidden;
	position: relative;
}
	.sectionSearchMiddle p {
		position: absolute;
		top: 14px;
	}
	.sectionSearchMiddle p.searchTxt {
		left: 16px;
	}
		.sectionSearchMiddle p.searchTxt input {
			border: 1px solid #a5acb2;
			padding: 1px;
			width: 286px;
			height: 17px;
		}
	.sectionSearchMiddle p.searchBtn {
		left: 313px;
	}
	.sectionSearchMiddle p.searchOption {
		top: 17px;
		left: 464px;
		background: url(/oshiete/common/img/ico_option_01.gif) no-repeat left top;
		padding-left: 20px;
	}
.sectionSearchBottom {
	background: url(/oshiete/common/img/qa_bg_02.gif) no-repeat 0 0 ;
	margin-bottom: 20px;
	width: 639px;
	height: 25px;
	overflow: hidden;
}
	.sectionSearchBottom ul {
		padding: 3px 0 0 15px;
		height: 22px;
	}
		.sectionSearchBottom ul li {
			float: left;
			background: url(/oshiete/common/img/ico_arrowR_01.gif) no-repeat left 0.25em;
			margin-right: 30px;
			padding-left: 20px;
		}


.dl_top01 {
	margin-bottom: 15px;
	width: 300px;
	position: relative;
}
	.dl_top01 dt {
		background: url(/oshiete/common/img/ico_arrowR_01.gif) no-repeat left 0.2em;
		padding-left: 20px;
		font-weight: bold;
	}
	.dl_top01 dd {
	}
		.dl_top01 dd ul {
			margin-left: 20px;
			width: 280px;
			overflow: hidden;
		}
			.dl_top01 dd ul li {
				float: left;
				margin-right: 11px;
			}
				.dl_top01 dd ul li a {
					white-space: nowrap;
					text-decoration: underline;
				}
				.dl_top01 dd ul li a:hover {
					text-decoration: none;
				}
/*----------------------------------------------*/
.slider-wrap {
	background: url(/oshiete/common/img/main_bg_border_01.gif) no-repeat left bottom;
	position: relative;
	margin-bottom: 20px;
	width: 100%;
	overflow: hidden;
}
.csw { /* This is the viewing window */
	clear: both;
	position: relative;
	overflow: hidden; 
	margin: auto;
	width: 620px;
	height: 82px;
}
.coda-nav-left,
.coda-nav-right {
	position: absolute;
	top: 7px;
	width: 16px;
	height: 24px;
}
.coda-nav-left { right: 187px;}
.coda-nav-right { right: 13px;}
	.coda-nav-left a,
	.coda-nav-right a {
		display: block;
		width: 16px;
		height: 24px;
		text-indent: -9999em;
		overflow: hidden;
	}
	.coda-nav-left  a { background: url(/oshiete/common/img/slide_ico_prev.gif) no-repeat left top;}
	.coda-nav-right a { background: url(/oshiete/common/img/slide_ico_next.gif) no-repeat left top;}
	.coda-nav-left  a:hover { background: url(/oshiete/common/img/slide_ico_prev_on.gif) no-repeat left top;}
	.coda-nav-right a:hover { background: url(/oshiete/common/img/slide_ico_next_on.gif) no-repeat left top;}
	.coda-nav ul {
		position: absolute;
		width: 150px;
		height: 24px;
		right: 19px;
		top: 7px;
		overflow: hidden;
		z-index: 10;
	}
		.coda-nav ul li {
			float: left;
			width: 30px;
			height: 24px;
		}
			.coda-nav ul li a {
				display: block;
				width: 24px;
				height: 24px;
				overflow: hidden;
				text-indent: -9999em;
			}
			.coda-nav li.tab1 a { background: url(/oshiete/common/img/slide_ico_01.gif) no-repeat left top;}
			.coda-nav li.tab2 a { background: url(/oshiete/common/img/slide_ico_02.gif) no-repeat left top;}
			.coda-nav li.tab3 a { background: url(/oshiete/common/img/slide_ico_03.gif) no-repeat left top;}
			.coda-nav li.tab4 a { background: url(/oshiete/common/img/slide_ico_04.gif) no-repeat left top;}
			.coda-nav li.tab5 a { background: url(/oshiete/common/img/slide_ico_05.gif) no-repeat left top;}
			
			.coda-nav li.tab1 a:hover,
			.coda-nav li.tab1 a.current { background: url(/oshiete/common/img/slide_ico_01_on.gif) no-repeat left top;}
			.coda-nav li.tab2 a:hover,
			.coda-nav li.tab2 a.current { background: url(/oshiete/common/img/slide_ico_02_on.gif) no-repeat left top;}
			.coda-nav li.tab3 a:hover,
			.coda-nav li.tab3 a.current { background: url(/oshiete/common/img/slide_ico_03_on.gif) no-repeat left top;}
			.coda-nav li.tab4 a:hover,
			.coda-nav li.tab4 a.current { background: url(/oshiete/common/img/slide_ico_04_on.gif) no-repeat left top;}
			.coda-nav li.tab5 a:hover,
			.coda-nav li.tab5 a.current { background: url(/oshiete/common/img/slide_ico_05_on.gif) no-repeat left top;}

.stripViewer .panelContainer {
	position: relative;
	left: 0; top: 0;
	width: 100%;
	list-style-type: none;
}
	.panel {
		float:left;
		height: 100%;
		position: relative;
		width: 620px;
	}
		.panel dl {
			padding: 9px 0 0 18px;
		}
			.panel dl dt,
			.panel dl dd {
				overflow: hidden;
			}
			.panel dl dt {
				clear: both;
				float: left;
				height: 26px;
			}
			.panel dl dd {
				margin: 0 0 5px 35px;
				padding-top: 2px;
				min-height: 24px;
			}
.secPicup {
	margin-bottom: 20px;
}
	.secPicup ul {
		padding-top: 5px;
	}
	.secPicup ul li {
		background: url(/oshiete/common/img/ico_arrowR_01.gif) no-repeat left 0.2em;
		margin-bottom: 10px;
		padding-left: 20px;
	}
	
	
/*-----------------------------------------------------*/

#gimon { margin:15px 0; background:url(/oshiete/common/img/tab_bg.jpg) 0 0 no-repeat;}



/* 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:196px; height:47px; text-indent:-9999px; overflow:hidden;
    display: block;
    padding: 0 0px;
    background: url(/oshiete/common/img/tab01.jpg) 0 0 no-repeat;
}



li a#tab02 { width:204px; height:47px; text-indent:-9999px;overflow:hidden;
    display: block;
    padding: 0 0px;
    background: url(/oshiete/common/img/tab02.jpg)  no-repeat;
}

li a#tab03 { width:204px; height:47px; text-indent:-9999px;overflow:hidden;
    display: block;
    padding: 0 0px;
    background: url(/oshiete/common/img/tab03.jpg)  no-repeat;
}





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


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

.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;
}

div#tab1,div#tab2,div#tab3 { margin:10px;}

div#tab1 ul ,div#tab2 ul ,div#tab3 ul  {background:url(/oshiete/common/img/yoko_dot.gif) 0 0 repeat-x;}
div#tab1 ul li,div#tab2 ul li,div#tab3 ul li { text-align:right; line-height:180% ; background:url(/oshiete/common/img/yoko_dot.gif) 0 100% repeat-x; padding:5px 0px; }
div#tab1 ul li a,div#tab2 ul li a,div#tab3 ul li a { display:block }
div#tab1 ul li a:hover,div#tab2 ul li a:hover,div#tab3 ul li a:hover { background-color:#fff19f; text-decoration:none}

.q-ttl01 { display:block; background:url(/oshiete/common/img/tab_day01.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl02 { display:block; background:url(/oshiete/common/img/tab_day02.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl03 { display:block; background:url(/oshiete/common/img/tab_day03.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl04 { display:block; background:url(/oshiete/common/img/tab_day04.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl05 { display:block; background:url(/oshiete/common/img/tab_day05.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl06 { display:block; background:url(/oshiete/common/img/tab_day06.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }
.q-ttl07 { display:block; background:url(/oshiete/common/img/tab_day07.gif) 0 0 no-repeat; text-align:left;
padding:7px 0 7px 65px; width:340px; float:left; line-height:100% }

.q-ttl { display:block; 
 background: url(/oshiete/img/star_icon.jpg) 0 50% no-repeat;
text-align:left;padding:7px 0 7px 65px; width:340px; float:left; line-height:100%} 




/*-----------------------------------------------------*/

#twitter-info { padding:0; margin:0 0 15px; background:url(/oshiete/common/img/twitter_bottom.gif) 0 100% no-repeat;}
.left-box { width:317px; float:left; padding:0 0 10px}
.right-box { width:323px; float:left;padding:0 0 10px}
.left-box-in {background:url(/oshiete/common/img/twitter_bg.gif) 14px 0 no-repeat; padding:0 20px;height:300px; overflow:hidden }
.right-box-in { background:url(/oshiete/common/img/twitter_bg.gif) 10px 0 no-repeat;padding:0 25px 0 18px;height:300px; overflow:hidden}

#twitter-info p.text { width:210px; float:right; font-size:10px}
#twitter-info .left-box-in img ,#twitter-info .right-box-in img  { float:left; border:1px solid #999999; margin:5px}
#twitter-info .left-box-in div ,#twitter-info .right-box-in div  { clear:both; background:url(/oshiete/common/img/yoko_dot.gif) 0 0 repeat-x; 
padding:5px 0 0px ; margin:5px 0 0}

#howuse { clear:both; padding:0 0 15px}