@charset "utf-8";




/*********************
	h2
*********************/
h2{
	width:100%;
	max-width:767px;
	margin:0 auto 20px;
}
@media screen and (max-width: 767px){
	h2{
		
	}
}

/*********************
	.content_top
*********************/
.content_top{
	width:100%;
	margin:0 auto 70px;
}
.content_top .main_img{
	width:90%;
	max-width:670px;
	margin:0 auto 70px;
	border:6px solid #e0c99a;
	box-sizing:border-box;
}
.content_top h3{
	width:100%;
	margin:0 auto;
	font-size:3.2rem;
	font-weight:bold;
}
.content_top .info_box{
	width:100%;
	margin:0 auto 20px;
	display:flex;
	flex-wrap:wrap;
}
.content_top .info_box .info__item--cat{
	padding:5px 30px;
	background:#7e8ebf;
	border-radius:50vh;
	color:#fff;
	font-size:1.4rem;
}
.info__item {
	margin-top: 24px;
	padding: 5px 30px;
	display: block;
}
.info__item-pd {
	padding: 0;
}
.content_top .info_box .info__item--cat{
	padding:5px 30px;
	background:#7e8ebf;
	border-radius:50vh;
	color:#fff;
	font-size:1.4rem;
	margin-right: 20px;
}
.info__item--facebook {
  margin-right: 10px;
}
.info__item--twitter {
	width: 86px;
	height: 28px;
	background: #000;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: 0.3s;
}
.info__item--twitter:hover {
	opacity:0.7;
}
.info__item--twitter .fa{
	color: #ffffff;
}

@media screen and (max-width: 767px){
	.content_top{
		margin:0 auto 30px;
	}
	.content_top .main_img{
		max-width:690px;
		margin:0 auto 30px;
	}
	.content_top h3{
		font-size:2.2rem;
	}
	.feature_area .info_box{
		margin:0 auto 10px;
	}
	.feature_area .info_box .info__item--cat{
		padding:5px 20px;
		font-size:1.1rem;
		margin-right:10px;
	}
	.info__item {
		margin-top:10px;
	}
}

/*********************
	.news_area
*********************/

.news_area{
	width:100%;
	margin:0 auto 100px;
}

/*********************
	.tab_area
*********************/
.tab_area{
	width:100%;
	margin:0 auto;
	display:flex;
	
}
.tab_area li{
	max-width:240px;
	margin-right:1%;
	width:100%;

}


.tab_area li a{
	display:block;
	width:100%;
	color:#999;
	background-color:#dbdbdb;
	border-radius:20px 20px 0 0;
	text-align:center;
	padding:22px 0 20px;
	font-size:1.8rem;
	font-weight:bold;
}
.tab_area .current-cat a{
	background-color:#fff;
	background-image:url(../images/bg_common_top.png);
	background-repeat: no-repeat;
	background-size:520px;
	background-position:20% 0;
	color: #333;
}
@media screen and (max-width: 980px){
.tab_area li a{
		font-size:1.1rem;
	}
}
@media screen and (max-width: 767px){
	.tab_area{
		overflow-x:scroll;
		padding-top:5px;
	}
	.tab_area.fixed{
		position:fixed;
		top:100px;
		left:0;
		right:0;
		margin:0 auto;
		background:url(../images/bg_common_1.jpg);
		background-repeat:repeat;
		z-index:10;
	}
	
	.tab_area li a{
		min-width:110px;
		font-size:1.3rem;
		padding:12px 0 10px;
		margin-right:2%;
	}
	.tab_area li:first-child{
		margin-left:2%;
	}

	.tab_area .current-cat a{
		background-position:40% 0;
	}
	
}
/*********************
	.news_box
*********************/
.news_wrap{
	width:100%;
	margin:0 auto;
	padding: 20px 0 20px;
	box-sizing:border-box;
	background:#fff;
	border-radius:0 20px 20px 20px;
}
.news_box{
	display:none;
	width:90%;
	max-width:1000px;
	margin:0 auto;
}
.news_box.active{
	display:block;
}

