@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&family=Noto+Serif+JP:wght@500&display=swap');

/* 3 MediaQuery ---*/
@media screen and (max-width:767px) { /*SP*/
}
@media screen and (min-width:768px) and ( max-width:999px) { /*PC&TB*/
}
@media screen and (min-width:1000px) , print { /*PC*/
}
/* 2 MediaQuery ---*/
@media screen and (max-width:767px) { /*SP*/
}
@media screen and (min-width:768px) , print { /*PC&TB*/
}


/*----------------------------------------------------------------------------------------
コンテンツ大枠
----------------------------------------------------------------------------------------*/

.windowWidth {
	width: 100%;
	margin: 0;
	padding: 0;
	clear: both;
}

.windowWidth a img{transition: 0.3s;}

.windowWidth a img:hover{
    opacity: 0.75;
	cursor: pointer;
}

@media screen and (max-width:767px) { /*SP*/
	.CW960{
		max-width: initial;
		max-width: auto;
		margin:0 auto;
		padding: 0px 15px;
		box-sizing: border-box;
	}
	
	.CW1000{
		max-width: initial;
		max-width: auto;
		margin:0 auto;
		padding: 0px 15px;
		box-sizing: border-box;
	}
}

@media screen and (min-width:768px) and ( max-width:999px) { /*PC&TB*/
	.CW960{
		max-width: initial;
		max-width: auto;
		margin:0 auto;
		padding: 0px 15px;
		box-sizing: border-box;
	}
	
	.CW1000{
		max-width: initial;
		max-width: auto;
		margin:0 auto;
		padding: 0px 15px;
		box-sizing: border-box;
	}
}

@media screen and (min-width:1000px) , print { /*PC*/
	.CW960{
		max-width: 960px;
		margin:0 auto;
		padding: 0;
		box-sizing: border-box;
	}
	
	.CW1000{
		max-width: 1000px;
		margin:0 auto;
		padding: 0;
		box-sizing: border-box;
	}
}


/*----------------------------------------------------------------------------------------
TOP
----------------------------------------------------------------------------------------*/

/*------------------------------- topMVWrap ------------------------------*/

@media screen and (max-width:767px) { /*SP*/
	.topMVWrap{
		padding: 20px 0 0;
		margin: 0 0 60px;
	}
	
	.topMVcontent{
		padding: 0 0;
		background-color: #F4F0EB;
	}
	
	.topMVcontentInr{
		margin: 0 auto;
	}
}

@media screen and (min-width:768px) , print { /*PC&TB*/
	.topMVWrap{
		padding: 200px 0 0;
		margin: 0 0 80px;
	}
	
	.topMVcontent{
		padding: 50px 0;
		background-color: #F4F0EB;
	}
	
	.topMVcontentInr{
		max-width: 1800px;
		margin: 0 auto;
	}
}


/*------------------------------- topContentsWrap ------------------------------*/

@media screen and (max-width:767px) { /*SP*/
	.topContentsWrap{
		padding: 30px 0px;
		background-image: url(../image/top2009/top_contents_back.jpg);
		background-position: center center;
		background-repeat: repeat;
		background-size: auto auto;
	}	
}

@media screen and (min-width:768px) , print { /*PC&TB*/		
	.topContentsWrap{
		padding: 60px 0px;
		background-image: url(../image/top2009/top_contents_back.jpg);
		background-position: center center;
		background-repeat: repeat;
		background-size: auto auto;
	}	
}


/*------------------------------- topInfoSection ------------------------------*/

