@charset "utf-8";
/* =======================================
 * Style Name: CommonElements
 * Style URL: ./css/smartp/coomon.css
 * Description: Common Stylesheet
 * Version: 1.0
 * Last Up Date: 2012/6/18
 * Author: Prime works
 * Author URL: http://www.primeworks.jp/
 *
 * Markup Reference:
 *
======================================= */
	
/* =======================================
	ClearFixElements
======================================= */
.clearfix:after{
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
.clearfix{
	min-height: 1px;
}

* html .clearfix{
	height: 1px;
	/*￥*//*/
	height: auto;
	overflow: hidden;
	/**/
}

/* =======================================
	Header Elements
======================================= */
header{
	background:#FFF;
	display:block;
	width: 100%;
	height: 53px;
}

#header h1{
	
}

#header ul{
	margin-top: 5px;
	text-align: center;
}

#header li{
	display: table-cell;
	float: left;
	margin: 0 2px;
	min-width: 44px;
	height: 44px;
	vertical-align: top;
}
#header li.noLogin{
	margin: 0;	
}
#header li.point {
	background: url(../img/site/header/header_current.png) top left no-repeat;	
}
#header li.point span {
	display: inline-block;
	margin-top: 23px;
	padding: 2px;
	border-radius: 5px;
	color: #ffffff;
	font-size: 13px;
	background: #9ed601;	
}
#headerArea {
	margin: 0 auto;	
}

/* =======================================
	Title Elements
======================================= */
#headerArea h2#titleBelt {
	width: 98%;
	height: 20px;
	line-heiht: 20px;
	margin-bottom: 4px;
	padding: 2px 0 2px 2%;
	color: #ffffff;
	background: #9fd601;
}
h2.title {
	background-image:url(../../img/site/bk_tit_brown.png);
	text-align:left;
}
h3.subTitle {
	margin: 5px 5px auto;
}
h4.titleBelt {
	width: 100%;
	margin: 5px auto;
	padding: 3px 0;
}

/* =======================================
	id=main Elements
======================================= */
div#main {
	padding: 0 10px;
}

/* =======================================
	Footer Elements
======================================= */

footer {
	text-align: center;
	width: 100%;
}

footer ul{
	border-top: solid 1px #999;	
	margin-top: 10px;
	width: 100%;
}
footer ul li a{
	display: block;
	padding-left: 25px;
	height: 40px;
	line-height: 40px;
	border-bottom: solid 1px #999;
	text-align:left;
}

footer address{
	clear: both;
	height: 20px;
	width: 100%;
	line-height: 20px;
	color: #fff;
	font-style: normal;
	text-align: center;
	background: #000;
}

/* for footer includes */
div#footerNavi {
	width: 100%;
	text-align: center;
}
div#footerNavi p {
	padding: 2px;
	color: #ffffff;
	background: #999999;	
}
div#footerNavi ul{
	border-top: solid 1px #999;	
	width: 100%;
}
div#footerNavi ul li a{
	display: block;
	height: 40px;
	line-height: 40px;
	padding-left: 25px;
	border-bottom: solid 1px #999;
	text-align:left;
}

/* =======================================
	Page Elements
======================================= */

.NextPage {
	margin: 0 10px 10px 0;
	text-align: right;
}

.BackPage {
	margin: 0 0 10px 10px;
	text-align: left;
}

/* =======================================
	Error　Elements
======================================= */
.error1{
	margin-left:20px;
	padding:5px 0 10px 0;
}
.error1 li{
	padding-bottom:5px;
	list-style:disc;
	font-size:130%;
	color:#f00;
}

/* =======================================
	Paragraph　Elements
======================================= */
.centerPar{
	margin: 0 auto;
}
.floatR {
	float: right;	
}
.floatL {
	float: left;	
}
.margin {
		margin-top: 8px;
		height: 0;
}
.margin1 {
	margin: 5px;
}
.margin2 {
	margin: 10px;
}
.marginTB1 {
	margin-top: 10px;
	margin-bottom: 10px;	
}
.padding1 {
	padding: 5px;	
}
.padding2 {
	padding: 10px;	
}
.paddingTB1 {
	padding-top: 5px;
	padding-bottom: 5px;	
}
.btnPadding {
	padding-top: 8px;
	padding-bottom: 8px;	
}
.btnPadding2 {
	padding-top: 10px;
	padding-bottom: 10px;
	font-size:16px;
}
.padding10 {
	padding: 0 10px;	
}