.news_wrap .select_box{
	width:140px;
	border:#000 solid 1px;
	padding:5px 0;
	-webkit-appearance: auto;
	text-align: center;
	font-size:1.8rem;
}
@media screen and (max-width: 767px){
	.news_wrap .select_box{
		width:117px;
		font-size:1.3rem;
	}
}
/*********************
	.news_list
*********************/

.news_list {
	width: 100%;
	margin: 50px auto 100px;
	text-align: left;
	border-bottom:#d9d9d9 solid 1px;
}

.news_list .news_content {
	border-bottom: #d9d9d9 solid 1px;
}

.tab_area .active a {
	color: #333;
}

.tab_area li a {
	color: #999;
}

.news_list h4 {
	color: #7e8ebf;
	font-size:2.0rem;
	padding:7px 0;
	text-align: left;
	font-weight: bold;
	border-top: #d9d9d9 solid 1px;
	border-bottom: #d9d9d9 solid 1px;
}
.news_list h4.month{
	color: #000;
	font-size: 1.8rem;
	margin: 20px auto 0;
	padding:7px 0;
	text-align: left;
	font-weight: bold;
	border-top: none;
	border-bottom: #d9d9d9 solid 1px;
}
.news_list .news_wrap {
	border-radius:0;
}

.news_list .news_wrap:nth-child(odd) {
	background:  #ededed;
	border-top: #cacaca dotted 2px;
	border-bottom: #cacaca dotted 2px;
}

.news_wrap a{
	display: block;
	width:100%;
	margin:0 auto;
	padding:3px 0;
}
.news_wrap a:hover{
	color:#882111;
	transition:.3s;
}
.news_wrap dl{
	display:table;
	width:100%;
	margin:0 auto 0 10px;
}
.news_wrap dt{
	display:table-cell;
	width:240px;
	vertical-align:top;
	font-size:0;
}
.news_wrap dd{
	display:table-cell;
	width:calc(100% - 240px);
	vertical-align:top;
	font-size:1.6rem;
}
.news_wrap dt .date{
	display:inline-block;
	width:90px;
	font-size:1.6rem;
	font-weight:bold;
	margin-right:10px;
}

.news_wrap dt .label{
	display:inline-block;
	width:120px;
	padding:3px 0;
	border-radius:8px;
	font-size:1.4rem;
	color:#fff;
	text-align:center;
}

.news_wrap dt .label_inf{
	background:#ebc642;
}
.news_wrap dt .label_otr{
	background:#888;
}
.news_wrap dt .label_cpn{
	background:#f07065;
}
.news_wrap dt .label_pgm{
	background:#7d9c40;
}


@media screen and (max-width: 767px){
	.news_list h4 {
		font-size:1.4rem;
	}
	.news_list h4.month{
		font-size:1.4rem;
	}
	.news_wrap dt .date{
		font-size:1.3rem;
		width:90px;
	}
	.news_wrap dt .label{
		font-size:1.3rem;
		width:80px;
	}
	.news_wrap dl {
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		margin: 0 auto 0 10px;
	}
	.news_wrap dt {
		display: table-cell;
		width: 100%;
		vertical-align: top;
		font-size: 0;
	}
	.news_wrap dd {
		width: 100%;
		vertical-align: top;
		font-size:1.3rem;
	}
}
/*********************
	.news_detail
*********************/
.news_detail{
	width:100%;
	margin:0 auto;
	padding:40px 30px;
	box-sizing:border-box;
	background:#fff;
	border-radius:20px;
}
.news_area .info_area{
	display: flex;
	margin: 10px auto;
	justify-content: flex-end
}

