@charset "UTF-8";

*{
	margin:0;
	padding:0;
}

/*
Style Name: Infosite Module NEO
Description: Responsive web design
Version: 2.0
*/


/*---------------------------------
Structure
-----------------------------------
#wrapper	S00
	 -pulldown(functions)
	└#whfcont	S10	
		└#logo S20
		└#container S30
			└#content S40		
			└#main S50
		└#footer S60
	
====================================
00.default
01.common
-----------------------------------
S	Under 480px for smartphone
M	Over 481px for tablet
L	Under 800px for pc
LL	Over 1060px for wide screen
----------------------------------*/


/*00.default
-----------------------------------*/
body,h1, h2, h3, h4, h5, h6,
p, pre, blockquote,form,input,textarea,fieldset,
ul, ol, dl, li,dt,dd,address,caption {
    margin: 0;
    padding: 0;
}


html { font-size: 62.5%; }

body{
	color: #333;
	font-size: 14px;
	font-size: 1.5em;
	line-height: 1.7;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","メイリオ","ＭＳ Ｐゴシック",Arial,Helvetica,Verdana,sans-serif;
	background: #F2F2F2;
}

table{
	border-collapse: collapse;
	}

p{
	margin-bottom: 1.5em;
	}

.nosc{
	color:#F00;
	font-weight:bold;
}

address,em,caption,th{
	font-style: normal;
	font-weight: normal;
	text-align: left;
	}
	
img{
	max-width: 100%;
	height: auto;
	vertical-align:bottom;
	border: none;
	}

li{	list-style-type: none;	}


/*link*/
a{
	color:#0088CC;
}

a:visited{
	color: #800080;
}


/*01.common style
-----------------------------------*/
.clearfix {zoom: 1;}
.clearfix:after{
    content: "";
    display: block;
    clear: both;}


.alignRight{	text-align: right;	}
.alignLeft{		text-align: left;	}
.floatRight{	float: right;	}
.floatLeft{		float: left;		}
.alignCener{ 	text-align:center;	}


/*page top*/
#pageTop {
	position: fixed;
	right: 5px !important;
	margin-bottom:48px;
}


/*list*/

.red{
	color:#E43B2D;
	}

.clear{	clear:both;	}


.topbox{
	max-width:100%;
    background:#0000ff;
}

.pcblock{
	display:none;
}


/*02.grid layout
-----------------------------------*/

.alignleft { float: left; }


article.pageblock {
    width:100%;
    margin:0em auto 1em auto;
    background:#eee;
}

.topblocks, .sitemenu {
	padding:0 !important;
	display:block;
    margin:0.7em auto 0.7em auto !important;
}

.sitemenu {
	border-style:solid;
	border-color:#cccccc;
	border-width:1px 0 1px 0;	
}

section {
    margin: 0px;
    overflow: hidden;
}

.pageblock section{
	margin: 3px !important;
	background-color:fff;
	
}

section h2{
		margin:0 0 10px 0;
		border-style:solid;
		border-color:#cacad9;
		border-width:0 0 1px 0;
		font-size:1.2em;
}

.articles li, #updates li a{
	max-width:100%;
	margin:7px 0px 0px 0px;
	padding:0px 0px 0px 14px;
	background:url(../images/menupoint.gif) no-repeat 1px 3px;
	line-height:140%;
}

.articles ul{
	margin:0px 0px 10px 0px;
}

.articles{
		padding:10px;
		border-style:solid;
		border-color:#cccccc;
		border-width:1px;
		float:left;
		background-color:#fff;
}


/* animation
article,section {
    -webkit-transition-duration: 0.7s;
    -moz-transition-duration: 0.7s;
    -ms-transition-duration: 0.7s;
    -o-transition-duration: 0.7s;
    transition-duration: 0.7s;
}
article {
    -webkit-transition-property: left, right, top;
    -moz-transition-property: left, right, top;
    -ms-transition-property: left, right, top;
    -o-transition-property: left, right, top;
    transition-property: left, right, top;
}
section {
    -webkit-transition-property: left, right, top;
    -moz-transition-property: left, right, top;
    -ms-transition-property: left, right, top;
    -o-transition-property: left, right, top;
    transition-property: left, right, top;
}

*/


/*.functions
-----------------------------------*/

