@charset "UTF-8";
/* CSS Document */

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

.sp,.spnavi{
	display: none !important;
}
/*アニメーション要素のスタイル*/
.fade{
	opacity : 0;
	visibility: hidden;
	transition: 1.4s;
	transform: translateY(40px);
}
/*アニメーション要素までスクロールした時のスタイル*/
.active{
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

*{
	margin:0;
	padding:0;
}

img{
	border:0;
	border-style:none;
}

a img {
	border:0;
    border-style:none;
}

body{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	display: block;
	width: 100%;
	min-width: 1150px;
}

#logo a,.totop a{
	white-space: nowrap;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
}

h1,h2,h3,h4,p,dl,dt,dd,ul,li{
	margin:0;
	list-style:none;
}

/* レイアウト */
#wrapper{
	display:block;
	width:100%;
	margin:0 auto;
	float:left;
	clear:both;
}

header{
	display:block;
	position:relative;
	width:100%;
	height:160px;
	background-image: url("../images/header_bg.png");
	background-position: bottom left;
	background-repeat: repeat-x;
	background-color: #E3D1AB;
	margin:0;
	float:left;
	clear:both;
	z-index: 10;
}

footer{
	display:block;
	width:100%;
	height:auto;
	text-align: center;
	background-color: #C4B896;
	padding: 50px 0;
	margin:0;
	float:left;
	clear:both;
}

main{
	display: block;
	width: 100%;
	float: left;
	clear: both;
}

#toppage main{
	display: block;
	position: relative;
	width: 100%;
	min-height: 300px;
	padding: 0 0 0 0;
	margin-top: calc(100vh - 160px) !important; 
	float: left;
	clear: both;
}

section{
	display: block;
	width: 100%;
	margin:0;
	float:left;
	clear:both;
}

.topics_area section{
	display: block;
	width: 1100px;
	margin: 0 auto;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: hidden;
	float:none;
	clear: both;
}

#toppage  article{
	display:block;
	width:1100px;
	min-height:300px;
	margin:50px auto;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: hidden;
	float:none;
	clear: both;
}

#secondary  article{
	display:block;
	width:1000px;
	min-height:300px;
	margin:50px auto;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: hidden;
	float:none;
	clear: both;
}

.topics_area article{
	display: block;
	width: 780px !important;
	padding: 0 20px 0 0 !important;
	margin: 50px 0 100px 0 !important;
	border-right: solid 1px #ccc;
	float:left !important;
	clear: none !important;
}

#logo a{
	display:block;
	width:176px;
	height:65px;
	margin:20px 0 0 40px;
	float:left;
}

.copyright{
	height: auto;
	padding: 0 0;
	font-size:12px;
	color: #000;
}

#topimg{
	display: block;
	position: absolute;
	min-width: 100%;
	width: 100% !important;
	height: 100vh !important; 
	overflow: hidden !important;
	top: 0;
	left: 0;
	right: 0;
	border: 0;
	overflow: hidden;
	overflow-x: hidden;
	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
	z-index: 3;
}
#topimg img{
	display: block;
	position: absolute;
	width: auto!important;
	min-width: 100% !important;
	height: 100vh !important; 
	object-fit: cover !important;
	object-position:center center !important;
	z-index: 3;
}

#topimg .copy{
	display: block;
	position: absolute;
	vertical-align: middle;
	z-index: 6;
	top:calc(50vh - 120px);
	left: calc(50% - 400px);
}
#topimg .copy img{
	display: block;
	width:800px !important;
	height: auto !important;
	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}

/* scroll */
.scroll a {
  display: inline-block;
  position: absolute;
  color: #fff;
  font-size:12px;
  font-weight: 600;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
  text-decoration: none;
  z-index: 4 !important;
}
.scroll a {
  padding-top: 50px;
  margin-left: -15px;
}
.scroll a span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 20px;
  height: 40px;
  margin-left: -10px;
  border: 1px solid #000;
  border-radius: 50px;
  box-sizing: border-box;
  background-image: url("../images/mouse_bg.png");
}
.scroll a span::before {
  position: absolute;
  top: 6px;
  left: 50%;
  content: '';
  width: 6px;
  height: 6px;
  margin-left: -3px;
  background-color: #000;
  border-radius: 100%;
  -webkit-animation: sdb 2s infinite;
  animation: sdb 2s infinite;
  box-sizing: border-box;
}
@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    -webkit-transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  80% {
    transform: translate(0, 20px);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

#gnavi{
	display: block;
	position: absolute;
	width: 100% !important;
	height: 55px;
	text-align: center !important;
	top:110px;
	float: left;
}
#gnavi li{
	display: inline;
}
#gnavi li a{
	display: inline-block;
	height: 35px;
	color: #000;
	font-weight: 300;
	text-decoration: none;
	font-size: 17px;
	line-height: 130%;
	text-align: center !important;
	border-right: solid 1px #ccc;
	padding: 0 35px 0 65px !important;
	background-repeat: no-repeat;
	background-size: auto 27px;
	transition-duration: 0.3s;
}
#gnavi li a:hover{
	color: #FF9900;
	transition-duration: 0.1s;
}
.gnavi01 a{
	border-left: solid 1px #ccc;
	background-image: url("../images/gnavi01.svg");
	background-position: 35px 4px;
}
.gnavi02 a{
	background-image: url("../images/gnavi02.svg");
	background-position: 27px 4px;
}
.gnavi03 a{
	background-image: url("../images/gnavi03.svg");
	background-position: 27px 4px;
}
.gnavi04 a{
	background-image: url("../images/gnavi04.svg");
	background-position: 27px 4px;
}
#gnavi li span{
	display: block;
	text-align: center;
	font-size: 10px;
	line-height: 160%;
	font-weight: 600;
	color: #978578;
	clear: both;
}

