@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');

.pc,#gnavi,.fnavi,.totop{
	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{
	max-width: 100%;
	height: auto;
	border:0;
	border-style:none;
}

a{
	color: #3b5996;
	word-break: break-all !important;
}

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

html{
	height:100%;
}

body{
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 300;
	width:100%;
	height:100%;
	margin:0;
}

header ul {
	list-style:none;
}

{
	white-space: nowrap;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
}

#wrapper{
	display: block;
	width: 100%;
	margin: 0;
	float: left;
	clear: both;
}
header{
	display: block;
	position: absolute;
	width: 100%;
	height: 60px;
	background-color: #E3D1AB;
	margin: 0 auto !important;
	border-bottom: solid 4px #F4C70B;
	float: left;
	clear: both;
	z-index: 35;
}
#secondary main{
	display: block;
	position: relative;
	width: 100%;
	padding: 0 0 0 0;
	float: left;
	clear: both;
}
#toppage main{
	display: block;
	position: relative;
	width: 100%;
	padding: 0 0 0 0;
	margin-top: calc(80vh + 80px);
	float: left;
	clear: both;
}
main section{
	display: block;
	width: 100%;
	margin: 0 auto 0 auto !important;
	float: left;
	clear: both;
}
footer{
	display: block;
	width: 100%;
	background-color: #C4B896;
	padding: 0;
	float: left;
	clear: both;
}
.footer_info{
	display: block;
	width: 100%;
	background-color: #F4E6BE;
	padding: 25px 0;
	float: left;
	clear: both;
}

.footer_info p{
	text-align: center;
	font-size: 95%;
	line-height: 170%;
}

.footer_info p strong{
	font-size: 140%;
	line-height: 200%;
	font-weight: 400;
}

#logo a {
	display: block;
	width: 120px;
	height: auto !important;
	margin: 10px 0 0 10px;
}
#topimg{
	display: block;
	position: absolute;
	width: 100%;
	height: 80vh;
	min-height: 80%;
	margin: 0;
	top:60px !important;
}
#topimg .slides{
	display: block;
	width: 100%;
	height: 80vh;
	overflow: hidden;
}
#topimg .slides img{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: auto!important;
	min-width: 100% !important;
	height: 80vh !important; 
	object-fit: cover !important;
	object-position:center center !important;
	transform: translate(-45%,0);
	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
	z-index: 5 !important;
}
#topimg .copy{
	display: block;
	position: absolute;
	vertical-align: middle;
	z-index: 6;
	top:calc(50vh - 27%);
	left: calc(50% - 40%);
}
#topimg .copy img{
	display: block;
	width:90% !important;
	height: auto !important;
	animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}

.copyright{
	display: block;
	width: 100%;
	text-align: center;
	font-size: 70%;
	margin: 10px 0 70px 0;
	float: left;
	clear: both;
}

/* scroll */
.scroll a {
  display: none;
}

/* メディアファイルレイアウト */
.alignleft{
	float:left;
	max-width: 45%;
	height: auto;
	margin:0 20px 20px 0;
}

.alignright{
	float:right;
	max-width: 45%;
	height: auto;
	margin:0 0 20px 20px;
}

.aligncenter{
	display:block;
	max-width: 70%;
	height: auto;
	margin:0 auto 20px auto;
	float:none;
	clear:both;
}

#hnavi{
	display: block;
	position: fixed !important;
	width: 100%;
	height: 55px;
	bottom:0 !important;
	left: 0;
	z-index: 30;
	background-color: #fff;
	border-top: solid 1px #ccc;
	filter: drop-shadow(0 15px 20px rgba(0,0,0,0.35));
}

.hnavi01{
	display: none;
}
.hnavi02 a{
	display: block;
	width: 60%;
	margin: 13px 20% 0 20%;
}

#toppage  article{
	display:block;
	width:80%;
	min-height:300px;
	margin:0 10% 50px 10%;
	float:left;
	clear: both;
}

#secondary article{
	display:block;
	width:90%;
	min-height:300px;
	margin:20px 5%;
	float:left;
	clear: both;
}
#secondary article p{
	font-size: 90%;
	line-height: 150%;
	margin-bottom: 20px;
}


#toppage .subtitle_info{
	display: flex;
	width: 100%;
	text-align: center;
	align-items: center; /* 垂直中心 */
	justify-content: center; /* 水平中心 */
	font-size: 22px;
	margin: 30px 0 45px 0;
}
#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: 1em; /* 文字の右隣 */
}
.subtitle_info:after {
  margin-left: 1em; /* 文字の左隣 */
}