.topNewsList dt.notice {background-color: #39B54A;}
.topNewsList dt.other {background-color: #f7931e;}
.topNewsList dt.event {background-color: #29abe2;}

.topNewsList dd a{color: #fff;}
.topNewsList dd a:hover{text-decoration: underline;}	


@media screen and (max-width:767px) { /*SP*/
	#topInfoSection{
		display: block;
		margin-bottom: 60px;
	}
	
	.topMainMenuSection{
		width: 100%;
		padding: 0px 15px;
		margin-bottom: 30px;
		box-sizing: border-box;
	}
	
	.topMainMenuBox{
		margin: 0;
	}
	
	.topMainMenuList li{
		margin: 0 0 30px;
	}
	
	.topMainMenuList li a{
		display: block;
		position: relative;
	}
	
	.topMainMenuList li a p{
		position: absolute;
		z-index: 1;
		top: 44vw;
		left: 6vw;
		font-size: 4.1vw;
		line-height: 1.5;
	}
	
	.topMainMenuList li a img{
		width: 100%;
	}
	
	.topNewsSection{
		width: auto;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		background-color: rgba(0,0,0,0.65);
		box-sizing: border-box;
		margin-left: 15px;
		border-radius: 20px 0px 0px 20px;
	}
	
	.topNewsBox{
		width: 100%;
		box-sizing: border-box;
		padding: 10px 15px 20px 15px;
		border-radius: 20px;
	}
	
	.topNewsTitle{
		color: #fff;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-end;
		justify-content: flex-start;
		margin-bottom: 30px;
	}
	
	.topNewsTitle h3{
		font-family: 'Noto Serif JP', serif;
		font-size: 45px;
		font-weight: normal;
		line-height: 1.0;
		margin-right: 15px;
	}
	
	.topNewsTitle a{
		color: #fff;
		display: inline-block;
		position: relative;
		padding-bottom: 7px;
	}
	
	.topNewsTitle a::after{
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #c7b299;
		transform: scale(1,1);
		transform-origin: left top;
		transition: 0.2s ease;
	}
	
	.topNewsTitle a:hover::after{
		opacity: 0;
	}
	
	.topNewsList dl {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: nowrap;
		margin-bottom: 15px;
	}
	
	.topNewsList dt {
		width: 80px;
		text-align: center;
		color: #FFF;
		padding: 5px 5px;
		box-sizing: border-box;
		border-radius: 5px;
	}
	
	.topNewsList dd {
		width: calc(100% - 80px);
		box-sizing: border-box;
		padding: 0px 0px 0px 15px;
	}
}


@media screen and (min-width:768px) and ( max-width:999px) { /*PC&TB*/
	#topInfoSection{
		display: block;
		margin-bottom: 100px;
	}
	
	.topMainMenuSection{
		width: 100%;
		padding: 0px 15px;
		margin-bottom: 30px;
		box-sizing: border-box;
	}
	
	.topMainMenuBox{
		margin: 0;
	}
	
	.topMainMenuList li{
		margin: 0 0 50px;
	}
	
	.topMainMenuList li a{
		display: block;
		position: relative;
	}
	
	.topMainMenuList li a p{
		position: absolute;
		z-index: 1;
		top: 44vw;
		left: 6vw;
		font-size: 4.3vw;
		line-height: 1.5;
	}
	
	.topMainMenuList li a img{
		width: 100%;
	}
	
	.topNewsSection{
		width: auto;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		background-color: rgba(0,0,0,0.65);
		box-sizing: border-box;
		margin-left: 15px;
		border-radius: 20px 0px 0px 20px;
	}
	
	.topNewsBox{
		width: 100%;
		box-sizing: border-box;
		padding: 10px 15px 20px 30px;
		border-radius: 20px;
	}
	
	.topNewsTitle{
		color: #fff;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-end;
		justify-content: flex-start;
		margin-bottom: 30px;
	}
	
	.topNewsTitle h3{
		font-family: 'Noto Serif JP', serif;
		font-size: 60px;
		font-weight: normal;
		line-height: 1.0;
		margin-right: 20px;
	}
	
	.topNewsTitle a{
		color: #fff;
		display: inline-block;
		position: relative;
		padding-bottom: 7px;
	}
	
	.topNewsTitle a::after{
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #c7b299;
		transform: scale(1,1);
		transform-origin: left top;
		transition: 0.2s ease;
	}
	
	.topNewsTitle a:hover::after{
		opacity: 0;
	}
	
	.topNewsList dl {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: nowrap;
		margin-bottom: 15px;
	}
	
	.topNewsList dt {
		width: 80px;
		text-align: center;
		color: #FFF;
		padding: 5px 5px;
		box-sizing: border-box;
		border-radius: 5px;
	}
	
	.topNewsList dd {
		width: calc(100% - 80px);
		box-sizing: border-box;
		padding: 0px 0px 0px 15px;
	}
}


@media screen and (min-width:1000px) , print { /*PC*/
	#topInfoSection{
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin-bottom: 120px;
	}
	
	.topMainMenuSection{
		width: 50%;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-end;
		justify-content: flex-start;
		flex-direction: column;
		box-sizing: border-box;
	}
	
	.topMainMenuBox{
		max-width: 412px;
		box-sizing: border-box;
		margin-right: 40px;
	}
	
	.topMainMenuList li{
		margin: 0 0 50px;
	}
	
	.topMainMenuList li a{
		display: block;
		position: relative;
	}
	
	.topMainMenuList li a p{
		position: absolute;
		z-index: 1;
		top: 195px;
		left: 30px;
	}
	
	.topNewsSection{
		width: 50%;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: column;
		background-color: rgba(0,0,0,0.65);
		box-sizing: border-box;
		border-radius: 20px 0px 0px 20px;
	}
	
	.topNewsBox{
		width: 65%;
		box-sizing: border-box;
		padding: 10px 15px 20px;
		border-radius: 20px;
	}
	
	.topNewsTitle{
		color: #fff;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-end;
		justify-content: flex-start;
		margin-bottom: 30px;
	}
	
	.topNewsTitle h3{
		font-family: 'Noto Serif JP', serif;
		font-size: 60px;
		font-weight: normal;
		line-height: 1.0;
		margin-right: 20px;
	}
	
	.topNewsTitle a{
		color: #fff;
		display: inline-block;
		position: relative;
		padding-bottom: 7px;
	}
	
	.topNewsTitle a::after{
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #c7b299;
		transform: scale(1,1);
		transform-origin: left top;
		transition: 0.2s ease;
	}
	
	.topNewsTitle a:hover::after{
		opacity: 0;
	}
	
	.topNewsList dl {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: nowrap;
		margin-bottom: 15px;
	}
	
	.topNewsList dt {
		width: 80px;
		text-align: center;
		color: #FFF;
		padding: 5px 5px;
		box-sizing: border-box;
		border-radius: 5px;
	}
	
	.topNewsList dd {
		width: calc(100% - 80px);
		box-sizing: border-box;
		padding: 0px 0px 0px 15px;
	}
}


/*------------------------------- topLifeSection ------------------------------*/

@media screen and (max-width:767px) { /*SP*/
	#topLifeSection{
		margin: 0 0 60px;
	}
	
	.topLifeContainer{
		display: block;
	}
	
	.topLifeFl0301{
		width: 100%;
		padding: 0 10%;
		margin-right: 0px;
		margin-bottom: 30px;
		text-align: center;
		box-sizing: border-box;
	}
	
	.topLifeFl0301:nth-child(3n){
		width: 100%;
		margin-right: 0px;
		margin-bottom: 30px;
		text-align: center;
		box-sizing: border-box;
	}
	
	.topLifeContainer .topLifeFl0301:first-child{
		border-radius: 0px 150px 150px 0px;
		padding: 0;
	}
	
	.topLifeFl0301 a{
		display: block;
	}
	
	.topLifeTitle{
		background-color: #fff;
		text-align: center;
		box-sizing: border-box;
		padding: 30px 30px 20px 15px;
		border-radius: 0px 150px 150px 0px;
		margin-left: -15px;
	}
	
	.topLifeFl_textBox{
		background-color: #fff;
		padding: 15px 30px 15px 20px;
		min-height: 70px;
		box-sizing: border-box;
		text-align: left;
		
	}
	
	.topLifeFl_textBox p{
		position: relative;
		z-index: 0;
		padding: 0px 25px 5px 0px;
	}
	
	.topLifeFl_textBox p::before{
		content: '';
		position: absolute;
		z-index: -1;
		bottom: 0;
		left: 0;
		width: 95%;
		height: 3px;
		background-color: #c7b299;
		transform: scale(1,1);
		transform-origin: left top;
	}
	
	.topLifeFl_textBox p::after{
		position: absolute;
		content: '';
		bottom: -9px;
		right: 5%;
		z-index: -1;
		height: 21px;
		width: 12px;
		background-image: url(../image/top2009/top_linkafter_arr.png);
		background-position: left center;
		background-repeat: no-repeat;
		background-size: auto 100%;
	}
}


