@charset "utf-8";
/* CSS Document */

body{
	background:#fbfaf4;
	font-size:15px;
}
@media screen and (max-width : 680px){
	body{
	font-size:14px;
}
}

p{
	text-align:left;
	}

a{
	text-decoration:none;
	color:#67605e;
}

#wrap{
	width:960px;
	margin:0 auto;
	border-left:1px solid #fff;
	border-right:1px solid #fff;
	box-shadow:0 0 4px #d4d1cb;
}

.con{
	padding-left:50px;
	padding-right:50px;
	}
@media screen and (max-width : 640px){

#wrap{
	width:100%;
}
.topPage .con{
	padding-left:20px;
	padding-right:20px;
	}
}

/*---------header----------*/

#header{
	position:relative;
	background:#fff;
}

.sp{
	display:none;
	}

#logo{
	position:absolute;
	z-index:2;
	top:0px;
	left:0px;
	width:122px;
	height:45px;
}
#logoJcfw{
	position:absolute;
	width:182px;
	height:110px;
	top:20px;
	left:50%;
	margin-left:-91px;
}
.bottomPage h1 {
	padding-top:20px;
	height:105px;
}
.bottomPage h1 img{
	width:182px;
	height:110px;
}
.bottomPage #main{
	background:#fbfaf4;
}
@media screen and (max-width : 640px){
.sp{
	display:block;
	}
.pc{
	display:none;
	}

#logo{
	position:absolute;
	z-index:2;
	top:0px;
	left:0px;
	width:80px;
	height:30px;
}
.topPage #logoJcfw{
	display:none;
}
}

/*---------language----------*/

#langBtn{
	position:absolute;
	z-index:3;
	top:0;
	right:10px;
	width:155px;
	height:34px;
	
}
#langBtn span{
	display:block;
	padding:5px 0 5px 5px;
	width:150px;
	height:24px;
	background: #534d4b;
	color:#fff;
	text-align:center;
	
	cursor:pointer;
	
	-moz-border-radius:0 0 5px 5px;
	-webkit-border-radius:0 0 5px 5px;
	border-radius:0 0 5px 5px;
	-moz-box-shadow: 0px 0px 2px #a49e9e;
	-webkit-box-shadow: 0px 0px 2px #a49e9e;
	box-shadow: 0px 0px 2px #a49e9e;	
}

#langBtn img{
	margin-left:5px;
	vertical-align:middle !important;
	
}

@media screen and (max-width : 640px){
	#langBtn{
	top:0px;
	right:5px;
	width:130px;
	height:30px;
	font-size:15px;
	
	-moz-box-shadow: 0px 0px 2px #cdcdcd;
	-webkit-box-shadow: 0px 0px 2px #cdcdcd;
	box-shadow: 0px 0px 2px #cdcdcd;	
}
#langBtn span{
	padding:5px 10px 15px;
	width:110px;
	height:10px;}
}

#language {
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	left:0;
	background:#000;
	display:none;
	
	z-index:50;
	
	background:rgba(0,0,0,0.6);	
}

#lang{
	width:300px;
	height:314px;
	position:absolute;
    left:50%;
	top:50%;
	margin-left:-150px;
	margin-top:-157px;
	z-index: 100;
	background:#fff;
	border:1px solid #ccc;
	box-shadow:0 0 3px 0 #333;
    overflow:auto;
	text-align:left;
	
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	
	overflow:hidden;
	}

#lang #langHead_ul{
	padding:10px 20px 0;
	height:34px;
	background:#534d4b;
	color:#fff;
	font-size:15px;
	border-bottom:1px solid #fff;
	cursor:pointer;
}

#lang a{
	color:#666;
	text-shadow:0 1px 0 #fff;
	font-size:15px;
	padding:10px 20px 0;
	height:34px;
	display:block;
	background: url(../img/lang_mark.png) no-repeat right 10px #fff;
	-webkit-background-size: 21px 21px;
	background-size:21px 21px;
	border-right:10px solid #fff;
	border-bottom:1px solid #e5e5e5;
}

#lang a.tapStyle{
	background: url(../img/lang_mark_on.png) no-repeat right 10px #fff;
	-webkit-background-size: 21px 21px;
	background-size:21px 21px;
}
/*---------gNav----------*/

#gNavWrap{
	padding-top:125px;
	height:75px;
	background:#fff;
	margin:0 auto;
	border-bottom:1px solid #eceae0;
}

.bottomPage #gNavWrap{
	padding-top:0px;
}

