/* IMPORT RESET */
@import url("reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("responsive.gs.12col.css");

/* RESET */
* {
	margin: 0;
	padding: 0;
}
*::after,
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	font-family: 'Lato', "Yu Gothic", 'YuGothic', "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", 'Meiryo', sans-serif;
	background: #ffffff;
	font-size : 90%;
}

strong{
	font-weight : bold;
}

img{
	max-width : 100%;
}
.mb10 {
	margin-bottom: 10px !important;
}
.mb30 {
	margin-bottom: 30px !important;
}
.mb50 {
	margin-bottom: 50px !important;
}
.mt_30 {
	margin-top: -30px !important;
}
.text-center {
	text-align: center !important;
}
.text-start {
	text-align: left !important;
}
.text-end {
	text-align: right imo !important;
}
.bold {
	font-weight: bold;
}
img.photo{
	border : 3px solid #fff;
	box-shadow: 0px 0px 3px 0px #000;
	-webkit-box-shadow: 0px 0px 3px 0px #000;
	-moz-box-shadow: 0px 0px 3px 0px #000;
}

span.date{
	color : #0b8793;
	font-weight:bold;
}

article,aside {
	margin: 25px auto;
	text-align: center;
	line-height: 1.9;
}
article p,aside p {
	margin-bottom: 1em;
}

div.container article h2{
	position:relative;
	text-align : center;
	padding:9px;
	padding-left:0px;
	font-weight: bold;
	font-size: 22px;
	margin-bottom : 25px;
	color : #d8b23a;
}

div.container article h2:after{
	content:'';
	height:3px;
	width: 20%;
	display:block;
	position:absolute;
	top:100%;
	left:40%;
	background-color:#d8b23a;
}

div.container article h2:before{
	content:'';
	height:3px;
	width: 80%;
	display:block;
	position:absolute;
	top:100%;
	left:10%;
	background-color:#81d8d0;
}

div.container article h3{
	color:#0b8793;
	background:transparent;
	border-left:15px solid #0b8793;
	margin-top:15px;
	margin-bottom:15px;
	padding:5px 10px;
	font-size:120%;
}

div.container aside h2.title{
	background-color:#0d6fb8;
	border-left : 15px solid #F39800;
	color : #ffffff;
	margin-top : 5px;
	margin-bottom:15px;
	padding:10px;
	font-size:120%;
}

a {
	color: #0b8793;
	transition: 1s;
}

body#index #main-visual,body#index #sub-visual {
	background-position: center center\9; /* IE10以下 */
}

#top_about_ht{
	padding : 15px;
}

#top_about_ht p{
	text-align : center;
}

#top_about_ht p.name{
	font-size: 28px;
	font-weight: bold;
	font-family: serif;
	text-align : right;
}

#top_about_ht span.strong01{
	font-weight:bold;
	font-size:160%;
}

table{
	border : 1px solid #333;
	border-radius:10em;
	width:100%;
}

table tr{
	border-bottom : 1px solid #333;
}

table th{
	padding-left:10px;
	background : #0d6fb8;
	color : #ffffff;
}

table td{
	padding-left:10px;
	padding-right:10px;
}

.map {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.map iframe,
.map object,
.map embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

footer {
	width:100%;
	background-image: url("data:image/svg+xml,<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='40' height='40' patternTransform='scale(2) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='%2357b7aeff'/><path d='M23.222 25.097l-3.266-2.056-3.219 2.058.983-3.847-3.042-2.503 3.936-.18 1.52-3.668 1.342 3.578 3.846.312-2.996 2.505z'  stroke-width='1' stroke='none' fill='%2381d8d0ff'/><path d='M.133-5.1l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848L-.043 3.04l3.264 2.057-.895-3.803L5.322-1.21l-3.845-.312L.133-5.1zm40 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.059 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312L40.133-5.1zm-40 40l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.059 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312L.133 34.9zm40 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.059 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312-1.344-3.579z'  stroke-width='1' stroke='none' fill='%2382d9d0ff'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(%23a)'/></svg>");
	box-shadow: 0px 1px 5px 1px rgba(93,81,65,0.4);
	margin-top : 15px;
	padding: 30px;
	color : #fff;
	text-align: center;
}
footer a {
	color: #d8b23a;
	text-decoration: none;

}

footer p{
	line-height:1.5em;
	text-align:center;
	margin-bottom:15px;
}
.pagetop a {
	display: block;
	background : #fff;
	padding : 10px;
	border-radius : 10px;
	text-align: center;
	margin-bottom: 20px;
}
.pagetop a:hover {
	background-color: #d8b23a;
	color:#fff;
}
p.copyright{
	border-top : 1px solid #fff;
	padding : 15px;
	font-size : 80%;
}

footer ul#so-menu{
	text-align:center;
	margin-bottom:15px;
}

