@charset "utf-8";

body {
	background: url(../img/body_bg.gif);
}

/* ------------------------------------------------------------------
 Header styles
-------------------------------------------------------------------*/

#header {
	width: 812px;
	margin: 0 auto;
	height: 147px;
	position:relative;
	background:url(../img/header_bg.gif) left top repeat-x;
}

#header #site_id {
	width:245px;
	height:27px;
	position:absolute;
	top:28px;
	left:42px;
}

#header .text_size{
	width:205px;
	height:25px;
	position:absolute;
	top:31px;
	right:42px;
}

.text_size dl{
	overflow:hidden;
	zoom:1;}

.text_size dt,
.text_size dd{
	float:left;
}

.text_size dt{
	width:83px;
	height:25px;
	background:url(../img/header_parts.gif) no-repeat 0px 0px;
	text-indent:-9999px;
	}
	
.text_size dd{
	margin-right:1px;
	}

.text_size dd.standard{
	width:60px;
	height:25px;
	background:url(../img/header_parts.gif) no-repeat -83px 0;
	text-indent:-9999px;
	display:block;
	cursor:pointer;
	}
	
.text_size dd.big{
	width:60px;
	height:25px;
	background:url(../img/header_parts.gif) no-repeat -144px 0;
	text-indent:-9999px;
	display:block;
	cursor:pointer;
	}

#header #global_nav{ padding-top:81px;}
#header #global_nav li{ float:left;}
#header #global_nav li a img:hover{ 
	filter:alpha(opacity=0);
opacity:0;}

#header #global_nav li a.current{ 
	filter:alpha(opacity=0);
opacity:0;}

/* ------------------------------------------------------------------
 Slider
-------------------------------------------------------------------*/

#slider{ padding:14px 0; background:url(../img/main_visual_bg.gif); position:relative;}

/* ------------------------------------------------------------------
 Contents
-------------------------------------------------------------------*/
#contents .mainvisual{
	margin-bottom:15px;}
#top #contents_wrap{
	background:url(../img/contents_bg.gif);
	border-top:2px solid #e5e5e5;
	padding-top:20px;
	zoom:1;
}


#contents{ 
	margin:0 auto;
	position:relative;
	font-size:107%;
	background-color:#FFF;
	width:784px;
	padding-top:15px;
	}

#top #contents{
	padding-top:0px;}
	
#main{
	width:728px;
	padding:14px 28px 28px 28px;
	background-color:#FFF;
}

#banners{ overflow:hidden; zoom:1; background:#ecece9; padding:13px 0px 13px 0px; border:1px solid #f8f8f7;
margin:0 14px;}
#banners li{ float:left; margin-left:14px;}


/* ------------------------------------------------------------------
 Footer
-------------------------------------------------------------------*/

#footer{ font-size:107%; width:784px;
	padding:0;
	background-color:#FFF; margin:0 auto;
	padding-top:15px;}
#footer .foot_nav{ width:728px; overflow:hidden; zoom:1; margin-bottom:14px; margin:0 auto; }
#footer .foot_nav ul{ text-align:center;}
#footer .foot_nav ul li{ display:inline;}
#footer .foot_nav ul li a{line-height:31px;}
#footer .add{border-top:1px solid #ccc; background:#FFF;}
#footer .add .add_wrap{ width:960px; margin:0 auto; padding:8px 0; overflow:hidden; zoom:1; }
#footer .add .add_wrap dl{ line-height:31px; width:695px;}
#footer .add .add_wrap dt{ float:left; padding-top:4px;}
#footer .add .add_wrap dt,
#footer .add .add_wrap dd{ float:left; font-size:92%;}
#footer .add .add_wrap dd{ padding-left:15px;}
#footer .add .add_wrap dl{ float:left;}
#footer .add .add_wrap ul{ float:right; overflow:hidden; zoom:1; width:260px;}
#footer .add .add_wrap ul li{ float:left; margin-left:10px;}
#footer .copy{ background-color:#007b43; padding:20px 0; color:#FFF;}
#footer .copy p{text-align:center;}


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