/* =======================================
	Text　Elements
======================================= */
.textC {
	text-align: center;	
}
.textR {
	text-align: right;	
}
.textL {
	text-align: left;	
}

/* =======================================
	Image　Elements
======================================= */
.borderBB{
	border-bottom: dashed 1px #999999;
}


/* =======================================
	Image　Elements
======================================= */
.roundedImg{
    width: 75px;
    height: 75px;
    display: inline-block;
    overflow: hidden;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .4);	
}

/* =======================================
	List　Elements
======================================= */
div.centerList{
	width: 100%;
	position: relative;
	text-align: center;
	padding: 0;
	overflow: hidden;
}
div.centerList ul{
	position: relative;
	float: left;
	left: 50%;
}
div.centerList ul li{
	position: relative;
	float: left;
	left: -50%;
	margin: 2px;
	z-index: 10;
}

ul.menuList{
	text-align:center;	
}
ul.menuList li {
	display: inline-block;
}

ul.inlineBlockList {
	text-align: center;
}
ul.inlineBlockList li {
	display: inline-block;
}

ul.charList {
	text-align:center;	
}
ul.charList li {
	display: inline-block;
}
ul.charList li.bigThum{
	width: 80px;
	margin: 4px;
	vertical-align: top;
}
ul.charList li.smallThum{
	width: 70px;
	margin: 2px;
}

.valignTopList li {
	display: table-cell;
	overflow: hidden;
	vertical-align: top;
}
/* =======================================
	Btn　Elements
======================================= */
/*DownloadButton*/ 
/* ボタン使用時はdivにdlBtnと色指定クラスdlBtnColorXを同時に指定 */
div.dlBtn a{
	display: block;
	margin: 15px auto;
	padding: 4px 25px 4px 10px;
	width: 60%;
	height: 32px;
	line-height: 32px;
	font-size: 13px;
	text-align: left;	 
	text-decoration: none;
	text-shadow: 0px 1px 1px #000;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
    -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .4);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .4);	
	border-radius: 5px;
}
div.dlBtn span{
	float: right;	
}

.dlBtnRelative{
	position: relative;	
}

.roundedBtn {
	border-radius: 5px;
}
.roundedBtn a{
	display: block;
	color: #ffffff;	
	text-decoration: none;
}