footer ul#so-menu li{
	margin : 0px 5px;
	display:inline;
}

footer ul#so-menu li span{
	display:none;
	/display:inline;/* IE6,IE7 */
	_display:inline;/* IE6以下 */
}

/* 基本レイアウト */

.inner {
	width: 960px;
	margin: 0 auto;
}
.inner:after {
	content: "";
	clear: both;
	display: block;
}

	div#telno{
		position : absolute;
		right : 0px;
	}

	#global-nav ul li a{
		position : absolute\9;
		display : block\9;
		text-indent : -9999px\9;
		overflow : hidden\9;
		height : 85px\9;
	}

	#global-nav ul li a#home {
		left : 0px\9;
		width : 100px\9;
		background : url(../img/common/gnav.png) no-repeat 0px 0px\9;
	}

	#global-nav ul li a#greeting {
		left : 100px\9\9;
		width : 140px\9\9;
		background : url(../img/common/gnav.png) no-repeat -100px 0px\9;
	}

	#global-nav ul li a#about {
		left : 240px\9;
		width : 240px\9;
		background : url(../img/common/gnav.png) no-repeat -240px 0px\9;
	}
	#global-nav ul li a#program {
		left : 480px;
		width : 180px;
		background : url(../img/common/gnav.png) no-repeat -480px 0px\9;
	}
	#global-nav ul li a#access {
		left : 660px\9;
		width : 160px\9;
		background : url(../img/common/gnav.png) no-repeat -660px 0px\9;
	}
	#global-nav ul li a#contact {
		left : 820px\9;
		width : 140px\9;
		background : url(../img/common/gnav.png) no-repeat -820px 0px\9;
	}
	body#index #main-visual {
		margin-top : 0px\9;
		margin-left : auto\9;
		margin-right : auto\9;
		height : 430px\9;
		max-width : 960px\9;
		background-image : url(../img/toppage/bg_topimage2.jpg)\9;
		background-size : cover\9;
		background-position: center center\9; /* IE10以下 */
	}

	body#index #sub-visual {
		margin-top : 0px\9;
		margin-left : auto\9;
		margin-right : auto\9;
		height : 200px\9;
		max-width : 960px\9;
		background-image : url(../img/toppage/bg_topimage.jpg)\9;
		background-size : cover\9;
		background-position: center center\9; /* IE10以下 */
	}

	body#index .main-visual_wrap {
		margin-top : 180px\9;
		padding-top : 10px\9;
		padding-bottom : 10px\9;
		margin-left : auto\9;
		margin-right : auto\9;
		width : 100%\9;
		background-image : url(../img/common/bg_visual.jpg)\9;
		background-position: center center\9; /* IE10以下 */
	}

	#global-nav ul li a:hover{
		opacity: 0.7;
		filter: alpha(opacity=40);
		-ms-filter: "alpha(opacity=40)";
	}

/* header */
#top-head {
	font-size: 14px;
	top: -100px;
	position: absolute;
	width: 100%;
	margin: 100px auto 0;
	padding: 30px 0 0;
	line-height: 1;
	z-index: 999;
}
#top-head a,
#top-head {
	color: #fff;
	text-decoration: none;
}
#top-head .inner {
	position: relative;
}
#top-head .logo {
	float: left;
	font-size: 14px;
}
#global-nav ul {
	list-style: none;
	position: absolute;
	left: 0;
	padding : 0px 0px;
	top:  40px;
	font-size: 14px;
}
#global-nav ul li {
	float: left;
	height : 40px;
	position: relative;
}
#global-nav ul li a {
}