.news_detail h4{
	width:100%;
	margin:0 auto 10px;
	font-weight: bold;
	font-size:2.4rem;
	padding: 10px 0;
	border-bottom: #000 solid 1px;
}
.news_detail .date{
	width:100%;
	font-size:1.8rem;
	margin:0 auto 10px;
	color:#707070;
}
.news_detail .label{
	display: inline-block;
	width: 120px;
	padding: 3px 0;
	border-radius: 8px;
	font-size: 1.4rem;
	color: #fff;
	text-align: center;
}
.news_detail .label_inf {
	background: #ebc642;
}
.news_detail .label_otr{
	background: #888;
}
.news_detail .label_cpn{
	background: #f07065;
}
.news_detail .label_pgm{
	background:#7d9c40;
}

.close_btn {
	width: 33%;
	margin: 100px auto 100px;

}
.close_btn a{
	display: block;
	width:100%;
	height: 48px;
	line-height: 48px;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;
	color: #fff;
	background: #333;
	border-radius: 50vh;
}
.close_btn a:hover{
	background:#882111;
	transition:.3s;
}
.news_detail dl{
	display:table;
	width:100%;
	margin: 20px auto 20px 10px;
}
.news_detail dt{
	display:table-cell;
	width:240px;
	vertical-align:top;
	font-size:0;
}
.news_detail dd{
	display:table-cell;
	width:calc(100% - 240px);
	vertical-align:top;
	font-size:1.6rem;
}
.news_detail .news_list {
	width: 100%;
	margin: 50px auto;
	text-align: left;
	border-bottom: #d9d9d9 dotted 2px;
}

.news_detail .news_list .date{
	display:inline-block;
	width:100px;
	font-size:1.6rem;
	font-weight:bold;
	margin-right:10px;
}

.news_detail .news_list .label{
	display:inline-block;
	width:120px;
	padding:3px 0;
	border-radius:8px;
	font-size:1.4rem;
	color:#fff;
	text-align:center;
}

.news_detail .news_list .label_inf{
	background:#ebc642;
}
.news_detail .news_list .label_otr{
	background:#888;
}
.news_detail .news_list .label_cpn{
	background:#f07065;
}

.news_detail .news_list .label_pgm{
	background:#7d9c40;
}

@media screen and (max-width: 767px){
	.news_detail{
		width:94%;
		padding:20px;
	}
	.news_detail h4{
		font-size:1.8rem;
	}
	.news_detail .date{
		font-size:1.4rem;
	}
	.news_detail dl {
		display: flex;
		flex-wrap: wrap;
		width: 100%; 
		padding: 0 0 0 10px;
		box-sizing: border-box;
		margin: auto;
	}
	.news_detail dt {
		display: table-cell;
		width: 100%;
		vertical-align: top;
		margin:5px auto;
		font-size: 0;
	}
	.news_detail dd {
		width: 100%;
		margin:10px auto;
		vertical-align: top;
		font-size: 1.6rem;
	}
	.news_detail .news_list {
		width: 100%;
		margin: 20px auto;
		text-align: left;
		border-bottom: #d9d9d9 dotted 2px;
	}
	.news_detail .news_list .date{
		font-size:1.3rem;
		width:90px;
		margin:0 10px 0 0;
	}
	.news_detail  .label{
		font-size:1.3rem;
		width:80px;
		margin:0;
	}
	.news_detail .news_text{
		width: 90%;
		margin: 20px auto 0;
		font-size:1.3rem;
	}
	.news_detail dt{
		margin:0 auto;
	}
	.news_detail dd{
		font-size:1.3rem;
	}
	.news_detail .news_text iframe{
		width:100%;
		max-width: 350px !important;
	}
	.close_btn{
		width:75%;
		margin: 20px auto;
	}
	.close_btn a{
		display: block;
		width: 100%;
		height: 48px;
		line-height: 48px;
		font-size: 1.4rem;
		font-weight: bold;
		text-align: center;
		background: #333;
		border-radius: 50vh;
	}

}