@media screen and (min-width:768px) , print { /*PC&TB*/
	#topLifeSection{
		margin: 0 0 60px;
	}
	
	.topLifeContainer{
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
	}
	
	.topLifeFl0301{
		width: calc((100% - (26px*2)) /3);
		margin-right: 25px;
		margin-bottom: 30px;
		text-align: center;
	}
	
	.topLifeFl0301:nth-child(3n){
		width: calc((100% - (26px*2)) /3);
		margin-right: 0px;
		margin-bottom: 30px;
	}
	
	.topLifeContainer .topLifeFl0301:first-child{
		border-radius: 50px;
	}
	
	.topLifeFl0301 a{
		display: block;
	}
	
	.topLifeTitle{
		background-color: #fff;
		text-align: center;
		box-sizing: border-box;
		padding: 30px 15px;
		border-radius: 50px;
	}
	
	.topLifeFl_textBox{
		background-color: #fff;
		padding: 15px 30px 15px 20px;
		min-height: 70px;
		box-sizing: border-box;
		text-align: left;
		
	}
	
	.topLifeFl_textBox p{
		position: relative;
		z-index: 0;
		padding: 0px 25px 5px 0px;
	}
	
	.topLifeFl_textBox p::before{
		content: '';
		position: absolute;
		z-index: -1;
		bottom: 0;
		left: 0;
		width: 95%;
		height: 3px;
		background-color: #c7b299;
		transform: scale(1,1);
		transform-origin: left top;
	}
	
	.topLifeFl_textBox p::after{
		position: absolute;
		content: '';
		bottom: -9px;
		right: 8px;
		z-index: -1;
		height: 21px;
		width: 12px;
		background-image: url(../image/top2009/top_linkafter_arr.png);
		background-position: left center;
		background-repeat: no-repeat;
		background-size: auto 100%;
	}
	
}

