@charset "utf-8";



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

  File       : common.css

  Date       : 2007.05.23

  Last Update: 2007.08.03

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





/*==============================================================================

default style is cleared

================================================================================*/



/* Basic Structure

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



body {

	margin: 0;

	padding: 0;

}





/* Sentence, Character

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



p, h1, h2, h3, h4, h5, h6{

	margin: 0;

	padding: 0;

	font-size: 100%;

	font-weight: normal;

}



em, address {

	font-style: normal;

}



/* List

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



ul, ol, li, dd, dt, dl{

	margin: 0;

	padding: 0;

	list-style-type: none;

}



/* Form

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



form{

	margin: 0;

	padding: 0;

	border: 0;

}

/* Table

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



table {

	border: 0;

	border-collapse: collapse;

	border-spacing: 0; /* For NN6.0 higher or Opera*/

}



th, td {

	padding: 0;

	font-weight: normal;

	text-align: left;

	vertical-align: top;

}





/*==============================================================================

default style is redefined

================================================================================*/





/* Anchor

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

a {

	font-family: none;/* for mac */

	text-decoration: underline;

}



a:link {

	color: #3399FF;

	text-decoration: none;

}



a:visited {

	color: #3399FF;

	text-decoration: none;

}



a:hover {

	text-decoration: underline;

}



a:active {

	color: #3399FF;

	text-decoration: underline;

}



/* Other

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



img {

	margin : 0px;

	padding : 0px;

	border : none;

	vertical-align : bottom;

}



.nobdr {

	border: 0 !important;

}



hr {

	display: none;

	margin: 0;

}



/* Float

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

.clearBoth {

	clear: both;

}



/* align

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

.alignLeft{

	text-align: left;

}



.alignCenter{

	text-align: center;

}



.alignRight{

	text-align: right;

}





/* Block

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

.dispNone {

	display: none;

}



.dispBlock {

	display: block;

}



.dispInline {

	display: inline;

}



/* Margin

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



/* margin-top */



.mt0 {

	margin-top: 0px;

}



.mt5 {

	margin-top: 5px;

}



.mt10 {

	margin-top: 10px;

}



.mt15 {

	margin-top: 15px;

}



.mt20 {

	margin-top: 20px;

}



/* margin-right */



.mr0 {

	margin-right: 0px;

}



.mr5 {

	margin-right: 5px;

}



.mr10 {

	margin-right: 10px;

}



.mr15 {

	margin-right: 15px;

}



.mr20 {

	margin-right: 20px;

}



/* margin-bottom */



.mb0 {

	margin-bottom: 0px;

}



.mb5 {

	margin-bottom: 5px;

}



.mb10 {

	margin-bottom: 10px;

}



.mb15 {

	margin-bottom: 15px;

}



.mb20 {

	margin-bottom: 20px;

}



/* margin-left */



.ml0 {

	margin-left: 0px;

}



.ml5 {

	margin-left: 5px;

}



.ml10 {

	margin-left: 10px;

}



.ml15 {

	margin-left: 15px;

}



.ml20 {

	margin-left: 20px;

}





/* Font

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

.fs10 {

	font-size: 10px;

}



.fs12 {

	font-size: 12px;

}



/*== Basic Structure ============================================================*/



body{

	padding: 0;

	margin: 0 0 10px 0;

	color: #666;

	font-size: 12px;

	line-height: 140%;

	background: url(/common/bg_body.gif) #F5F5EE repeat-x;

	font-family: "ＭＳ Ｐゴシック",sans-serif;

}



/*== #header ============================================================*/



#wrapHeader {

	width: 800px;

	margin: 0 auto 20px auto;

	padding: 0;

	position: relative;

}

#header {

	width: 800px;

	background: url(/common/bg_header.gif);

}





#header #gNavi {

	float: right;

	width: 700px;

	height: 43px;

	padding: 0 20px;

	background: url(/common/bg_gnavi.gif) no-repeat right bottom;

	text-align: right;

	vertical-align: bottom;

}



#header h1 {

	width: 80px;

	height: 62px;

	background: url(/common/logo.gif) no-repeat right bottom;

	position: absolute;

	left: 10px;

	top: 5px;

	text-indent: -99999px;

}



#header h1 a {

	display: block;

	width: 80px;

	height: 62px;

	text-decoration: none;

}





#header #gNavi ul {

	float: right;

	margin-top: 15px;

}



#header #gNavi ul li {

	float: left;

	font-size: 10px;

	line-height: 100%;

	color: #CCC;

}



#header #gNavi ul li a {

	color: #FF6666;

}



body#home li#gNavi01 a,

body#product li#gNavi02 a,

body#gallery li#gNavi03 a,

body#q_a li#gNavi04 a,

body#link li#gNavi05 a,

body#contact li#gNavi06 a {

	color: #999999;

}