.to_news_list{
	text-align: center;
	list-style: none !important;
}
.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: 100%;
	margin: 0 0 0 0;
	float: left;
	clear: both;
}
.topics .block{
	display: block;
	width: 100%;
	margin: 0 0 20px 0;
	float: left;
}
.topics .block .thumbnail{
	width: 100%;
	height: 220px;
	margin-bottom: 10px;
}
.topics .block img{
	width: 100%;
	height: 220px;
	object-fit: cover; 
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
}
.topics dt{
	display: block;
	width: 100%;
	font-weight: 500;
	text-align: left;
	margin-bottom: 5px;
	float: left;
}
.topics dd{
	display: block;
	width: 100%;
	text-align: justify;
	font-size: 95%;
	line-height: 150%;
	margin: 0 0 30px 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 0 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 0 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 0 0 0;
	background-color: #EAEAEB;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	float: right;
}

#title{
	display: block;
	width: 100%;
	height: 90px;
	text-align: center;
	background-color: #f5f5f5;
	margin: 60px 0 0 0;
	float: left;
	clear: both;
}
#title h2{
	font-size: 140%;
	line-height: 120%;
	font-weight: 300;
	color:#796A56;
	padding: 20px 0 0 0;
}
#title h2 span{
	display: block;
	width: 100%;
	font-size: 70%;
	font-weight: 600;
	color: #000;
	clear: both !important;
}

.map_area{
	display: block;
	width: 100%;
	margin-bottom: 60px;
	float: left;
	clear: both;
}
.map_area img{
	display: block;
	float: left;
}

.access_info{
	display: block;
	width: 100%;
	text-align: center;
	margin: 0 0 0 0;
	float: left;
}

.access_info p{
	display: block;
	font-size:18px;
	line-height: 150%;
	font-weight: 300;
	margin-bottom: 20px;
}
.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;
	width: calc(100% - 2px);
	font-size: 18px;
	line-height: 170%;
	font-weight: 400;
	letter-spacing: 1px;
	border: solid 2px #F5AC34;
	padding:  15px 0;
	margin: 20px 0 50px 0;
	float: left;
}

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

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

.form_area{
	display: table;
	width: 100%;
	max-width:100%;
	margin: 40px 0;
	clear: both;
}

.form_area th{
	display: block;
	width: 100%;
	max-width:100%;
	padding: 20px 0 0 0;
	text-align: left;
	clear: both;
}
.form_area td{
	display: block;
	width: 100%;
	max-width:100%;
	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: 90%;
	padding: 5%;
	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: 90%;
	padding: 5%;
	height: 200px;
	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: 12px;
	float: left;
	clear: both;
}


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

/* 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:90%;
	padding: 20px 5% 25px 5%;
	margin:50px 0 0 0;
	background-color: #f5f5f5;
	float:left;
	clear: both;
}
.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: 35px;
	margin-bottom: 10px;
	float: left;
	clear: both;
}
.list_contents p{
	clear: both !important;
	margin:0 !important;
}
.list_contents p strong a{
	display: inline;
	font-size: 120%;
	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: 110%;
	line-height: 140%;
	font-weight: 400;
	text-align: justify !important;
	padding: 0 0 4px 12px;
	margin-bottom: 30px;
	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{
	margin-bottom: 25px !important;
	text-align: justify;
}

.outline{
	display: table;
	width: 100%;
	font-size: 90%;
	line-height: 140%;
	margin-bottom: 30px;
	border-collapse: collapse;
	border: solid 1px #ccc;/*表全体を線で囲う*/
	background-color: #fff;
	float: left;
	clear: both;
}
.outline th{
	display: table-cell;
	width: 33% !important;
	font-weight: 500;
	padding: 1px 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: 110%;
	line-height: 170%;
	font-weight: 600;
	text-align: justify !important;
	border-bottom: double 4px #796A56;
	padding: 0 0 2px 0;
	margin: 20px 0 20px 0;
	float: left;
	clear: both;
}

.about_area_header{
	display: block;
	width: 100%;
	float: left;
	clear: both;
}
.shinnen{
	display: block;
	width: 100%;
	font-size:100% !important;
	line-height: 220% !important;
	text-align: center;
	letter-spacing: 1px;
	font-weight: 400;
	margin-bottom: 30px;
	float: left;
	clear: both;
}
.gaikan{
	display: block;
	width: 100% !important;
	height: auto;
	margin-bottom: 30px;
	float: left;
}

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