@media screen and (min-width:768px) and ( max-width:999px) { /*PC&TB*/
	.topLifeTitle img{
		width: 58%;
	}
}


/*------------------------------- topMoveSection ------------------------------*/

@media screen and (max-width:767px) { /*SP*/
	#topMoveSection{
		overflow: hidden;
		margin-bottom: 30px;
	}
	
	.topMoveTitle{
		background-color: #fff;
		text-align: center;
		box-sizing: border-box;
		padding: 15px 30px 15px 15px;
		margin-bottom: 30px;
		border-radius: 0px 130px 130px 0px;
		width: 100%;
		position: relative;
		z-index: 1;
	}
	
	.topMoveTitle img{
		width: 95%;
	}
	
	.topMoveTitle::after{
		position: absolute;
		content: '';
		top: 0;
		left: -100%;
		z-index: -1;
		height: 100%;
		width: 100%;
		background-color: #fff;
	}
	
	.topMoveContainer{
		display: block;
	}
}


@media screen and (min-width:768px) , print { /*PC&TB*/
	#topMoveSection{
		overflow: hidden;
		margin-bottom: 60px;
	}
	
	.topMoveTitle{
		background-color: #fff;
		text-align: center;
		box-sizing: border-box;
		padding: 15px 30px 15px 15px;
		margin-bottom: 30px;
		border-radius: 0px 130px 130px 0px;
		width: 50%;
		position: relative;
		z-index: 1;
	}
	
	.topMoveTitle img{
		width: 323px;
	}
	
	.topMoveTitle::after{
		position: absolute;
		content: '';
		top: 0;
		left: -200%;
		z-index: -1;
		height: 100%;
		width: 200%;
		background-color: #fff;
	}
	
	.topMoveContainer{
		display: flex;
		justify-content: flex-start;
		flex-wrap: wrap;
	}
}


/*------------------------------- topLinkBnrSection ------------------------------*/

@media screen and (max-width:767px) { /*SP*/
	#topLinkBnrSection{
		overflow: hidden;
		margin-bottom: 15px;
	}
	
	.topLinkBnr{
		margin-right: -15px;
	}
	
	.topLinkBnr li{
		margin-bottom: 25px;
		position: relative;
		z-index: 0;
	}
	
	.topLinkBnr .bnrSpot::after{
		position: absolute;
		content: '';
		top: 0;
		right: -90%;
		z-index: -1;
		height: 100%;
		width: 100%;
		background-image: url(../image/top2009/top_bnr_sptback_pc.png);
		background-position: left center;
		background-repeat: repeat-x;
		background-size: auto 100%;
	}
	
	.topLinkBnr .bnrInfo::after{
		position: absolute;
		content: '';
		top: 0;
		right: -90%;
		z-index: -1;
		height: 100%;
		width: 100%;
		background-image: url(../image/top2009/top_bnr_infoback_pc.png);
		background-position: left center;
		background-repeat: repeat-x;
		background-size: auto 100%;
	}
}


@media screen and (min-width:768px) , print { /*PC&TB*/
	#topLinkBnrSection{
		overflow: hidden;
		margin-bottom: 40px;
	}
	
	.topLinkBnr li{
		margin-bottom: 30px;
		position: relative;
		z-index: 0;
	}
	
	.topLinkBnr .bnrSpot::after{
		position: absolute;
		content: '';
		top: 0;
		right: -96%;
		z-index: -1;
		height: 100%;
		width: 100%;
		background-image: url(../image/top2009/top_bnr_sptback_pc.png);
		background-position: left center;
		background-repeat: repeat-x;
		background-size: auto 100%;
	}
	
	.topLinkBnr .bnrInfo::after{
		position: absolute;
		content: '';
		top: 0;
		right: -96%;
		z-index: -1;
		height: 100%;
		width: 100%;
		background-image: url(../image/top2009/top_bnr_infoback_pc.png);
		background-position: left center;
		background-repeat: repeat-x;
		background-size: auto 100%;
	}
}