#cse-search-box {
		width: 200px !important;
	}
	
	#cse-search-box div{
		
	}
	 
	#cse-search-box td {
		padding: 0 !important;
	}
	
	#cse-search-box input[type="text"] {
		
		height: 25px;
		padding: 0 !important;
		width: 75%;
		box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.20);
		-moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.20);
		-webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.20);	
		border: 1px solid #999999;
	
	}
	
	#cse-search-box input[type="submit"] {
		background: #111111;
		border: 1;
		color: white;
		height: 27px;
		margin-left: ;
		overflow: hidden;
		text-indent: ;
		-webkit-appearance: none;
		width: 17%;
		font-size:15px;
}

ul.dropdownMenu{
	width:315px !important;
}

ul.dropdownMenu ul li{
	width:305px !important;
}

ul.dropdownMenu li { 
	width:105px !important;
}

#menu01{
	display:none;
}

.dropdownMenu img{
    position:relative;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
}

.dropdownMenu img:hover{
	 position: relative;
	 top: 1px;
	 left: 1px;
	 cursor:pointer;
}

img.nomove:hover{
	 top: 0px !important;
	 left: 0px !important;
}

#mnavi img{
	margin:2px 10px 0 5px;
}

.ssearch{
	width:260px;
	margin:5px 0 0 5px; !important;
	opacity:1 !important;
}

#fontSize{
	margin-top:2px; !important;
}

.onlypc{
	display:none;
}

.changeBtn{
	margin:0 10px 0 10px;	
}

#switch_area{
	margin:2px 0 0 2px; !important;
}

#switch_area img{
	margin:0 10px 0 5px;
}


/*accordion area
-----------------------------------*/
#acMenu dt{
    display:block;
    width:90%;
	margin:0.8em auto 0em auto;
	padding:10px;
	font-weight:bold;
	color:#666666;
    height:30px;
    line-height:30px;
    text-align:center;
    border:#999999 1px solid;
    cursor:pointer;
	
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
    -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
	
	background: -moz-linear-gradient(top center, #fefefe 0%, #F0F0F0 100%); 
	background: -webkit-gradient(linear, center top, center bottom, from(#fefefe), to(#F0F0F0)); 
	background: linear-gradient(top center, #fefefe 0%, #F0F0F0 100%); 
	
	text-shadow:1px 1px 0px rgba(255,255,255,0.3),1px 1px 2px rgba(0,0,0,0.3);
    }
	
#acMenu dt img{
	margin:0 0 2px 10px;
	vertical-align:middle;
}
	
#acMenu dd{
    width:100%;
    height:auto;
    text-align:center;
    border:#666 0px solid;
    display:none;
    }

#acMenu dt img.close{
	display:none;
	}	

#acMenu dt.active img.open{
	display:none;
	}
	
#acMenu dt img.open{
	display:inline;
	}
	
#acMenu dt.active img.close{
	display:inline;
	}

/*====================================================
Under 480px for smartphone
====================================================*/

/*S00.wrapper
-----------------------------------*/

#wrapper{
	position: relative;
	width: 100%;
	margin: 0 auto;
}


/*S10.whfcont
-----------------------------------*/

#whfcont{
	border-style:solid;
	border-color:#cccccc;
	border-width:1px;
	overflow:hidden;
}


/*S20.logo
-----------------------------------*/
	
#logo{
	margin: 0px auto 0 auto;
}

.favlink{
	display:none;
}


/*S30.container
-----------------------------------*/
#container{
	margin: 0 auto;
	background-color:#FFF;
	}


/*S40.content
-----------------------------------*/
#content{
	margin-bottom: 0em;
	background: #fff;
}


/*S50.main
-----------------------------------*/
#main{
	overflow: hidden;
	padding: 0px;
}

.articles{
		width:90%;
}


#sitesummary{
	background-color:#f7f7f7;
	margin:0em auto 0.5em auto;
	max-width:90%;
	padding:10px;
	text-align:left;
}

#sitesummary h1{
	font-size:20px;
	font-size:1.4em;
	
}
		
#centerbox{
		margin:0.9em auto 0 auto;
		border-style:solid;
		border-color:#0000GG;
		border-width:0px;
		min-height:200px;
}