#header #searchArea {

	background: url(/common/bg_headerbottom.gif) no-repeat left bottom;

	text-align: right;

	padding: 7px 20px 9px 20px;

	font-size: 8px;

}



#searchArea #searchText {

	width: 100px;

	height: 15px;

	font-size: 10px!important;

	border: 1px solid #CCCCCC;

}



#searchArea #btnSearch {

	margin-left: 6px;

	vertical-align: bottom;

	line-height: 100%;

}



#topNews {

	position: absolute;

	left: 100px;

	top: 52px;

	padding-right: 2em;

	background: url(/common/icon_topnews.gif) no-repeat 100% 0%;

}





/*== #flash ============================================================*/

#flashcontent {

	width: 786px;

	height: 206px;

	margin: 0 auto 15px auto;

}



/*== #contents ============================================================*/



/* 

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



#wrap {

	width: 800px;

	margin: 0 auto 0 auto;

	background: url(/common/bg_main.gif) repeat-y left top;

}



#contents {

	width: 760px;

	padding: 20px 20px 0 20px;

	background: url(/common/bg_maintop.gif) no-repeat left top;

}



#main {

	float: left;

	width: 560px;

}



.information p {

	margin-bottom: 20px!important;

}



#infoArea {

	background: url(/common/bg_info.gif) repeat-y left top;

}



#infoArea .textArea {

	padding: 15px;

	background: url(/common/bg_infobottom.gif) no-repeat left bottom;

}



#topicPath {

	font-size: 10px;

	color: #CCCCCC;

	margin-bottom: 20px;

}



#topicPath strong {

	color: #999;

}



.ttlCommon {

	margin-bottom: 15px;

}



.ttlType01 {

	height: 23px;

	padding: 5px 0 0 20px;

	background: url(/common/bg_products.gif) no-repeat left top;

	color: #FFFFFF;

	font-weight: bold;

}



#topicPath a {

	color: #FF6666;

}





.infoLeft {

	float: left;

	width: 60px;

}



.infoRight {

	float: right;

	width: 455px;

}



.infoRight dl dt {

	background: url(/common/item01.gif) no-repeat left center;

	padding-left: 15px;

	color: #333333;

	font-weight: bold;

	margin-bottom: 5px;

}



.infoRight dl dd {

	padding-left: 15px;

}



.btnDisp {

	width: 60px;

	height: 14px;

	margin: 15px 0 0 15px;

	line-height: 100%;

	text-indent: -9999px;

}



.btnDisp a {

	display: block;

	width: 60px;

	height: 14px;

	background: url(/common/btn_todisp.gif) no-repeat 0 0;

}



.btnDisp a:hover {

	background-position: 0 -14px;

}



.sideTextArea {

	padding: 5px 7px 20px 7px;

}



#sideInfo {

	padding: 0 7px 20px 7px;

}



.btnList {

	width: 45px;

	height: 14px;

	margin: 10px 0 0 auto;

	text-indent: -9999px;

	line-height: 100%;

}



.btnList a {

	display:block;

	width: 45px;

	height: 14px;

	background: url(/common/btn_tolist.gif) no-repeat 0 0;

}



.btnList a:hover {

	background-position: 0 -14px;

}



.btnBlog {

	width: 79px;

	height: 14px;

	margin: 10px 0 0 auto;

	text-indent: -9999px;

	line-height: 100%;

}



.btnBlog a {

	display:block;

	width: 79px;

	height: 14px;

	background: url(/images/btn_toblog.gif) no-repeat 0 0;

}



.btnBlog a:hover {

	background-position: 0 -14px;

}





.contType01 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}





.ttlBold {

	margin-bottom: 10px;

	font-weight: bold;

	color:#333333;

}



.contType02 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType02 .leftCont {

	float: left;

	width: 255px;

}



.contType02 .rightCont {

	float: right;

	width: 255px;

}



.contType03 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType03 .leftCont {

	float: left;

	width: 166px;

}



.contType03 .rightCont {

	float: right;

	width: 344px;

}



.contType04 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType04 .leftCont {

	float: left;

	width: 344px;

}



.contType04 .rightCont {

	float: right;

	width: 166px;

}



.contType05 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType05 .leftCont {

	float: left;

	width: 120px;

}



.contType05 .rightCont {

	float: right;

	width: 390px;

}



.contType06 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType06 .leftCont {

	float: left;

	width: 390px;

}



.contType06 .rightCont {

	float: right;

	width: 120px;

}



.contType07 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType07 .leftCont01 {

	float: left;

	width: 100px;

	padding-right: 15px;

}



.contType07 .leftCont02 {

	float: left;

	width: 140px;

	padding-right: 20px;

}



.contType07 .leftCont02.last {

	float: left;

	padding: 0;

}



.contType08 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType08 .leftCont {

	float: left;

	width: 166px;

	padding-right: 16px;

}



.contType08 .leftCont.last {

	padding: 0px;

}



.contType09 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType09 .leftCont {

	float: left;

	width: 120px;

	padding-right: 16px;

}



.contType09 .leftCont.last {

	padding: 0px;

}



.infoCont {

	margin: 15px;

	padding: 15px 0;

	background: url(/common/line01.gif) no-repeat 0 top;

}



.lineType01 {

	width: 530px;

	padding-bottom: 15px;

	background: url(/common/line01.gif) no-repeat left bottom;

}





.bgCont {

	background: url(/common/bg_productscont.gif);

}



.color01 {

	color: #FF6666;

}



.color02 {

	color: #3399FF;

}



.toTop {

	padding: 10px 0 5px 0;

	text-indent: -9999px;

	line-height: 100%;

}



.toTop a {

	display: block;

	width: 91px;

	height: 15px;

	background: url(/common/btn_totop.gif) no-repeat 0 0;

	text-decoration: none;

}



.toTop a:hover {

	background-position: 0 -15px;

}



.rssBase {

	position: relative;

}



.rssIcon {

	position: absolute;

	top: 5px;

	right: 6px;

}



.dispTitle {

	margin-bottom: 10px;

	color: #333;

	font-weight: bold;

}



.dispList li {

	padding-left: 14px;

	background: url(/common/item06.gif) no-repeat 0 3px;

}



.r18 {

	color: #C1707F;

	font-size: 10px;

	font-weight: bold!important;

}



.end {

	color: #999999;

	font-size: 10px;

	font-weight: bold!important;

}



.infoList {

	margin: 0;

	padding: 0 2px 15px 2px;

}



.infoList dt {

	float: left;

	width: 70px;

	color: #666666;

}



.infoList dd {

	margin: 0 0 5px 70px;

	padding-left: 25px;

	background: url(/common/item01.gif) no-repeat 0 4px;

	color: #333333;

}



/*== #sidebar ============================================================*/



