@charset "utf-8";
/*******************************************************************************
生物多様性コンテンツ 詳細設定
*******************************************************************************/
#pagebody{
	width: 970px;
}
#content h1, #content2 h1, #content p.faqtitle, #content3 h1 {
    background: url(images/biodiversity/title_bg.gif) no-repeat right top;
}
#content3 h1.h1img{
	margin-bottom:5px;
	padding:10px;
    background: url(images/biodiversity/title_bg.gif) no-repeat right top;
}
#plnavi,#petit .sidelink{
	margin-left:0px;
	margin-right:0px;
    width: 255px;
}
#p2content {
	margin-left:0px;
	margin-right:0px;
    width: 680px;
}

#petit ul.objectlink,#petit ul.objectlink2{
	margin-left:0px;
	margin-right:0px;
}
#petit ul.objectlink li.imglink,#petit ul.objectlink2 li.imglink{
	margin:0px 20px 20px 0px;
	float:left;
}
/*==============================================================================
	トピックス
==============================================================================*/
#ptopnavi {
	margin-bottom:20px;
    width: 950px;
}
#ptopnavi .topics{
	margin:0px 0px 10px 0px;
	padding:0px 0px 0px 0px;
	border:none;
}
#ptopnavi .topics h2{
	margin:0px;
	padding:18px 0px 13px 55px;
	font-size:110%;
	background:url(images/biodiversity/topics_h2.gif) no-repeat left bottom;
}
#ptopnavi .topics ul{
	margin:0px;
	padding:10px 15px 13px 17px;
	background:url(images/biodiversity/topics_bottom.gif) no-repeat left bottom,#e8fbc7 url(images/biodiversity/topics_bg.gif) repeat-y center top;
	list-style-type:none;
}
#ptopnavi .topics ul li{
	margin-bottom:4px;
	padding:0px 0px 0px 20px;
	background:url(images/biodiversity/topics_ul.gif) no-repeat 0px 6px;
	border:none;
}

/*==============================================================================
	スクロールメニュー
==============================================================================*/
#pickup .window{
	width: 950px;
    height: 430px;
}
#scroll_a .main p.photoleft {
    width: 950px;
    height: 430px;
}
#pickup .main {
    width: 950px;
    height: 430px;
}
#pickup #scroll_a .window::before,
#pickup #scroll_a .window::after{
	padding-bottom: 430px;
}
#pickup #scroll_a{
	margin-bottom:40px;
}
/*******************************************************************************
　詳細デザイン
********************************************************************************/
#menu{
	border-radius: 5px 5px 0px 0px;
    -webkit-border-radius: 5px 5px 0px 0px;
    -moz-border-radius: 5px 5px 0px 0px;
    overflow:hideen;
}
#menu h2 a {
	padding-left: 60px;
    padding-right: 10px;
    color: #FFFFFF;
    background: #00883b url(images/biodiversity/lnavi_bg.gif) no-repeat 3px center;
    border-bottom: 2px solid #00883b;
    text-align:left;
}
#sidebnr{
	padding:5px 5px 0px 5px;
	background:#FFF;
}
#sidebnr ul{
	list-style:none;
}