#hnavi{
	display: block;
	position: absolute;
	width: 620px;
	float: right !important;
	top:18px;
	right: 30px;
}
#hnavi li{
	display: inline;
	float: left;
	clear: none !important;
}

.hnavi01{
	display: block;
	font-size: 15px;
	line-height: 140%;
	float: left;
}
.hnavi02{
	display: block;
	width: 273px;
	margin: 3px 0 0 0;
	float: right !important;
}
.hnavi02 a{
	pointer-events: none !important;
}

#toppage .subtitle_info{
	display: flex;
	width: 1050px;
	text-align: center;
	align-items: center; /* 垂直中心 */
	justify-content: center; /* 水平中心 */
	font-size: 22px;
	margin: 50px 0 70px 25px;
}
#toppage .subtitle_info strong{
	font-weight: 300;
	white-space: nowrap;
}

.subtitle_info:before, .subtitle_info:after {
  border-top: solid 1px #999;
  content: "";
  width: 100%; /* 線の長さ */
}
.subtitle_info:before {
  margin-right: 2em; /* 文字の右隣 */
}
.subtitle_info:after {
  margin-left: 2em; /* 文字の左隣 */
}

.to_news_list{
	text-align: center;
}
.to_news_list li a{
	display: inline-block;
	color: #000;
	text-decoration: none;
	font-size: 13px;
	padding: 3px 30px 5px 30px;
	border: solid 1px #999;
	margin: 50px auto !important;
	background-image: url("../images/top_tri.png");
	background-repeat: no-repeat;
	background-position: center right;
	background-size: auto 85%;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: none;
	transition-duration: 0.4s;
}
.to_news_list li a:hover{
	background-color: #BA9676;
	color: #fff;
	transition-duration: 0.2s;
}
.topics{
	display: block;
	width: 1074px;
	text-align: center;
	overflow: auto;
	overflow-x: hidden;
	overflow-y: hidden;
	margin: 0 0 0 13px;
	float: left;
	clear: both;
}
.topics .block{
	display: inline-block;
	width: 330px;
	margin: 0 14px;
	float: left;
}
.topics .block .thumbnail{
	width: 330px;
	height: 186px;
	margin-bottom: 10px;
}
.topics .block img{
	width: 330px;
	height: 186px;
	object-fit: cover; 
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.topics dt{
	display: block;
	width: 330px;
	font-weight: 500;
	text-align: left;
	margin-bottom: 10px;
	float: left;
}
.topics dd{
	display: block;
	width: 330px;
	text-align: justify;
	font-size: 15px;
	line-height: 160%;
	margin: 0 0 20px 0;
	text-align: left;
	float: left;
}
.topics dd a{
	color: #000;
}
.topics dd a:hover{
	text-decoration: none;
}

.topics dt .category2{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 60px 0 0;
	background-color: #D6DB00;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}
.topics dt .category3{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 60px 0 0;
	background-color: #FFCC56;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}
.topics dt .category4{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 60px 0 0;
	background-color: #EAEAEB;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}

.fnavi{
	display: block;
	width: 100%;
	text-align: center;
	margin: 0 0 50px 0;
	float: left;
	clear: both;
}
.fnavi li{
	display: inline;
	font-size: 14px;
	line-height: 100%;
	padding: 0 20px 2px 20px;
	border-right: solid 1px #000;
}
.fnavi li:nth-child(1){
	border-left: solid 1px #000;
}
.fnavi li a{
	color: #000;
}
.fnavi li a:hover{
	text-decoration: none;
}

#title{
	display: block;
	width: 100%;
	height: 160px;
	text-align: center;
	background-color: #f5f5f5;
	float: left;
	clear: both;
}
#title h2{
	font-size: 30px;
	line-height: 120%;
	font-weight: 300;
	color:#796A56;
	letter-spacing: 2px;
	padding: 40px 0 0 0;
}
#title h2 span{
	display: block;
	width: 100%;
	font-size: 18px;
	font-weight: 600;
	color: #000;
	letter-spacing: 0.5px;
	clear: both !important;
}
.map_area{
	display: block;
	width: 100%;
	margin-bottom: 60px;
	float: left;
	clear: both;
}
.map_area img{
	display: block;
	margin-right: 20px;
	float: right;
}

.access_info{
	display: block;
	width: 400px;
	margin: 20px 0 0 20px;
	float: left;
}

.access_info p{
	display: block;
	font-size:18px;
	line-height: 150%;
	font-weight: 300;
	margin-bottom: 15px;
}
.access_info p strong{
	display: block;
	font-size:22px;
	font-weight: 400;
	margin-bottom: 15px;
}
.access_info ul li{
	display: block;
	font-size:29px;
	font-weight: 500;
}
.access_info ul span{
	font-weight: 500;
	color: #F5AC34;
}
.access_info .text{
	display: inline-block;
	font-size: 18px;
	line-height: 170%;
	font-weight: 400;
	letter-spacing: 1px;
	border: solid 2px #F5AC34;
	padding:  15px 20px;
	margin: 20px 0 0 0;
	float: left;
}

.text_right{
	display: block;
	width: 100%;
	font-size: 13px !important;
	text-align: right !important;
	margin-bottom: 30px;
}

.privacy_area h3{
	display: block;
	width: 100%;
	font-size: 18px;
	line-height: 170%;
	font-weight: 400;
	text-align: justify !important;
	padding: 0 0 2px 12px;
	margin-top: 40px;
	margin-bottom: 10px;
	border-left: solid 8px #F5AC34;
	float: left;
	clear: both;
}
.privacy_area p{
	font-size: 15px;
	line-height: 170%;
	text-align: justify;
	margin-bottom: 25px;
}
.privacy_area ol{
	font-size: 15px;
	line-height: 170%;
	text-align: justify;
	padding-left: 20px;
	margin-top: 5px;
	margin-bottom: 25px;
}
.privacy_area ol li{
	list-style: decimal !important;
	margin-left: 20px;
}

.form_area{
	display: table;
	width: 850px;
	margin: 40px 0;
	clear: both;
}

.form_area th{
	display: table-cell;
	width: 200px;
	padding: 30px 0 20px 0;
	text-align: left;
}
.form_area td{
	display: table-cell;
	padding-bottom: 15px !important;
}
.form_area th .required{
	display: inline-block;
	text-align: center;
	color: #fff;
	font-size:10px;
	background-color: #D90000;
	padding: 1px 12px 2px 12px;
	margin: 0 0 2px 12px;
	vertical-align: bottom;
}

.form_area input{
	width: 530px;
	padding: 20px;
	font-size:15px;
	line-height: 150%;
	margin: 10px 0 5px 0;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border: solid 1px #ccc;
	background-color: #FBFDFF;
}

.form_area textarea{
	width: 530px;
	height: 200px;
	padding: 20px;
	font-size:15px;
	line-height: 150%;
	margin: 10px 0 25px 0;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border: solid 1px #ccc;
	background-color: #FBFDFF;
}
input::-webkit-input-placeholder{
    color: #999;
}
input::-moz-placeholder{
    color: #999;
}
input:-moz-placeholder{
    color: #999;
}
input::placeholder {
  color: #999 !important;
}
input:-ms-input-placeholder {
  color: #999 !important;
}
input::-ms-input-placeholder {
  color: #999 !important;
}

.agreement{
	display: block;
	font-size: 13px;
	float: left;
	clear: both;
}

.wpcf7 input[type="submit"] {
	display: block;
	width: 200px;
	font-size: 20px;
	padding: 10px 0;
	margin: 15px auto 0 auto;
	background-color: #F5AC34;
	color: #fff;
	cursor: pointer;
	border-style: none;
}
.wpcf7 input[type="submit"]:active{
	background-color: #FFD413;
}

.outline{
	display: table;
	width: 100%;
	font-size: 16px;
	line-height: 160%;
	margin-bottom: 40px;
	border-collapse: collapse;
	border: solid 1px #ccc;/*表全体を線で囲う*/
	background-color: #fff;
	float: left;
	clear: both;
}
.outline th{
	display: table-cell;
	width: 110px !important;
	font-weight: 500;
	padding: 15px 5px;
	margin: 0;
	border: solid 1px #ccc !important;
	background-color: #F2F2F2;
}
.outline td{
	display: table-cell;
	padding: 15px 20px;
	margin: 0;
	border: solid 1px #ccc !important;
}

.about_area h3{
	display: block;
	width: 100%;
	color: #796A56;
	font-size: 22px;
	line-height: 170%;
	font-weight: 600;
	text-align: justify !important;
	border-bottom: double 4px #796A56;
	padding: 0 0 2px 0;
	margin: 40px 0 40px 0;
	float: left;
	clear: both;
}

.about_area_header{
	display: block;
	width: 100%;
	float: left;
	clear: both;
}
.shinnen{
	display: block;
	width: 500px;
	font-size:20px;
	line-height: 190%;
	letter-spacing: 2px;
	font-weight: 400;
	padding: 80px 0 0 0;
	margin-bottom: 30px;
	float: right;
}
.gaikan{
	display: block;
	width: 400px !important;
	height: auto;
	margin-bottom: 30px;
	float: left;
}

.text_block p{
	font-size:15px;
	margin-bottom: 30px;
}
.text_block h4{
	font-size:18px;
	line-height: 180%;
	font-weight: 400;
	margin-bottom: 5px;
	color: #000;
}
.text_block strong{
	display: inline-block;
	font-size: 14px !important;
	line-height: 180%;
	font-weight: 400;
	margin: 0 0 4px 0;
}

/* メディアファイルレイアウト */
.alignleft,.alignnone{
	display: inline;
	float:left !important;
	margin:0 20px 20px 0;
}

.alignright{
	display: inline;
	float:right !important; 
	margin:0 0 20px 20px;
}

.aligncenter{
	display:block;
	margin:0 auto 20px auto;
	float:none;
	clear:both;
}

/* pager */
.pager{
	display:block;
	width:100%;
	height:100px;
	text-align:center;
	font-size:14px;
	margin:30px 0 0 0;
	float:left;
	clear:both;
}

a.page-numbers,
.pager .current{
	color: #888;
	text-decoration: none;
	border:solid 1px #888;
	padding:0px 6px 3px 6px;
	margin:0 1px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.pager .current{
	border:solid 1px #888;
	background:#888;
	color:#fff;
}


aside{
	display:block;
	width:270px;
	min-height:300px;
	margin:50px 0 50px 0;
	float:right;
	clear: none;
}
.program-widget-title{
	display: block;
	width: 100%;
	text-align: center;
	background-color: #C4B896;
	color: #fff;font-weight: 500;
	font-size: 16px;
	padding: 3px 0 5px 0;
	margin: 0 0 10px 0;
	float: left;
	clear: both;
}
aside ul{
	display: block;
	list-style: none;
	width: 100%;
	font-size: 15px;
	line-height: 150%;
	margin-bottom: 15px;
	float: left;
	clear: both;
}
aside ul a{
	color:#000;
}
aside ul a:hover{
	text-decoration: none;
}
aside ul li{
	display: block;
	padding-left: 30px;
	background-image: url("../images/tri.png");
	background-repeat: no-repeat;
	background-position: 7px 3px;
	background-size: auto 18px;
	float: left;
	clear: both;
}
aside ul li a{
	display: block;
	margin-bottom: 10px;
	float: left;
	clear: both;
}

.list_contents{
	display: block;
	width: 100%;
	border-bottom: solid 1px #CCC;
	padding-bottom: 25px;
	margin-bottom: 20px;
	float: left;
	clear: both;
}
.list_contents p{
	clear: both !important;
	margin-bottom: 8px !important;
}
.list_contents p strong a{
	display: inline;
	font-size: 18px;
	line-height: 150% !important;
	font-weight: 400;
	color: #A78866;
	float: left;
	clear: both;
}
.list_contents p strong a:hover{
	text-decoration: none;
	color: #E8CA76;
}

.list_contents .category2{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 0 0 0;
	background-color: #D6DB00;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}
.list_contents .category3{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 0 0 0;
	background-color: #FFCC56;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}
.list_contents .category4{
	display: inline-block;
	width: 130px;
	font-size: 10px !important;
	line-height: 10px !important;
	text-align: center;
	padding: 4px 0 !important;
	margin: 4px 0 0 0;
	background-color: #EAEAEB;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}

.topics_title{
	display: block;
	width: calc(100% - 20px);
	font-size: 18px;
	line-height: 170%;
	font-weight: 400;
	text-align: justify !important;
	padding: 0 0 2px 12px;
	margin-top: 40px;
	margin-bottom: 50px;
	border-left: solid 8px #F5AC34;
	border-bottom: solid 1px #ccc;
	float: left;
	clear: both;
}

.list_contents img{
	max-width: 100%;
	height: auto;
}

.list_contents p{
	font-size: 16px;
	line-height: 180%;
	margin-bottom: 25px !important;
	text-align: justify;
}