#gNavWrap .sns{
	width:210px;
	float:right;
}

#gNavWrap .sns li{
	float:right;
    width: 80px;
}

#gNav{
	width:640px;
	float:left;
}
#gNav ul{
}

#gNav li{
	height:20px;
	width:160px;
	float:left;
	padding-top:30px;
	text-align:center;
	vertical-align:middle;
	font-weight:bold;
	
}
#gNav li a{
	display:block;
	width:100%;
	height:40px;
}
.th #gNav li a{
	font-size:12px;
}
#gNav li a:hover{
	background:url(../img/bg_gnav_on.png) no-repeat center 30px;
}
.home{
	display:none;
}
@media screen and (max-width : 640px){

#menu{
	background:#fbfaf4;
	position:fixed;
	z-index:1000;
	top:30px;
	left:0;
	width:30px;
	height:60px;
	-moz-box-shadow: 0px 0px 2px #a49e9e;
	-webkit-box-shadow: 0px 0px 2px #a49e9e;
	box-shadow: 0px 0px 2px #a49e9e;
	cursor:pointer;
}
#menu.open{
	left:170px;
}

#gNavWrap{
	padding-top:0;
	height:200px;
	margin:0 auto;
	position:fixed;
	top:30px;
	left:-170px;
	width:170px;
	background:none;
	z-index:999;
	border-bottom:none;
}
#gNav{
	z-index:999;
	width:170px;
	height:204px;
	display:block;
	background:#fbfaf4;
	-moz-box-shadow: 0px 0px 2px #a49e9e;
	-webkit-box-shadow: 0px 0px 2px #a49e9e;
	box-shadow: 0px 0px 2px #a49e9e;
	margin:0;	
}
#gNav li{
	text-align:left;
	float:none;
	width:150px;
	padding:10px;
	display:block;
	height:20px;
	border-bottom:1px solid #eceae0;
}
#gNav li:last-child{
	border-bottom:none;
}
#gNav li a{
	display:block;
	height:30px;
	padding-top:0px;
}

.th #gNav li a{
	font-size:12px;
}
#gNav li a:hover{
	background:none;
}
#sns{
	display:none;
}
.home{
	display:block;
}
}
/*---------JED----------*/


#jed{
	position:absolute;
	top:50px;
	right:10px;
	width:120px;
	height:60px;
	
}

/*---------read----------*/

.readBtn{
	background:url(../img/main_pc.png) no-repeat;
	width:460px;
	height:216px;
	padding:100px 0 0 500px;
	
}
.readBtn .appBtn {
	margin-top:10px;
}
.readBtn .appBtn li{
	display:inline;
	padding-right:10px;
}
.readBtn .appBtn img{
	width:155px;
	margin-right:10px;
}

@media screen and (max-width : 640px){
.readBtn{
	background:none;
	position:absolute;
	width:200px;
	height:150px;
	top:50px;
	right:20px;
	text-align:center;
	margin-top:50px;
	padding-top:0;
	
}
.readBtn .appBtn li{
	display:block;
	padding-right:0px;
	width:155px;
	margin:10px auto 0;
}
}

@media screen and (max-width : 480px){
.readBtn{
	background:none;
	position:absolute;
	width:150px;
	height:100px;
	top:0px;
	right:20px;
	text-align:center;
	margin-top:50px;
	padding-top:0;
}
.readBtn .appBtn li{
	display:block;
	padding-right:0px;
	width:120px;
	margin:10px auto 0;
}
}


/*---------area----------*/
.topPage .viewport {
	border-bottom:1px solid #e6e5e3;
    padding: 20px 0;
}

.topPage .item {
	display:inline;
    width: 80px;
    font-size: 50px;
    text-align: center;
}
.topPage .item img{
	width:60px;
	margin:5px;
	}
.topPage .prev{ display:none;}
.topPage .next{ display:none;}

#areasign{
	border-top:1px solid #eceae0;
	border-bottom:1px solid #eceae0;
	box-shadow:inset 0 0 1px 0 #fff, 0 0 1px 0 #fff;
	padding:10px 0 20px;
}

#areasign h2{
	font-size:20px;
	color:#67605e;
	margin-bottom:20px;
	
	}

/*---------mainNav----------*/

#mainNav{
	margin:0 auto;
	padding:20px;
	}

#mainNav li{
	width:296px;
	float:left;
	margin-right:10px;
	
	}

#mainNav a{
	display:block;
	border:2px solid #eceae0;
	background:#fff;
	padding:10px;
	}