#content h1:not([class]),#content2 h1:not([class]){
	margin-left:0;
	margin-right:0;
	width:auto;
	padding: 18px 250px 18px 12px;
	color: #FFFFFF;
	background: #0F833A url(images/biodiversity/h1_bg.jpg) repeat-y right top;
	border:none;
	border-left:3px solid #0F833A;
}
#content h1:not([class])::after, #content2 h1:not([class])::after, #content3 h1:not([class])::after{
	content:none;
}
#content h2, #content2 h2, #content .redborder h2, #content .yellowborder h2, #content .greenborder h2, #content .blueborder h2, #content2 .redborder h2, #content2 .yellowborder h2, #content2 .greenborder h2, #content2 .blueborder h2 ,
#content h2.kanren, #content2 h2.kanren{
    padding: 30px 15px 3px 15px;
    background: #A1DD5A url(images/biodiversity/h2_bg.gif) repeat-x left top;
    color: #003E00;
    border: none;
    border-bottom: 2px solid #A1DD5A;
}
#content h3,#content2 h3{
	padding: 7px 15px 7px 10px;
	background: #E6F5D1;
	border-top: none;
	border-right: none;
	border-left: 5px solid #10833B;
	border-image:none;
	border-bottom: none;
}
/*******************************************************************************
[1] クイズ
********************************************************************************/
#content h1.quiztitle,#content2 .quiztitle{
	padding:0px;
	background:none;
	border:none;
}
#content .qtitle,#content2 .qtitle{
	margin-left:15px;
	margin-right:15px;
}
#content ul.quizlebel,#content2 ul.quizlebel{
	margin:20px 0px 0px 15px;
	list-style-type:none;
}
#content ul.quizlebel li,#content2 ul.quizlebel li{
	margin:10px 15px 0px 0px;
	display:inline;
}
#content .question,#content2 .question{
	margin:0px 0px 60px 0px;
}
#content .question h2,#content2 .question h2{
	margin:0px 0px 15px 0px;
	padding:0px 10px 0px 10px;
	font-size:120%;
	border:none;
	background:none;
	color:#333333;
	line-height:1.3;
}
#content .question h2,#content2 .question h2:after{
    content: ""; 
    display: block; 
    clear: both;
}
#content .question h2,#content2 .question h2 .q{
	padding-top:18px;
	width:800px;
	float:right;
	display:block;
}
#content .question h2 img,#content2 .question h2 img{
	margin-left:3px;
	margin-right:10px;
	vertical-align:middle;
	float:left;
}
#content .question p,#content2 .question p{
	margin-left:44px;
	margin-right:40px;
}
#content .question ol.quizlist,#content2 .question ol.quizlist{
	margin-left:20px;
	margin-bottom:25px;
	font-size:120%;
	list-style-type:none;
}
#content .question ol.quizlist li,#content2 .question ol.quizlist li{
	margin-bottom:0px;
	padding:8px 0px 8px 95px;
	width:80%;
}
#content .question ol.quizlist li.qlf,#content2 .question ol.quizlist li.qlf{
	background:url(images/biodiversity/quiz/1.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist li.qls,#content2 .question ol.quizlist li.qls{
	background:url(images/biodiversity/quiz/2.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist li.qlt,#content2 .question ol.quizlist li.qlt{
	background:url(images/biodiversity/quiz/3.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist li.qlf:hover,#content2 .question ol.quizlist li.qlf:hover{
	background:url(images/biodiversity/quiz/1_o.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.qls:hover,#content2 .question ol.quizlist li.qls:hover{
	background:url(images/biodiversity/quiz/2_o.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.qlt:hover,#content2 .question ol.quizlist li.qlt:hover{
	background:url(images/biodiversity/quiz/3_o.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.qlf.qlchoice,
#content .question ol.quizlist li.qlf.qlchoice.nochoice:hover,
#content2 .question ol.quizlist li.qlf.qlchoice,
#content2 .question ol.quizlist li.qlf.qlchoice.nochoice:hover{
	background:url(images/biodiversity/quiz/1_c.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.qls.qlchoice,
#content .question ol.quizlist li.qls.qlchoice.nochoice:hover,
#content2 .question ol.quizlist li.qls.qlchoice,
#content2 .question ol.quizlist li.qls.qlchoice.nochoice:hover{
	background:url(images/biodiversity/quiz/2_c.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.qlt.qlchoice,
#content .question ol.quizlist li.qlt.qlchoice.nochoice:hover,
#content2 .question ol.quizlist li.qlt.qlchoice,
#content2 .question ol.quizlist li.qlt.qlchoice.nochoice:hover{
	background:url(images/biodiversity/quiz/3_c.gif) no-repeat 0px 10px;
}
#content .question ol.quizlist li.nochoice,#content2 .question ol.quizlist li.nochoice{
	padding:8px 3px 8px 101px;
}
#content .question ol.quizlist li.qlf.nochoice:hover,
#content2 .question ol.quizlist li.qlf.nochoice:hover{
	background:url(images/biodiversity/quiz/1.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist li.qls.nochoice:hover,
#content2 .question ol.quizlist li.qls.nochoice:hover{
	background:url(images/biodiversity/quiz/2.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist li.qlt.nochoice:hover,
#content2 .question ol.quizlist li.qlt.nochoice:hover{
	background:url(images/biodiversity/quiz/3.gif) no-repeat 57px 10px;
}
#content .question ol.quizlist a,
#content2 .question ol.quizlist a{
	padding:0px 3px 0px 6px;
	display:block;
	text-decoration:none;
	color:#333333;
}
#content .question ol.quizlist a:hover,
#content2 .question ol.quizlist a:hover{
	background-color:#fffcd0;
}
#content .question p.answerbtn,
#content2 .question p.answerbtn{
	margin-left:65px;
}
#content .question p.answerbtn a:hover,
#content2 .question p.answerbtn a:hover{
	background:none!important;
}
/* 正解と解説 */
#content .question .answer,
#content2 .question .answer{
	margin:0px 50px 0px 50px; 
	padding:2px;
	border:3px solid #10833b;
}
#content .question .answer:after,
#content2 .question .answer:after{
    content: ""; 
    display: block; 
    clear: both;
}
#content .question .answer h3,
#content2 .question .answer h3{
	margin:0px;
	padding:0px;
	width:88px;
	float:left;
	background:#BEDB8F;
	border:none;
}
#content .question .answer h3 img,
#content2 .question .answer h3 img{
	vertical-align:bottom;
}
#content .question .answer .answerbox,
#content2 .question .answer .answerbox{
	margin:0px;
	padding:0px;
	width:750px;
	float:right;
	border:none;
}
#content .question .answer h4,
#content2 .question .answer h4{
	margin:0px;
	padding:14px;
	font-size:120%;
	border:none;
	background:#ffffff;
}
#content .question .answer p,
#content2 .question .answer p{
	margin:0px;
	padding:0px 14px 14px 14px;
	background:#ffffff;
	min-height: 50px;
}
#content .question .answer ul,
#content2 .question .answer ul{
	margin:0px;
	padding:0px 14px 14px 14px;
	background:#ffffff;
}
#content .question .answer h4 img,
#content2 .question .answer h4 img{
	padding:0px 8px 0px 4px;
	vertical-align:middle;
}
#content .question .answer ul.objectlink,
#content2 .question .answer ul.objectlink{
	margin-bottom:12px;
	margin-left:38px;
}
#content .question .answer ul.objectlink li,
#content2 .question .answer ul.objectlink li{
	background-position:8px center;
}
/* 採点結果 */
#content .quizresult,#content2 .quizresult{
	margin-top:30px;
}
#content .quizresult .qrbtn,#content2 .quizresult .qrbtn{
	text-align:center;
}
#content .quizresult .qrbtn a:hover,#content2 .quizresult .qrbtn a:hover{
	background:none!important;
}
#content .quizresult .qresult,#content2 .quizresult .qresult{
	margin:20px;
	border:3px solid #ffa1c4;
}
#content .quizresult .qresult h2,#content2 .quizresult .qresult h2{
	margin:0px;
	padding:0px 14px 0px 80px;
	font-size:120%;
	color:#333333;
	border:none;
	border-bottom:1px solid #ffa1c4;
	background:#ffdee8 url(images/biodiversity/quiz/qresult_h2_bg.gif) no-repeat left top;
}
#content .quizresult .qresult h2 span,#content2 .quizresult .qresult h2 span{
	font-size:200%;
}
#content .quizresult .qresult p,#content2 .quizresult .qresult p{
	margin:12px 22px 12px 20px;
}
#content .quizresult .qresult p.qranswer,#content2 .quizresult .qresult p.qranswer{
	font-weight:bold;
}
#content .quizresult .qresult ul.objectlink,
#content2 .quizresult .qresult ul.objectlink{
	margin:0px 22px 14px 20px;
}
#content .quizresult .qresult ul.objectlink li,
#content2 .quizresult .qresult ul.objectlink li{
	background-position:0px 4px;
}
/*==============================================================================
	クイズ下部のリンク
==============================================================================*/
#biofooter{
	margin:0px auto 0px auto;
	width:100%;
}
#biofooter ul{
	margin:0px auto 0px auto;
	width:950px;
	padding:8px 5px 8px 5px;
	text-align:center;
	list-style-type:none;
}
#biofooter ul li{
	margin-right:8px;
	margin-left:8px;
	padding-left:22px;
	display:inline;
	background:url(../images/content/mark_list.gif) no-repeat left center;
}

@media print{
.quiztitle img{
	border:none;
	max-width:100%;
	height:auto;
}
#content .question h2,#content2 .question h2 .q{
	width:80%;
}
#content .question .answer,
#content2 .question .answer{
	background:#FFF;
}
#content .question .answer h3,
#content2 .question .answer h3{
	width:20%;
	float:left;
	background:#FFF;
}
#content .question .answer .answerbox,
#content2 .question .answer .answerbox{
	width:80%;
	float:left;
}
}