#unotice{
		margin:1em auto 1em auto;
		border-style:solid;
		border-color:#ff0000;
		border-width:0px;
		text-align:center;
		font-size:12px;
}
	
	
/*.footer
-----------------------------------*/

	#footer{
		margin-top:0;
		padding-top:10px;	
		background-color:#111;
		color: #FFF;
	}
	
	#footer a{
		color: #FFF;	
	}
	
	#footerInner{
		margin:0 auto 0 auto;
		display: table;	
	}
	
	#footerInner span{
		line-height:3;
		padding:0 20px 0 20px;
	}

	
	#footer #copyRight{
		margin:0 auto 0 auto;
		max-width: 90%;
		padding: 10px 0 2em 0;
		font-size: 14px;
		font-size: 1.4rem;
		text-align:center;
	}
	

/*====================================================
Over 481px for tablet
====================================================*/
@media only screen and (min-width: 30.0625em){	/*481px*/


/*.functions
-----------------------------------*/

ul.dropdownMenu{
	width:450px !important;
}

ul.dropdownMenu ul li{
	width:440px !important;
}

ul.dropdownMenu li { 
	width:150px !important;
}

#cse-search-box {
		width: 260px !important;
}


/*M10.whfcont
-----------------------------------*/

#whfcont{
	margin-top:3px;
}


/*M40.content
-----------------------------------*/
#content{
}

#main{
}


.onlysp{
	display:none;
}

.pcblock{
	display:block;
}

.articles{
		max-width:230px;
}


/*M60.footer
-----------------------------------*/
#footer{
}

	#footerInner{
		margin-top:10px;	
	}
	
	#footer #copyRight{
	}		
		
}

/*====================================================
Over 850px for pc
====================================================*/
@media only screen and (min-width: 851px){
	
	
	/*.functions
	-----------------------------------*/
	
	.changeBtn{
		margin:0 5px 0 5px;	
	}
	
	ul.dropdownMenu {
		width:800px !important;
	}
	
	ul.dropdownMenu{
		visibility: hidden;
	}
	
	ul.dropdownMenu ul{
		width:100% !important;
		position: absolute !important;
		left: 0px !important;
		top: 0px !important;
	}
	
	ul.dropdownMenu ul li{
		width:100% !important;
		padding-left:0 !important;
	}
	
	.ssearch, #fontSize, #switch_area{
		visibility: visible !important;
		display:block !important;
	}
	
	.ssearch{
		margin-left:0px;
		left:0px;
	}
	
	#fontSize{
		position: absolute;
		left:300px; !important;
	}
	
	.onlypc{
		display:inline;
	}
	
	#switch_area{
		float:right;
	}
	
	#switch_area img{
		margin:0 0px 0 10px;
	}
	
	
	/*L00.wrapper
	-----------------------------------*/
	#wrapper{
		margin-top:5px;
	}
	

	/*L10.whfcont
	-----------------------------------*/
	#whfcont{
		width:850px;
		margin: 5px auto 0px auto;
	}
	
	
	/*L20.logo
	-----------------------------------*/
	
	#logo{
	position:relative;
	}
	
	.favlink{
	display:block;
	position:absolute;
	bottom:10px;
	left:10px;
	}
	
	.favlink input{
		box-shadow: 0px 0px 15px #fff, 0px 0px 15px #fff;
	}
	

	/*L30.container
	-----------------------------------*/
	.sitemenu {
	border-width:0;	
	}
	
	#container{
		position: relative;
		/*width: 800px;*/
	}
	
	#centerbox{
		margin:1.2em auto 0 auto;
	}
	
	
	/*accordion area
	-----------------------------------*/
	#acMenu dt{
    display:none;		
	}
	
	#acMenu dd{
    display:block;
    }	
	

	/*L40.content
	-----------------------------------*/
	#content{
		margin: 0;
	}

	#main{
	}

	/*L60.footer
	-----------------------------------*/
	#footer{
	}
		
		#footer #copyRight{
		}
				
	#pagenavi{
	}
	
		#pagenavi .tohome{
		margin:auto;
		max-width:80px;
		display: block;		
		}
		
		
	#sitesummary{
	border: 1px solid #cacad9;
	margin-top:1.2em;
	}
				
}

/*====================================================
Over 1060px for wide screen
====================================================*/
@media only screen and (min-width: 60.3125em){	/*965px:1061px=66.3125em*/


	/*LL00.wrapper
	-----------------------------------*/
	#wrapper{
	}


	/*LL20.logo
	-----------------------------------*/

	#logo{
		width:auto;
	}

	/*LL30.container
	-----------------------------------*/
	
	#container{
		width: 850px;
	}
	

	/*LL40.content
	-----------------------------------*/
	#content{
		width: 850px;
	}


}