/* 

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



#sidebar {

	float: right;

	width: 180px;

	text-align: left;

}



dl.sideList dt {

	font-size: 10px;

}



dl.sideList dd {

	background: url(/common/item01.gif) no-repeat 0 4px;

	padding-left: 15px;

	font-size: 10px;

}



dl.sideList dd a {

	color: #3399FF;

}



ul.sideList li {

	background: url(/common/item01.gif) no-repeat 0 4px;

	padding-left: 15px;

	font-size: 10px;

}



#bannerArea ul li {

	margin-bottom: 5px;

}





#counter {

	float: right;

}



#counter img {

	float: left;

	padding-left: 1px;

	vertical-align: bottom;

}



#amazonArea {

	text-align: center;

	margin-top: 20px;

	margin-bottom: 20px;

}



#productsNavi {

	margin-bottom: 30px;

}



#productsNavi ul li {

	margin-bottom: 3px;

	text-indent: -9999px;

}



#productsNavi ul li a {

	display: block;

	width: 180px;

	height: 32px;

	text-decoration: none;

}



#productsNavi ul li a:hover {

	background-position: 0 -32px!important;

}



#productsNavi ul li#navi01 a {

	background: url(/common/btn_kanon.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi02 a {

	background: url(/common/btn_air.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi03 a {

	background: url(/common/btn_clannad.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi04 a {

	background: url(/common/btn_planetarian.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi05 a {

	background: url(/common/btn_tomoyo.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi06 a {

	background: url(/common/btn_little.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi07 a {

	background: url(/common/btn_little_ex.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi08 a {

	background: url(/common/btn_kudo.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi09 a {

	background: url(/common/btn_rewrite.jpg) no-repeat 0 0;

}



#productsNavi ul li#navi10 a {

	background: url(/common/btn_rewrite_hf.jpg) no-repeat 0 0;

}


#productsNavi ul li#navi11 a {

	background: url(/common/btn_ab1st.jpg) no-repeat 0 0;

}

#productsNavi ul li#navi12 a {

	background: url(/common/btn_harmonia.jpg) no-repeat 0 0;

}


#productsNavi ul li#navi13 a {

	background: url(/common/btn_summer_pockets.jpg) no-repeat 0 0;

}

.productNavi {

	padding-top: 5px;

}



.productNavi li {

	background: url(/common/item02.gif) no-repeat 8px 0;

	margin-bottom: 5px!important;

	padding-left: 30px;

	color: #999;

	text-indent: 0!important;

}



.productNavi li a {

	background: none!important;

	display: inline!important;

	width: auto!important;

	height: auto!important;

	color: #FF6666!important;

	text-decoration: none!important;

}



.productNavi li a:hover {

	text-decoration: underline!important;

}





#ttlCategory {

	margin-bottom: 15px;

	border-collapse: collapse;

}





.tableType01 th {

	padding: 4px;

	border: 1px solid #CCCCCC;

	background: #EAEAEA;

	font-weight: bold;

	color: #333333;

}



.tableType01 td {

	padding: 4px;

	border: 1px solid #CCCCCC;

	background: #FFFFFF;

}



.tableType01 tr.on td {

	background: #F2F2F2;

}



table tr.center th,

table tr.center td {

	text-align: center;

}



.annotation {

	color: #999999;

	font-size: 10px;

	padding-left: 12px;

	background: url(/common/item03.gif) no-repeat 0 5px;

}



.listType01 {

	padding: 2px 0 0 15px;

	background: url(/common/item04.gif) no-repeat 0 5px;

	font-weight: bold;

	margin-bottom: 30px;

}



.listType01 a {

	color: #3399FF!important;

	text-decoration:none!important;

}



.listType02 li {

	padding: 2px 0 0 15px;

	color: #666;

}



.listType02.type02 {

	color: #999!important;

	font-size: 10px;

}



.listType02 li.list01 {

	background: url(/common/list01.gif) no-repeat 0 5px;

}



.listType02 li.list02 {

	background: url(/common/list02.gif) no-repeat 0 5px;

}



.listType02 li.list03 {

	background: url(/common/list03.gif) no-repeat 0 5px;

}



.listType02 li.list04 {

	background: url(/common/list04.gif) no-repeat 0 5px;

}



.listType02 li.list05 {

	background: url(/common/list05.gif) no-repeat 0 5px;

}



.listType02 li.list06 {

	background: url(/common/list06.gif) no-repeat 0 5px;

}



.listType02 li.list07 {

	background: url(/common/list07.gif) no-repeat 0 5px;

}



.listType02 li.list08 {

	background: url(/common/list08.gif) no-repeat 0 5px;

}



.listType02 li.list09 {

	background: url(/common/list09.gif) no-repeat 0 5px;

}



.listType02 li.list10 {

	background: url(/common/list10.gif) no-repeat 0 5px;

}



.listType03 li {

	color: #666;

	padding: 0 0 0 10px;

	background: url(/common/item05.gif) no-repeat 0 0.5em;

}



.listType03.type02 li {

	color: #999!important;

	font-size: 10px;

	background: url(/common/item05.gif) no-repeat 0 0.5em;

}





/*== #footer ============================================================*/