/* Btn Hover */
#global-nav ul li:after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	left:-30px;
	bottom: -30px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
}
#global-nav ul li:hover:after {
	background: #00aaaa;
	left:0px;
	bottom: -30px;
}


/* Fixed */
#top-head.fixed {
	margin-top: 0;
	top: 0;
	position: fixed;
	padding-top: 10px;
	height: 55px;
	background: #fff;
	background: rgba(255,255,255,1.0);

	transition: top 0.65s ease-in;
	-webkit-transition: top 0.65s ease-in;
	-moz-transition: top 0.65s ease-in;
}
#top-head.fixed .logo {
	font-size: 14px;
	color: #333;
}
#top-head.fixed #global-nav ul li a {
	color: #333;
	padding: 0 20px;
	border : none;
}

/* Fixed Btn Hover */
#top-head.fixed #global-nav ul li:after {
	bottom: -20px;
}
#top-head.fixed #global-nav ul li:hover:after {
	background: #0062B8;
	bottom: -20px;
}


/* Transition */
/*
#top-head,
#top-head .logo,
#global-nav ul li,
#global-nav ul li a {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
}
*/



/* Toggle Button */
#nav-toggle {
	display: none;
	position: absolute;
	right: 14px;
	top: 2px;
	width: 64px;
	height: 50px;
	cursor: pointer;
	padding : 10px;
	border : 1px solid #efefef;
	border-radius : 12px;
	z-index: 101;
}

#nav-toggle div {
	position: relative;
}

#nav-toggle div#menu {
	position: absolute;
	top : 32px;
	left : 0px;
	font-size : 12px;
	text-align : center;
	width : 100%;
	color : #ffffff;
}

#nav-toggle span {
	display: block;
	position: absolute;
	height: 4px;
	width: 70%;
	background: #fff;
	left: 15%;
	-webkit-transition: .35s ease-in-out;
	-moz-transition: .35s ease-in-out;
	transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
	top: 0;
}
#nav-toggle span:nth-child(2) {
	top: 8px;
}
#nav-toggle span:nth-child(3) {
	top: 16px;
}

