@charset "UTF-8";

.fadein {
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

.gaiyo{
	border:1px solid #a371a6;
	background-color: #FFF;
	color: #333;
}
.gaiyo a{color: #333;}

.headline{
	background-color:#caa6cc;
	width:100%;
	color:#FFF;
	font-size:12px;
}
.headline_content{
	margin: 0 auto;
	width: 100%;
	max-width:980px;
	text-align:left;
}
.clearfix:after{
	content: "";
	clear: both;
	display: block;
}
.cover_area{
	width: 100%;
	padding: 0;
	background-image:url(../img/dot_bg.png);
}
.cover_area img{margin: 0 auto;}
.main-nav{margin-bottom: 40px;}

section {margin-bottom: 40px;}
#first h1{text-align: center;}
#first h2{text-align: center;}
#first article{padding-top: 10px;}
#first .top_btn{
	margin-top: 20px !important;
	margin-bottom: 20px !important;
}

#policy{text-align: left;}
#policy h2, #kodawari h2{
	color: #FFF;
	border: none;
	background-color: #ffa500;
	font-size: 1.2em;
	text-align: center;
}
#policy h3{
	width: 46%;
	border-left: none;
}
#policy article{margin-bottom: 20px;}

.point p{
	position: relative;
	color: #FFF;
	background-color: #f60;
	width: 100px;
	text-align: center;
	padding: 8px 0;
	font-weight: bold;
	border-radius: 15px;
	margin: 0 auto;
	font-family: Helvetica, Arial, sans-serif;
	letter-spacing: 0.1em;
	line-height: 1;
	z-index: 3;
}
.point{position: relative;margin-bottom: 15px;}
.point:after{
	content: "";
	position: absolute;
	top: 15px;
	left: 0;
	display: block;
	height: 1px;
	background-color: #f60;
	width: 100%;
}

#group h2{text-align: center;}
.side_head{
	background-color:#a371a6;
	color:#FFF;
	line-height:30px;
	font-size:14px;
	text-align: center;
}
.side_contents{padding:10px; font-size:14px;text-align: center;}
.side_contents div{margin:10px 0px; background-color: #f9e1fa;}
.side_contents a{color: #a371a6;}
.bnr_area{text-align: center; margin-top: 20px;}
.bnr_area article{margin: 20px 0 0 0;}
.bnr_area ul li{margin: 0;}
.bnr_area ul li:first-child{margin-top: 10px;}
.sidebar-cliniclist{
	border: 1px solid #ddd;
	background-color: #f5f5f5;
	padding: 1em 1em 0 1em;
}
.sidebar-cliniclist li{
	padding:15px 0;
	line-height: 20px;
	font-size: 13px;
	border-bottom: 1px solid #ddd;
}
.sidebar-cliniclist li:first-child{padding-top: 0;}
.sidebar-cliniclist li:last-child{border-bottom: none;}
.sidebar-cliniclist a{
	color: #333;	
}
.sidebar-shisetsulist{
	border: 1px solid #ddd;
	padding: 0 1em 0 1em;
}

.sidebar-shisetsulist li:first-child{
	border-bottom: 1px #ddd dashed;
}


footer {
	background: none;
	background-color:#e4f3f5;
}
footer div{
	padding: 1em;
	display: flex;
	flex-direction: column;
	align-items: center;
}
footer p{
	width: 100%;
	text-align: center;
	color:#333;
	font-size: 0.8em;
}

@media screen and (max-width : 959px) {
	.gnav{margin-top:-10px; margin-bottom:-30px;}
	.cover_area img{width:640px; max-width:100%;}
	h1{margin-top: -40px; font-size: 1.6em;}
	.headline_content{text-align: center;}	
	#policy h3{
		width: 100%;
		padding: 10px 0 2px .75em;
	}
	#kodawari article{margin-bottom: 20px;}
	header{margin-bottom: 20px;}
	footer div{margin-bottom: 20px;}
	#first .top_btn{
		font-size: 1em;
	}
}

@media screen and (min-width : 960px) {
	.flex-container {
		display: flex;
		flex-wrap: wrap;
		flex-grow: 1;
		justify-content: space-around;
		align-content: space-around;
	}
	flex-container > *[class^="col-"]{
		box-sizing: border-box;
		min-width: 50px;
		border: 1px solid #DDD;
	}
	#policy h3{margin-bottom:10px;}
	.col-1 { width: calc( 100% - 45px); }
	.col-2 { width: calc( 50% - 24px); }
	.col-2-doc {width: calc( 45% - 0px); }
	.col-2-top {width: calc( 50% - 0px); }
	.col-3 { width: calc( 33% - 20px);}
	.col-4 { width: calc( 24% - 5px);}

	#kodawari article{font-size: 14px;}
	footer div{
		margin:0 auto;
		padding:0;
		max-width:980px;
		flex-direction: row;
	}

}