#footer {

	clear: both;

	width: 800px;

	margin: 0 auto 0 auto;

	padding-top: 22px;

	background: url(/common/bg_mainbottom.gif) no-repeat left top;

}



#footer address {

	width: 198px;

	height: 10px;

	margin: 0 0 0 auto;

	background: url(/common/copyright.gif) no-repeat left top;

	text-indent: -9999px;

}



/*-- もりさと追加分 ---------*/



/*-- Q&A用コーナー回答分タイトルの青バック ---------*/



.qat {

	background: #BFD5FF;

}



/*-- AIRキャラ紹介コーナー用 ---------*/



.contType10 {

	width: 530px;

	padding: 15px;

	margin-bottom: 15px;

}



.contType10 .leftCont {

	float: left;

	width: 200px;

}



.contType10 .rightCont {

	float: right;

	width: 330px;

}









/* smartphone_design

==============================================================*/



@media screen and (max-width: 699px){



#header {

	width: 100%;

	background-color:white;

	position: relative;

	padding-bottom: 6px;

	border-bottom-width: 1px;

	border-bottom-style: solid;

	border-bottom-color: #cccccc;

	min-width:320px;

	background:-moz-linear-gradient(top, rgba(255,255,255,0) 70%, #f5f5f5 100%);

	background:-webkit-gradient(linear, left top, left bottom, color-stop(70%, rgba(255,255,255,0)), color-stop(100%, #f5f5f5));

	background:-webkit-linear-gradient(top, rgba(255,255,255,0) 70%, #f5f5f5 100%);

	background:-o-linear-gradient(top, rgba(255,255,255,0) 70%, #f5f5f5 100%);

	background:-ms-linear-gradient(top, rgba(255,255,255,0) 70%, #f5f5f5 100%);

	background:linear-gradient(to bottom, rgba(255,255,255,0) 70%, #f5f5f5 100%);

	box-shadow:rgba(50, 50, 50, 0.8) 0px 0px 4px 2px;

	-webkit-box-shadow:rgba(50, 50, 50, 0.8) 0px 0px 4px 2px;

	-moz-box-shadow:rgba(50, 50, 50, 0.8) 0px 0px 4px 2px;

	z-index:1;

}



#header h1 {

	background:none;

}



#header #gNavi {

	float: right;

	width: 700px;

	height: 43px;

	padding: 0 20px;

	background: none;

	text-align: right;

	vertical-align: bottom;

}



}