.news_area{ border:1px solid #CCC; border-top:0px;}
	
.news_area dl{
	margin-bottom:15px;
}
	
.news_area dt{
	position:absolute;
	line-height:1.4;
	width:120px;
	padding-left:30px;
	background:url(../img/ico_square.gif) no-repeat 14px 1.55em;
	padding-top:15px;
	padding-bottom:15px;
}

.news_area dd{
	padding-left:150px;
	padding-top:18px;
	padding-bottom:18px;
	background:url(../img/line_dod.gif) repeat-x bottom left;
	line-height:1.4;
	overflow:hidden;
	zoom:1;
	display: flex;
}
.news_area dd.odd{ background-color:#f5f5f5;}

.news_area .icon{
	width:72px;
	height:17px;
	display:block;
	float:left;
}

.news_area .icon img{
	vertical-align:middle;}

.news_area  dd .text{
	width:490px;
	display:block;
	float:left;
	padding-left:15px;
}
.news_area  dd .text img{
	margin-left:5px;}
	
.news_area p.back_num{
	text-align:right;
	overflow:hidden; zoom:1;}
.news_area p.back_num a{
	padding:5px 10px 5px 28px;
	background:url(../img/index_icon_allow01.gif) no-repeat 10px center #be9f68;
	color:#FFF;
	display:block;
	float:right;
}

.address_area{ padding:15px 45px; border-top:1px solid #5dadb4; text-align:center;}
.address_area dl dt{ display:inline; font-weight:bold; color:#137475;}
.address_area dl dd{  display:inline; padding-left:15px;}

.access_btn{ padding-left:15px;}

.copylight{ text-align:center; background-color:#5dadb4; color:#FFF; padding:15px;}

.date{
	text-align:right; margin-bottom:15px; margin-top:30px;}

@media screen and (max-width: 811px){
	.news_area dd {
		flex-direction: column;
	}
	.news_area dd .text {
		padding-left: 0 !important;
		margin-top: 5px;
	}
}





/* トップページ最下のバナー */
.banner {
    width: 728px;
    margin: 0 auto;
}
.banner ul {
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
}
.banner ul li {
    width: 24%;
    text-align: center;
}

/* ------------------------------------------------------------------
 レスポンシブル対応
-------------------------------------------------------------------*/
#header #global_nav-sp{
	display: none;
}

@media screen and (max-width: 811px){
	*,
	*:before,
	*:after {
		box-sizing: inherit;
	}
	html {
		box-sizing: border-box;
	}
	body #wrapper {
		width: 100%;
	}
	#wrapper {
		background-color: #ffffff;
	}
	#header {
		position: unset;
		width: 100%;
		height: 105px;
		margin: 0;
		background: unset;
		border-bottom: 2px solid #137475;
	}
	#header #global_nav{
		display: none;
	}
	#header #global_nav-sp{
		display: block;
		width: 100%;
	}
	#header #global_nav-sp ul{
		height: 700px;
		width: 100%;
		display: flex;
		background-color: #137475;
		padding-top: 100px;
		align-items: center;
		flex-direction: column;
	}
	#header #global_nav-sp li{
		width: 100%;
		text-align: left;
		background-color: #137475;
	}
	#header #global_nav-sp a{
		color: #ffffff;
		text-decoration: none;
		font-size: 1.4rem;
	}
	#header #global_nav-sp a span{
		padding-left: 1.4rem;
	}
	/* #header #global_nav-sp ul li:nth-child(even){
		background-color: #5dadb4;
	} */
	#header #site_id {
		left: 18px;
		top: 16px;
	}
	#header #site_id img {
		transform: scale(1);
	}
	#header .text_size {
		width: 205px;
		left: 15px;
		top: 63px;
	}
	#main{
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}
	#main .mainvisual img{
		width: 100%;
		height: auto;
	}
	#contents{
		width: 100%;
		padding: 0 10px;
	}
	#footer{
		width: 100%;
	}
	#footer .foot_nav {
		display: none;
	}
	.banner{
		width: 100%;
	}
	.banner ul{
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		flex-wrap: wrap;
	}
	.banner ul li {
		width: 50%;
	}
	.banner ul li a img{
		width: 100%;
		height: auto;
	}
	.news_area p.back_num a{
		font-size: unset;
	}
	.news_area dt {
		width: unset;
		background-position-y: 30px;
		padding-top: 24px;
		padding-bottom: 0;
	}
	.news_area dd{
		padding: 4rem 10px 0 10px;
	}
	.news_area dd .text{
		width: fit-content;
		padding: 0 10px 10px 10px;
	}
	.news_area dd a{
		width: fit-content;
		white-space: break-spaces;
	}
	.text_size dt,
	.text_size dd{
		transform: scale(0.9);
	}
}
/* ------------------------------------------------------------------
 ハンバーガーメニュー（SP）
-------------------------------------------------------------------*/
@media screen and (max-width: 811px){
	.menu-btn {
		position: fixed;
		top: 20px;
		right: 20px;
		display: flex;
		height: 55px;
		width: 55px;
		justify-content: center;
		align-items: center;
		z-index: 90;
		background-color: #5dadb4;
	}
	.menu-btn span,
	.menu-btn span:before,
	.menu-btn span:after {
		content: '';
		display: block;
		height: 3px;
		width: 35px;
		border-radius: 3px;
		background-color: #ffffff;
		position: absolute;
	}
	.menu-btn span:before {
		bottom: 8px;
	}
	.menu-btn span:after {
		top: 8px;
	}
	
	#menu-btn-check:checked ~ .menu-btn span {
		background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
	}
	#menu-btn-check:checked ~ .menu-btn span::before {
		bottom: 0;
		transform: rotate(45deg);
	}
	#menu-btn-check:checked ~ .menu-btn span::after {
		top: 0;
		transform: rotate(-45deg);
	}
	#menu-btn-check {
		display: none;
	}
	#menu-btn-check:checked ~ .menu-content {
		left: 0;/*メニューを画面内へ*/
	}
	.menu-content {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 100%;/*leftの値を変更してメニューを画面外へ*/
		z-index: 80;
		background-color: #137475;
		transition: all 0.5s;/*アニメーション設定*/
		overflow-y: scroll;
	}
	.menu-content ul {
		padding: 70px 10px 0;
	}
	.menu-content ul li {
		border-bottom: solid 1px #ffffff;
		list-style: none;
	}
	.menu-content ul li a {
		display: block;
		width: 100%;
		font-size: 15px;
		box-sizing: border-box;
		color:#ffffff;
		text-decoration: none;
		padding: 9px 15px 10px 0;
		position: relative;
	}
	.menu-content ul li a::before {
		content: "";
		width: 7px;
		height: 7px;
		border-top: solid 2px #ffffff;
		border-right: solid 2px #ffffff;
		transform: rotate(45deg);
		position: absolute;
		right: 60px;
		top: 25px;
	}
}