@media screen and (min-width: 980px) {
	div#telno{
		position : absolute;
		right : 0px;
	}

	h1.logo{
		position : absolute;
		left : 0px;
		top : -10px;
		height : 55px;
		width : 470px;
		text-indent:-9999px;
		overflow : hidden;
		background : url(../img/common/gnavlogo.png) no-repeat 15px 0px;
	}

	h1.logo a{
		display : block;
		height : 55px;
		width : 470px;
	}

	#global-nav ul li a{
		position : absolute;
		display : block;
		text-indent : -9999px;
		overflow : hidden;
		height : 85px;
	}

	#global-nav ul li a#home {
		left : 0px;
		width : 100px;
		background : url(../img/common/gnav.png) no-repeat 0px 0px;
	}

	#global-nav ul li a#greeting {
		left : 100px;
		width : 140px;
		background : url(../img/common/gnav.png) no-repeat -100px 0px;
	}

	#global-nav ul li a#about {
		left : 240px;
		width : 240px;
		background : url(../img/common/gnav.png) no-repeat -240px 0px;
	}
	#global-nav ul li a#program {
		left : 480px;
		width : 180px;
		background : url(../img/common/gnav.png) no-repeat -480px 0px;
	}
	#global-nav ul li a#access {
		left : 660px;
		width : 160px;
		background : url(../img/common/gnav.png) no-repeat -660px 0px;
	}
	#global-nav ul li a#contact {
		left : 820px;
		width : 140px;
		background : url(../img/common/gnav.png) no-repeat -820px 0px;
	}
	body#index #main-visual {
		margin-left : auto;
		margin-right : auto;
		width : 960px;
		height : 427px;
		background : url(../img/toppage/bg_topimage2.jpg) no-repeat 0px 100%;
		background-position: center center\9; /* IE10以下 */
		border-radius : 0.5em;
	}

	body#index #sub-visual {
		margin-top : 0px;
		margin-left : auto;
		margin-right : auto;
		height : 200px;
		max-width : 960px;
		background-image : url(../img/toppage/bg_topimage.jpg);
		background-size : cover;
		background-position: center center\9; /* IE10以下 */
		border-radius : 0.5em;
	}

	body#index .main-visual_wrap{
		margin-top : 180px;
		padding-top : 10px;
		padding-bottom : 10px;
		width : 100%;
		background-image: url("data:image/svg+xml,<svg id='patternId' width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'><defs><pattern id='a' patternUnits='userSpaceOnUse' width='80' height='80' patternTransform='scale(2) rotate(0)'><rect x='0' y='0' width='100%' height='100%' fill='%2381d8d0ff'/><path d='M46.444 90.194l-6.532-4.112-6.438 4.116 1.966-7.694-6.084-5.006 7.872-.36 3.04-7.336 2.684 7.156 7.692.624-5.992 5.01zm0-80l-6.532-4.112-6.438 4.116 1.966-7.694-6.084-5.006 7.872-.36 3.04-7.336 2.684 7.156 7.692.624-5.992 5.01zm-40 40l-6.532-4.112-6.438 4.116 1.966-7.694-6.084-5.006 7.872-.36 3.04-7.336 2.684 7.156 7.692.624-5.992 5.01zm80 0l-6.532-4.112-6.438 4.116 1.966-7.694-6.084-5.006 7.872-.36 3.04-7.336 2.684 7.156 7.692.624-5.992 5.01z'  stroke-width='1' stroke='none' fill='%23ffffffff'/><path d='M60.133 54.9l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm-40 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm40-40l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm-40 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm20 20l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm40 40l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm-80 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm80-80l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803 2.996-2.504-3.845-.312zm-80 0l-1.52 3.668-3.935.18 3.043 2.504-.985 3.848 3.221-2.06 3.264 2.057-.895-3.803L5.322-1.21l-3.845-.312z'  stroke-width='1' stroke='none' fill='%23ffffffff'/></pattern></defs><rect width='800%' height='800%' transform='translate(0,0)' fill='url(%23a)'/></svg>");
		box-shadow: 0px 1px 5px 1px rgba(13,111,184,0.4);
	}

	div.bg_photo{
	background : url(../img/greeting/bg_photo03.jpg) right 0px no-repeat;
	}

	div.bg_photo02{
	background : url(../img/toppage/photo04.jpg) right 0px no-repeat;
	background-size:cover;
	min-height:490px;
	background-position-y:40px;
	}

	div.bg_photo03{
	background : url(../img/greeting/bg_photo04.jpg) 0px 0px no-repeat;
	}

	div.inner_footer{
		width : 960px;
		margin-right : auto;
		margin-left : auto;
	}
	div.inner_footer p.address{
		text-align : left;
	}

}
.topics ol {
	display: block;
	width: 743px;
	margin: 0 auto;
}
.topics li {
	border-bottom: dotted 1px #0D6FB8;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
.topics li time {
	margin-right: 2em;
}

.ryoiki {
	margin:0 auto 60px;
	max-width:780px;
}
.container article .ryoiki h3 {
	text-align:center;
	border:none;
	margin:0 0 20px;
	padding:5px;
	background:#5dc5bb;
	color:#fff;
	font-weight:bold;
	letter-spacing: .3em;
	border-radius:3px;
	font-size:1.3em;
}
.ryoiki ul.first {
	display:block;
	max-width:600px;
	margin:0 auto 20px;
	background:#bcfaf4;
	padding:15px 15px 15px 30px;
	list-style: circle;
	list-style-position: inline;
	font-weight:bold;
	border-radius:10px;
}
.ryoiki dl dt {
	background-color: #50a89f;
background-size: 8px 8px;
background-image: repeating-linear-gradient(45deg, #5dc5bb 0, #5dc5bb 0.8px, #50a89f 0, #50a89f 50%);
	color:#fff;
	padding:10px;
	font-weight:bold;
	font-size:1.1em;
	border-radius:5px 5px 0 0;
}
.ryoiki dl dd {
	border-right: solid 1px #50a89f;
	border-left: solid 1px #50a89f;
	border-bottom: solid 1px #50a89f;
	padding:15px;
	text-align:justify;
	line-height:1.5;
	margin-bottom:3px;
	border-radius:0 0 5px 5px;
}
.ryoiki ul.second {
	display:block;
	border:solid 10px #ffc64d;
	padding:20px 20px 20px 30px;
	list-style:square;
	list-style-position:inside;
	margin-top:1px;
	font-weight:bold;
}
.f_box {
	background-color: rgba(255,255,255,0.8);
	padding:40px 20px 30px;
	color:#3b7c76;
	border-radius: 5px;
}
.f_box a {
	display: block;
	text-align: center;
	padding:5px 0;
	background-color: #57B7AE;
	color:#fff;
}
.f_box span {
	font-size: 1.5em;
}
.f_box a:hover {
	background-color: #000;
}

@media screen and (max-width: 980px) {
	div.bg_photo{
	background : url(../img/greeting/bg_photo032.jpg) right 0px no-repeat;
	}
	div.bg_photo03{
	background : url(../img/greeting/bg_photo042.jpg) right 0px no-repeat;
	min-height:300px;
	}

	#top_about_ht p{
		text-align : left;
	}
	#top_about_ht p br{
		display : none;
	}
	article {
		padding: 0px 15px;
	}
	aside{
		padding: 0px 15px;
	}
	.inner {
		width: 100%;
		padding: 0 20px;
	}
	div#telno{
		position : absolute;
		right : 0px;
	}
	#main-visual{
		margin-top : 55px;
		margin-right : 0px;
		padding-top : 45%;
		height : auto;
		background : url(../img/toppage/bg_topimage2.jpg) no-repeat 0px 0px;
		background-size : cover;
		background-position: center center\9; /* IE10以下 */
	}

	#sub-visual{
		margin-top : 55px;
		padding-top : 25%;
		height : auto;
		background : url(../img/toppage/bg_topimage.jpg) no-repeat 0px 0px;
		background-size : cover;
		background-position: center center\9; /* IE10以下 */
	}

	div#telno{
		display : none;
	}

	#top-head,
	.inner {
		width: 100%;
		padding: 0;
	}
	#top-head {
		top: 0;
		position: fixed;
		margin-top: 0;
	}

	footer{
		padding : 10px 10px;
	}

	footer p.address{
		text-align : left;
	}

	footer p.copyright{
		text-align : center;
	}

	/* Fixed reset */
	#top-head.fixed {
		padding-top: 0;
		background: transparent;
	}


	#mobile-head {
		background: #0b8793;
		width: 100%;
		height: 56px;
		z-index: 999;
		position: relative;
	}
	#top-head.fixed .logo,
	#top-head .logo {
		position: absolute;
		left: 13px;
		top: 13px;
		color: #fff;
		font-size: 16px;
	}

	#global-nav {
		position: absolute;
		top: -500px;
		background: #0698a5;
		border : none;
		width: 100%;
		text-align: center;
		padding: 10px 0;
		-webkit-transition: .5s ease-in-out;
		-moz-transition: .5s ease-in-out;
		transition: .5s ease-in-out;
	}
	#global-nav ul {
		list-style: none;
		position: static;
		right: 0;
		bottom: 0;
		font-size: 11px;
	}
	#global-nav ul li {
		float: none;
		position: static;
		border : none;
	}
	#global-nav ul li:after  {
		display: none;
	}
	#top-head #global-nav ul li a,
	#top-head.fixed #global-nav ul li a {
		width: 100%;
		display: block;
		color: #fff;
		padding: 18px ;
		border-bottom:solid 1px #096c75;
	}
	#nav-toggle {
		display: block;
	}
	/* #nav-toggle */
	.open #nav-toggle span:nth-child(1) {
		top: 11px;
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		transform: rotate(135deg);
	}
	.open #nav-toggle span:nth-child(2) {
		width: 0;
		left: 50%;
	}
	.open #nav-toggle span:nth-child(3) {
		top: 11px;
		-webkit-transform: rotate(-315deg);
		-moz-transform: rotate(-315deg);
		transform: rotate(-315deg);
	}
	/* #global-nav */
	.open #global-nav {
		/* #global-nav top + #mobile-head height */
		-moz-transform: translateY(556px);
		-webkit-transform: translateY(556px);
		transform: translateY(556px);
	}


}

@media screen and (max-width: 600px) {
  table {
    border-top: 1px solid #333;
  }
  table td {
    display: block;
    text-align: left;
  }
  table th {
    display: block;
    border-top: none;
    border-bottom: none;
    width: 100%;
  }
  .topics ol {
  	width: 100%;
  }
}