
/*---------------------------------
 基本設定
----------------------------------*/
html {
	font-size: 62.5%;/*10px*/
	overflow-y:scroll;	
}
body {
	line-height: 1.4;
	font-size: 12px;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
	color:#404040;
	-webkit-text-size-adjust: 100%;
	background-color:#fff0f5;	
}

/*　リンク色　*/
a{color:#404040;text-decoration:none;}
a:visited{color:#404040;}
a:hover{color:#a24259;}
.box-content a{color:#a24259;}
.box-content a:visited{color:#a24259;}
.box-content a:hover{color:#a24259;text-decoration:underline;}

/*　段落　*/
.box-content p{	margin-bottom:15px;}
.box-content section{	margin-bottom:30px;}

/*　画像、動画　*/	
img,video {
	max-width:100%;
	height:auto;
}
.ie8 img{
	width: auto;
}


/*---------------------------------
 レイアウト設定
----------------------------------*/
.box-wrapper{
	width:100%;
	max-width:848px;
	margin:0px auto 0px auto;
	background-color:#fff;
	border:1px solid #c12f4c;	
	border-top:none;
	box-shadow:rgba(51, 51, 51, 0.19) 0px 0px 2px 2px;
	-webkit-box-shadow:rgba(51, 51, 51, 0.19) 0px 0px 2px 2px;
	-moz-box-shadow:rgba(51, 51, 51, 0.19) 0px 0px 2px 2px;	
}
.box-main{
	width:100%;
	max-width:848px;
	margin:0 auto;
	border-top:4px solid #ff9b9b;
	background:url(../images/bg_box-main.gif) repeat-y;
}
	.box-main-top{
		width:100%;
		max-width:848px;	
		margin:0 auto;
		border-top:4px solid #ff9b9b;
	}
	.box-main:after,
	.box-main-top:after{
		content: "";
		display:block;
		clear:both;
	}
.box-content{
	float:right;
	width:69.44%;
	margin-top:20px;
	margin-right:2%;
}
	.box-content-top{
		width:100%;
		max-width:808px;
		margin:20px auto 0 auto;
	}
.box-sidebar{
	float:left;
	width:25.65%;
	margin-top:5px;
}
	.box-wrapper:after,
	.box-content:after,
	.box-content-top:after{
		content: "";
		display:block;
		clear:both;
	}
	
@media (max-width:848px){
	.box-wrapper{
		border:0px;	
		box-shadow:none;
		-webkit-box-shadow:none;
		-moz-box-shadow:none;
	}
	.box-main{
		background:none;
	}
	.box-sidebar{
		float:none;
		width:100%;			
	}
	.box-content{
		float:none;
		width:100%;
	}		
}
	

/*---------------------------------
 メインナビゲーション
----------------------------------*/
.mainnav{
	width:100%;
	max-width:848px;
	margin:0 auto;
	height:27px;
	margin-top:7px;
	padding-bottom:7px;
	background:url(../images/bg_mainnav_off.gif) repeat-x;
}
.mainnav ul{
	margin:0px 0px 0px 45px;
	overflow:hidden;
}
.mainnav li{
	float:left;
	width:15.3%;
	text-align:center;
	border-right:1px solid #cd7781;
	color:#993333;
}
.mainnav li:first-child{
	border-left:1px solid #cd7781;
}
.mainnav li a{
	height:22px;
	display:block;
	padding-top:5px;
	color:#993333;
}
.mainnav li a:hover{
	color:#ffffff;
	background:url(../images/bg_mainnav_on.gif) repeat-x;
}

@media (max-width:848px){
	.mainnav{
		width:100%;
		height:auto;
		margin:7px auto 0px auto;
		padding-bottom:5px;
		background:none;
	}
	.mainnav ul{
		margin:0px auto 0px auto;
		overflow:hidden;
	}
	.mainnav li{
		float:left;
		width:33.33%;
		margin-bottom:2px;
		text-align:center;
		border-right:none;
		color:#993333;
		background:url(../images/bg_mainnav_off.gif) repeat-x;
	}
	.mainnav li:nth-child(3n+1){
		clear:left;	
	}
	.mainnav li:first-child{
		border-left:none;	
	}		
	.mainnav li:nth-child(3n-1){
		border-left:1px solid #cd7781;
		border-right:1px solid #cd7781;
		box-sizing: border-box;
	}
}

.mainnav li.active{
	background:url(../images/bg_mainnav_on.gif) repeat-x;
	color:#fff;
}
.mainnav li.active a,
.mainnav li.active a:visited{color:#fff;}


/*---------------------------------
 サイドナビゲーション
----------------------------------*/
.sidenav{
	width:220px;
	margin-bottom:20px;
	padding:10px 0px 10px 0px;
	border-bottom:4px solid #ff9b9b;
}
	.sidenav li{
		background:url(../images/list_sidenav_off.gif) no-repeat 0 50%;
		margin:0px 10px;
	}
		.sidenav li a{
			display:block;
			padding:7px 12px;
			outline:none;	
		}
		.sidenav li a:hover{
			background:url(../images/list_sidenav_on.gif) no-repeat 0 50%;
		}
		
@media (max-width:848px){
	.sidenav{
		width:100%;
		margin-bottom:20px;
		padding:10px 0px 7px 0px;
		border-bottom:none;
		overflow:hidden;
	}
	.sidenav li{
		float:left;
	}
		.sidenav li a{
			display:block;
			padding:3px 0px 3px 10px;
			outline:none;	
		}	
}

.sidenav .active{
	background:url(../images/list_sidenav_on.gif) no-repeat 0 50%;
	color:#a24259;
}
.sidenav .active a,
.sidenav .active a:visited{color:#a24259;}


/*---------------------------------
 サイドバナー
----------------------------------*/
.sidebanner{
	margin:15px auto 0px auto;
}
	.sidebanner li{
		text-align:center;
		margin-bottom:25px;
	}
	
@media (max-width:848px){
	.box-sidebar aside{
		width:100%;
		border-bottom:4px solid #ff9b9b;
	}
	.sidebanner{
		width:370px;
		margin:15px auto 0px auto;
		overflow:hidden;
	}
	.sidebanner li{
		margin-bottom:15px;
		float:left;
		margin-left:15px;
	}
	.sidebanner li:nth-child(2n+1) {
		clear:left;
		margin-left:0px;
	}
}
@media (max-width:370px){
	.sidebanner{
		width:100%;
		margin:15px auto 0px auto;
	}
	.sidebanner li{
		width:50%;
		margin-left:0px;
	}
}

	
/*---------------------------------
 グローバルヘッダー
----------------------------------*/
.global-header{
	width:100%;
	margin:0px auto 0px auto;
	overflow:hidden;
	background:url(../images/bg_header.gif) no-repeat left top;
	position:relative;
}
	@media (max-width:848px){
		.global-header{
			background:none;
			background-color:#c12f4d;
		}
	}
	
.language{
	position:absolute;
	top:10px;
	right:10px;
	overflow:hidden;
}
	.language li{
		float:left;
		padding:0px 7px;
	}
	.language li a{
		color:#c12f4d;
	}	
	.language li.jp{
		border-left:1px solid #c12f4d;
	}
	.language li.en{
		border-left:1px solid #c12f4d;
		border-right:1px solid #c12f4d;	
	}
	@media (max-width:848px){
		.language{
			color:#fff;
		}
		.language li a{
			color:#fff;
		}
		.language li.jp{
			border-left:1px solid #fff;
		}
		.language li.en{
			border-left:1px solid #fff;
			border-right:1px solid #fff;	
		}		
	}
	
.searchbox{
	position:absolute;
	top:33px;
	right:7px;
}
	.searchbtn{
		position:absolute;
		top:5px;
		right:10px;
	}
	.searchtxt{
		width:85px;
		padding-right:25px;
		padding-left:5px;
		border-radius:15px;
		border: 1px solid #d6d6d6;
	}
	@media (max-width:848px){
		.searchtxt{
			border: 1px solid #fff;
		}
		.searchbtn{
			position:absolute;
			top:7px;
			right:7px;
		}			
	}

.social{
	position:absolute;
	top:9px;
	right:116px;
	overflow:hidden;
}
	.social li{
		float:left;
		padding:0px 0px;
	}
	.social li.facebook{margin-right:10px;}
	.social li.twitter{margin-right:15px;}
	@media (max-width:848px){
		.social{
			position:absolute;
			top:9px;
			right:102px;
			overflow:hidden;
		}
		.social li{
			float:left;
			padding:0px 0px;
		}
	}

@media (max-width:445px){
	.logo{
		width:70%;
	}
	.language{
		position:absolute;
		top:5px;
		right:3px;		
		font-size:80%;
	}
	.searchbox{
		position:absolute;
		top:22px;
		right:3px;
	}
	.searchbtn{
		position:absolute;
		top:7px;
		right:7px;
	}		
	.searchtxt{
		width:57px;
	}
	.social{
		position:absolute;
		top:5px;
		right:80px;
		overflow:hidden;
	}
}	

	
/*---------------------------------
 グローバルフッター
----------------------------------*/
.global-footer{
	width:100%;
	max-width:848px;
	margin:0px auto 0px auto;
	padding:5px 0px;
	overflow:hidden;
	color:#ffffff;
	background-color:#c12f4d;
}
.copyright{
	display:block;
	margin-top:10px;
	margin-left:15px;
}

@media (max-width:848px){
	.copyright{
		text-align:center;
		margin:5px;
	}	
	.social{
		float:none;
		width:69px;
		margin-right:0px;
		margin:0 auto;
	}
}	
	

/*---------------------------------
 clearfix
----------------------------------*/
.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.cf {
    *zoom: 1;
}