#mainNav li h2{
	padding:65px 0 30px;
	font-size:30px;
}

#mainNav li h3{
	font-size:18px;
	font-weight:normal;
}

.arrowBox{
	border-radius:5px;
	border:1px solid #6f6866;
	margin:10px;
	padding:7px 5px;
	text-align:center;
	line-height:1.2;
	}

.arrowBox span:before{
	content:url(../img/arrow_mini.png);
	padding:0 5px 0 0;
	vertical-align:top;
}
#s01 a{
	background:url(../img/bg_con01.png) no-repeat top right #fff;
	background-size: 70px 57px;
	}

#s01 h2{
	background:url(../img/pic_con01.png) no-repeat center 5px;
	}

#s02 a{
	background:url(../img/bg_con02.png) no-repeat top right #fff;
	background-size: 70px 57px;
	}

#s02 h2{
	background:url(../img/pic_con02.png) no-repeat center 5px;
	}

#s03 a{
	background:url(../img/bg_con03.png) no-repeat top right #fff;
	background-size: 70px 57px;
	}

#s03 h2{
	background:url(../img/pic_con03.png) no-repeat center 5px;
	}
@media screen and (max-width : 640px){

#mainNav {
	width:100%;
	overflow:hidden;
	box-sizing:border-box;
	text-align:center;
	padding:0 5px;
}
#mainNav ul{
	margin:20px auto;
	box-sizing:border-box;
	width:100%;
}
#mainNav li#s01{
	width:49%;
	margin-right:2%;
}
#mainNav li#s02{
	width:49%;
	margin-right:0 !important;
}
#mainNav li#s03{
	margin-top:10px;
	width:100%;
	margin-right:0;
}

#mainNav li h2{
	padding:30px 0 5px;
	font-size:20px;
}

#mainNav li h3{
	font-size:14px;
}
#s01 a{
	background:none;
	/*background:url(../img/bg_con01.png) no-repeat top right #fff;*/
	background-size: 52px 42px;
	}

#s01 h2{
	background:none;
	background:url(../img/pic_con01.png) no-repeat center 5px;
	background-size:42px 25px;
	}

#s02 a{
	background:none;
	/*background:url(../img/bg_con02.png) no-repeat top right #fff;*/
	background-size: 52px 42px;
	}

#s02 h2{
	background:url(../img/pic_con02.png) no-repeat center 5px;
	background-size:42px 25px;
	}

#s03 a{
	background:none;
	/*background:url(../img/bg_con03.png) no-repeat top right #fff;*/
	background-size: 52px 42px;
	}

#s03 h2{
	background:url(../img/pic_con03.png) no-repeat center 5px;
	background-size:50px 25px;
	}

.arrowBox{
	border-radius:5px;
	border:1px solid #6f6866;
	margin:5px;
	padding:5px;
	text-align:center;
	line-height:1.2;
	}

.arrowBox span:before{
	content:url(../img/arrow_mini.png);
	padding:0 5px 0 0;
	vertical-align:middle;
}
}

/*---------NewsSNS----------*/

#newsBox{
	text-align:left;
	background:url(../img/bg_news.png) no-repeat top center #fff;
	padding-top:30px;
}

#newsBox h2{
	font-size:20px;
	padding:10px;
	border-bottom:1px dotted #eceae0;
	color:#534d4c;
}

#newsBox #left{
	float:left;
	width:580px;
}

#newsBox #left .borderBox{
	border:1px solid #c8c7c1;
	margin:0 0 20px 30px;
}

#newsBox #left #news{
	max-height:300px;
	overflow-y:scroll;
}

#newsBox #left #news li{
	padding:10px;
	border-bottom:1px dotted #eceae0;
	line-height:1.4;
}

#newsBox #left #news li:last-child{
	border-bottom:0;
}

#newsBox #left #news .date{
	color:#67605e;
	font-size:13px;
}

#newsBox #left #news .newsText{
	font-size:14px;
}
#newsBox #left #news .newsText a{
	text-decoration:underline;
	color:#333678;
}

#newsBox #right{
	float:right;
	width:336px;
}

#newsBox #right .borderBox{
	border:2px solid #c8c7c1;
	margin:0 30px 20px 0;
}
#newsBox #right .borderBox h2{
	background:#fbfaf4;
}

#newsBox #right .borderBox ul{
	padding:10px;
}

#newsBox #right #share li{
	height:70px;
	width:80px;
	float:left;
}