/*BackLinkHomeButton*/ 
div.bklHome {
	min-height: 30px;
	line-height: 30px;
	margin: 20px 0 0 0px;
	padding: 5px 0 5px 0px;
	text-align:left;
	border-top: #CCC solid 1px;
	background: #ffffff;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#FFF));　/* Safari,Google Chrome用 */
	background: -moz-linear-gradient(top, #eee, #FFF);　/* Firefox用 */ 
}
div.bklHome a ,div.bklHome span {
	display: inline-block;
	padding:0 4px;
	color: #333;
	text-align: left;
	background: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#FFF));　/* Safari,Google Chrome用 */
	background: -moz-linear-gradient(top, #eee, #FFF);　/* Firefox用 */ 
}
/* =======================================
	Contents　Elements
======================================= */
/* CLST等のコンテンツ領域 */
.baseBlock {
	width: 100%;
	margin: 0 auto 2px;
	padding-top: 5px;
	padding-bottom: 5px;
}
.innerBox {
	width: 96%;
	margin: 2% auto;
	padding: 2%;
	
}
.contentsBox {
	width: 96%;
	margin-bottom: 4px;
	padding: 0px 2% 2%;
}

.contentsBox a {
	display: block;
	text-decoration: none;	
}
/* =======================================
	BG　Elements
======================================= */
.bgParents{
	position: relative;
}
.bgContents{
	position: relative;
	z-index: 10;
}
.baseBG{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	z-index: 1;
	width: 100%;
	background-color: #ffeeff;
}
.trnsBG{
	opacity: 0.6;
	filter: alpha(opacity=60);	/* IE6、IE7対応 */
	-moz-opacity: 0.6;		/* Firefox1.5以前対応 */	
}
/* =======================================
	Text　Elements
======================================= */
.textShadow{
	text-shadow: 0px 1px 1px #000;
}

.radiusTxt{
	display: block;
	margin: 10px 5px;
	padding: 4px;
	font-size: 13px;
	border-radius: 5px;
	/*border: solid 1px #8dc422;*/
}


/* =======================================
	Color Set
======================================= */
.rgstBtnColor {
	color: #fff;            
    background: #ff9933; 
			-webkit-gradient(linear, left top, left bottom, from(#ff9933),
			color-stop(0.4, #ff9933),  
            color-stop(0.5, #ff6600),  
            to(#ff6600))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #ff6600;		
}
.btnColor1 {
	color: #fff;            
    background: #b4d92d; 
    background:	 
			-webkit-gradient(linear, left top, left bottom, from(#b4d92d),
			color-stop(0.4, #b4d92d),  
            color-stop(0.5, #8dc422),  
            to(#8dc422))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #8dc422;	
}
.btnColor2 {
	color: #fff;
    background: #ff6666;
    background:	 
			-webkit-gradient(linear, left top, left bottom, from(#ff6666),
			color-stop(0.4, #ff6666),  
            color-stop(0.5, #cc3333),  
            to(#cc3333))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #990000;	
}
.noLinkBtnColor {
	color: #ffffff;
	background: #999999;	
    background:	 
			-webkit-gradient(linear, left top, left bottom, from(#999999),
			color-stop(0.4, #999999),  
            color-stop(0.5, #666666),  
            to(#666666))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #666666;	
}
.dlBtnColor1 {
	color: #fff;            
    background: #f8999f; 
    background:	 
			-webkit-gradient(linear, left top, left bottom, from(#f8999f),
			color-stop(0.4, #f8999f),  
            color-stop(0.5, #f78990),  
            to(#f78990))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #f78990;	
}
.dlBtnColor2 {
	color: #fff;
    background: #ff6666;
    background:	 
			-webkit-gradient(linear, left top, left bottom, from(#ff6666),
			color-stop(0.4, #ff6666),  
            color-stop(0.5, #cc3333),  
            to(#cc3333))  ;　/* Safari,Google Chrome用 */ 
	border: solid 1px #990000;	
}
.textColor1 {
	color: #666666;	
}
.getsugakuColor {
	color: #990000;	
}
.getsugakuAreaColor {
	display: block;
	margin: 2px 0;
	padding: 2px;
	border: 1px solid #ffffff;
	color: #ffffff;
	background: #990000;	
}
.juryoColor {
	color: #0066cc;
}
.juryoAreaColor {
	display: block;
	margin: 2px 0;
	padding: 2px;
	border: 1px solid #ffffff;
	color: #ffffff;
	background: #0066cc;
}
.searchColor {
	color: #000000;
	background: #ffc301;	
}
.cautionColor {
	color: #ff0000;	
}
.salesPromotionColor {
	background: #ff9933;
}
.rankColor {
	color: #000000;	
}
.commentColor {
	color: #333333;	
}
/* =======================================
	Indivisual Element
======================================= */
#search select {
	padding: 5px 2px;
	margin: 2px auto;
	
}
#search input[type="submit"] {
	padding: 10px 0 15px;
}
#search {
	background: #efefef;	
}
.otherItem {
	width: 100%;
	margin: 1px 0;
	padding: 2px 0;
	font-size: 11px;
}
.otherItem span{
	color: #333333;
}
.otherItem p {
	margin-left: 115px;	
	color: #000000;
}
.otherItem a {
	color: #ffffff;	
}
.otherItemColor1 {
	background: #ff8500;
}
.otherItemColor2 {
	background: #ff85a2;	
}

/* =======================================
	Include Files
======================================= */
.externalLinkBox {
	width: 96%;
	margin: 5px auto;
	padding: 8px 1%;
	border: 1px solid #cccccc;
	border-radius: 10px;
	box-shadow: 0 0 6px #666666;
	-webkit-box-shadow: 0 0 6px #666666;
	-moz-box-shadow: 0 0 6px #666666;
	text-align: center;
	background: #ffffff;
}
.externalLinkBox .siteInfo {
	margin: 0;
	padding: 0;
}
.externalLinkBox .externalLinkImg {
	width: 98%;
}
.externalLinkBox .externalLinkBtn {
	width: 96%;
	margin-top: 10px;
}
.externalLinkBox ul.externalLinkBtn , .externalLinkBox ul.externalLinkAppHorizonal {
	margin: 0px auto;
}
.externalLinkBox ul.externalLinkBtn li {
	display: inline-block;	
	width: 45%;
}
.externalLinkBox ul.externalLinkBtn li.big {
	width: 96%;	
}
.externalLinkBox ul.externalLinkBtn li a {
	display: block;
	margin-top: 0px;
	padding: 10px;
	border-radius: 5px;
}
.externalLinkBox a.externalLinkThumb {
	display: block;
	float: left;
	width: 48%;
	margin: 5px 1%;
}
.externalLinkBox ul.externalLinkAppHorizonal {}

.externalLinkBox ul.externalLinkAppHorizonal li {
	display: inline-block;
	width: 29%;
	margin: 0 2%;
	padding: 5px 0;
}
.externalLinkBox ul.externalLinkAppHorizonal img {
	width: 100%;
}
.externalLinkBox ul.externalLinkAppHorizonal li div {
	margin-top: 4px;
	padding: 4px 0;
	border-radius: 5px;
}
.externalLinkBox a {
	text-decoration: none;	
}
.externalLinkBox a.externalLinkApp {
	display: -webkit-box;
	display: -moz-box;
	width: 98%;
	margin: 0 auto 5px;
	padding: 0 0 5px;
	border-bottom: 1px dotted #999999;
	text-align: left;
}
.externalLinkBox a.externalLinkApp div.externalLinkAppImg {
	width: 100px;
}
.externalLinkBox a.externalLinkApp div.externalLinkAppImg img {
	width: 100%;
}
.externalLinkBox a.externalLinkApp div.externalLinkAppInfo {
	-webkit-box-flex: 1;
	-weblit-box-sizing: border-box;
	-moz-box-flex: 1;
	-moz-box-sizing: border-box;
	margin-left: 10px;
}
.externalLinkBox a.externalLinkApp div.externalLinkAppInfo p {
	color: #666666;
}
.externalLinkBox a.externalLinkApp div.externalLinkAppBtn  {
	display: inline-block;
	width: 40%;
	margin-top: 10px;
	margin-left: 60%;
	padding: 5px 0;
	border-radius: 5px;
	text-align: center;
}
.externalLinkBox a.externalLinkThumb img { width: 50%; }
.suzy ul.externalLinkBtn li a, .suzy .externalLinkAppBtn,
.suzy ul.externalLinkAppHorizonal li div { color: #ffffff; background: #ff9900; }
.suzy .siteInfo { color: #ff9900; }
.ado ul.externalLinkBtn li a , .ado .externalLinkAppBtn,
.ado ul.externalLinkAppHorizonal li div { color: #ffffff; background: #ff0099; }
.ado .siteInfo { color: #ff0099; }
.usa ul.externalLinkBtn li a , .usa .externalLinkAppBtn,
.usa ul.externalLinkAppHorizonal li div { color: #ffffff; background: #ff3300; }
.usa .siteInfo { color: #ff3300; }
.lisagas ul.externalLinkBtn li a , .lisagas .externalLinkAppBtn,
.lisagas ul.externalLinkAppHorizonal li div { color: #ffffff; background: #996600; }
.lisagas .siteInfo { color: #996600; }
.gatya ul.externalLinkBtn li a , .gatya .externalLinkAppBtn,
.gatya ul.externalLinkAppHorizonal li div { color: #ffffff; background: #663300; }
.gatya .siteInfo { color: #996600; }


/*--- flipsnap ---*/
.carouselArea { 
	position: relative;
	width: 100%; 
	margin: 0 auto;
}
.carouselArea .prev, .carouselArea .next {
	position: absolute;
	top: 0;
	height: 100px;
	line-height: 100px;
	z-index: 100;
}
.carouselArea .prev { left: 0; padding: 10px 20px 10px 5px; }
.carouselArea .next { right: 0; padding: 10px 5px 10px 20px; }	
.carouselArea .viewport {
	position: relative;
    width: 440px;
    overflow: hidden;
    margin: 0 auto;
	padding: 10px 0;
}
.carouselArea .item {
    float: left;
    width: 440px;
    text-align: center;
}
.carouselArea .item img { width: 100%; }
.carouselArea .pointer {
  text-align: center;
  padding: 0 0 5px;
}
.carouselArea .pointer span {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 10px;
  background: #cccccc;
}
.carouselArea .pointer span.current {
  background: #9CC813;
}