#newsBox #right #follow li{
	border-bottom:1px solid #c8c7c1;
	padding-bottom:10px;
	margin-bottom:10px;
	
}
#newsBox #right #follow li:last-child{
	border-bottom:none;
	margin-bottom:0;
}
@media screen and (max-width : 640px){

#newsBox #left{
	float:none;
	width:auto;
}

#newsBox #left .borderBox{
	margin:0 5px 20px;
}
#newsBox #left #news .newsText a{
	text-decoration:underline;
	color:#333678;
}

#newsBox #right{
	float:none;
	width:auto;
}	

#newsBox #right .borderBox{
	border:1px solid #c8c7c1;
	margin:0 5px 20px;
}
}

/*---------dlArea----------*/

#dlArea{
	border-top:1px solid #eceae0;
}

#dlArea,
#tohowto{
	border-bottom:1px solid #e6e5e3;
	background:#fff;
	padding:35px;
	text-align:center;
}

#dlArea h2{
	font-size:28px !important;
	color:#c30d23 !important;
	padding:0 0 30px !important;
}
#dlArea .appBtn {
	text-align:center;
}
#dlArea .appBtn li{
	display:inline !important;
	float:none;
	zoom:1;
	padding-left:2px;
}

#dlArea .bnrBtn img{
	width:155px;
	height:54px;}

#dlArea .appBtn{
	text-align:center;
}
#dlArea .bnrBtn{
	width:340px;
	margin:0 auto;
	text-align:center;
}


#dlArea .bnrBtn li{
	text-align:center;
}

#tohowto h2 a{
	display:block;
	background:#e1dfd6;
	font-size:18px;
	color:#67605e;
	padding:20px;
	
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	
}

#tohowto h2 a.tapStyle{
	background:#eaeaea;
	
}


@media screen and (max-width : 640px){

#dlArea,
#tohowto{
	border-bottom:1px solid #e6e5e3;
	background:#fff;
	padding:25px;
}

#dlArea h2{
	font-size:18px !important;
	padding-bottom:10px !important;
	-webkit-background-size:16px 16px;
	background-size:16px 16px;
	
}
#dlArea .bnrBtn{
	margin:0 auto;
	width:250px;
}

#dlArea .bnrBtn img{
	width:120px;
	height:auto;}


#tohowto h2 a{
	font-size:16px;
	padding:15px;
}
}



/*---------inquiry----------*/
#inquiry{
	text-align:left;
	margin:20px 50px;
	color:#67605e
	}
#inquiry h2{
	font-size:18px;
	}
.iBox{
	margin-top:10px;
	border:4px solid #e1dfd6;
	background:#fff;
	padding:20px 20px 10px;
}

.iBox p{
	font-size:14px;
	line-height:1.3;
	padding-bottom:10px;
	}

@media screen and (max-width : 640px){
#inquiry{
	margin:20px 10px;
	}
#inquiry h2{
	font-size:14px;
	}
.iBox{
	padding:10px 10px 0;
}
}

/*---------footer----------*/

#footer p{
	text-align:center;
	}
.totop{
	text-align:center;
	}
.totop a{
	display:block;
	width:54px;
	height:42px;
	padding:10px;
	margin-left:auto;
	margin-right:auto;
	background:url(../img/arrow_totop_on.png) no-repeat 12px 10px;
	}
.back a{
	display:block;
	width:54px;
	height:42px;
	padding:10px;
	background:url(../img/arrow_back_on.png) no-repeat 12px 10px;
	}

.totop a.tapStyle img,
.back a.tapStyle img{
	visibility:hidden;
	}

.policy{
	text-align:left !important;
	padding:10px;
	border-top:1px solid #e6e5e3;
	}
.policy img{
	margin:0 5px 2px 0;
	}

#copyright{
	/*border-top:1px solid #e6e5e3;*/
	padding:10px;
	font-size:10px;}

@media screen and (max-width : 640px){
#footer p{
	text-align:center;
	}
.totop a{
	float:none;
	display:block;
	width:54px;
	height:42px;
	padding:10px;
	margin:0 auto;
	background:url(../img/arrow_totop_on.png) no-repeat 11px 10px;
	}
}

/*---------重要なお知らせ----------*/
#newsBox #left .importantNews h2{
	
}
#newsBox #left .importantNews .spot{
	color: #c30d23;
	font-size:16px;
	font-weight:bold;
	margin:2px 0 8px 0;
}
#newsBox #left .importantNews .newsText span{
	color: #c30d23;
}
