/*--------------------------------------------------------------------------

トップページ　CSS

--------------------------------------------------------------------------*/

body{
	min-width:640px;
	overflow-x:hidden; 
}

article{
	width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

/*------------------------------------------------------------------------

footer

----------------------------------------------------------------------*/

#cc .login {
	background: url(../image/contants/top/menbers-icon.png);
    background-repeat: no-repeat;
    width: 168px;
    height: 37px;
    float: right;
    display: inline-block;
    background-position: right;
}

#cc .login a{
	display:block;
	width:100%;
	height:100%;
	white-space:nowrap;
	overflow:hidden;
	text-indent:-500%;
}


#footer #cc{
	max-width:1200px;	
}

#fooder-bana {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-image:none;
	background-color:#fff; 
    background-repeat: repeat-x;
    background-position: top;
    padding-top: 70px;
    padding-bottom: 55px;
}

#footer-bana-primary {
    max-width: 1200px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

@media screen and (max-width: 1120px){
#footer-bana-primary {
    max-width: inherit;
    width: inherit;
    width: 95%;
    padding-left: 5%;
    margin-left: auto;
    margin-right: auto;
}
}

@media screen and (max-width: 640px){
#footer-bana-primary {
    max-width: inherit;
    width: inherit;
    width: 90%;
    padding-left: 5%;
    margin-left: auto;
    margin-right: auto;
    padding-right: 5%;
}
}

#footer-bana-primary a {
    width:277px;
	height:60px;
	margin-bottom:15px;
	margin-right:27px;
	display:inline-block;
}

@media screen and (max-width: 1250px){
#footer-bana-primary a:nth-child(4), #footer-bana-primary a:nth-child(8) {
    margin-right: 27px;
}
}

@media screen and (max-width: 660px){
#footer-bana-primary a {
    height: 60px;
    margin-bottom: 15px;
    margin-right: 22px;
    display: inline-block;
    float: left;
}
#footer-bana-primary a:nth-child(2n) {
    margin-right: 0;
}
}

#content-slider {
	background-color:#fff; 
	padding-top:32px;
	padding-bottom:32px;
}

#content-slider article {
	max-width:1124px;
	width:90%;
}

#content-slider .content-slider-primary {
	height: 95px;
}

.owl-stage-outer {
	height: 60px;
	padding-top: 18px;
	padding-bottom: 18px;
}

.owl-carousel.owl-drag .owl-item{display: inline-block;}

#content-slider .content-slider-primary .item {
	width: 277px;
	height:auto;
	margin:0 auto;
	box-shadow:unset;
	-moz-box-shadow:unset;
	-webkit-box-shadow: unset;
}

#content-slider .content-slider-primary .item a {
	width:auto;
	height:auto;
	background-color:unset;
	display:block;
	line-height:inherit;
	text-align:center;
	text-decoration:none !important;
	color:#000;
	font-weight:normal;
	font-size:18px;
}

#content-slider .content-slider-primary .item img {
	width:auto;
	margin:auto;
}

#content-slider .content-slider-primary .item h4 {
	font-size:18px;
	color:#5cccd9;
	margin:0;
	padding:0;
	padding-left:18px;
	padding-right:18px;
	padding-top:15px;
	border:none;
}

#content-slider .content-slider-primary .item p {
	font-size:14px;
	color:#373737;
	margin:0;
	padding:0;
	padding-left:18px;
	padding-right:18px;
	padding-top:6px;
}

.owl-next {
    top: 0;
    right:0;
}

.owl-next:hover {
    right: -10px;
}

.owl-prev {
    top: 0;
    left:0;
}

.owl-prev:hover {
    left:-10px;
}

/*------------------------------------------------------------------------

header

----------------------------------------------------------------------*/

header{
	background-color:#fff;
	padding:30px 45px;
	box-sizing:border-box;
	position:relative;
	z-index:9999;
}

@media screen and (max-width:1100px){
header{
	padding:30px;
}
}

#h-pc{
	display:block;
}

#h-sp{
	display:none;
}

@media screen and (max-width:950px){
#h-pc{
	display:none;
}

#h-sp{
	display:block;
}
}

#header-line{
	background-image:none;
	height:auto; 
}

#header-line h1 {
    margin: 0;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
    line-height: 28px;
    color: #000;
    font-size: 13px;
    text-shadow: unset;
    font-weight: normal;
	float:left;
	display: block;
    width: auto;
    height: 100%;
	text-indent:0; 
}

#h-sp #header-line h1 {
    margin-bottom:1em;  
	width:100%;
}

#header-line .logo {
	background:url(../image/contants/top/logo.png?update=20200630);
	background-repeat:no-repeat;
	margin-right: 30px;
	padding-right: 30px;
	border-right:1px solid #e6e6e6; 
	width:316px; 
	height:57px; 
	float:left; 
}

#header-line .logo a{
	display:block; 
	width:100%; 
	height:100%;
	white-space:nowrap;
	overflow:hidden;
	text-indent:-500%; 
}

#header-line .login {
	background: url(../image/contants/top/menbers-icon.png);
    background-repeat: no-repeat;
    width: 168px;
    height: 57px;
    float: right;
    display: inline-block;
    padding-left: 30px;
    background-position: right;
}

@media screen and (max-width:1100px){
#header-line .login {
    padding-left: 20px;
    background-position:center;
}
}

#h-sp #header-line .login {
	background: url(../image/contants/top/menbers-icon.png);
	background-repeat: no-repeat;
	width: 168px;
	height: 57px;
	float: right;
	display: inline-block;
	padding-left:0;
	border-left:none;
	background-position: right;
	margin-right: 25px;
}

@media screen and (max-width:640px){
#h-sp #header-line .login {
	margin-right:30px; 
}
}

#header-line .login a{
	display:block;
	width:100%;
	height:100%;
	white-space:nowrap;
	overflow:hidden;
	text-indent:-500%;
	padding-right: 25px;
	border-right: 1px solid #e6e6e6;
}

@media screen and (max-width:640px){
#header-line .login a{
	padding-right: 30px;
}
}



/*------------------------------------------------------------------------

mainvisual

----------------------------------------------------------------------*/

#mainvisual {
	background:url("../image/mainvisual/main10.jpg?v=20250715") top center no-repeat;
	width:100%;
	height:0; 
	padding-top:38.59375%;
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
	position: relative;
}

@media screen and (max-width:1200px){
#mainvisual {
	background:url("../image/mainvisual/main10_1200.jpg?v=20250715") top center no-repeat;
	width:100%;
	height:0; 
	padding-top:51.03305785123967%;
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
	position: relative;
}
}


/*------------------------------------------------------------------------

menu

----------------------------------------------------------------------*/

#activity {
	background-color:#fff; 
}

#activity article {
	width:100%;
	max-width: 1250px;
	padding:70px 0 25px;
	box-sizing:border-box; 
}

@media screen and (max-width:1260px){
#activity article {
	padding:70px 30px 25px;
}
}

#activity article ul {
	padding:0;
	margin:0 auto;
	list-style:none;  
}

#activity article ul li {
	width: calc(20% - 8px);
	margin-right:10px;
	box-sizing:border-box; 
	float:left;
}

@media screen and (max-width:1000px){
#activity article ul li {
	width: calc(33.33333% - 10px);
	margin-right:10px;
	margin-bottom:10px;
	box-sizing:border-box; 
	float:left;
}
}

@media screen and (max-width:640px){
#activity article ul li {
	width: 100%;
	margin-right:10px;
	margin-bottom:10px;
	box-sizing:border-box;
	float:left;
	padding: 0 0 30px;
}
}

#activity article ul li.top{
	background-color:#7ae2ff;  
}

#activity article ul li.top:hover , #activity article ul li.play:hover , #activity article ul li.search:hover {
	opacity: 1;
	filter: brightness(1.1);
}	


#activity article ul li.event:hover {
	opacity: 1;
	filter: brightness(1.4);
}	

#activity article ul li.doctor:hover {
	opacity: 1;
	filter: brightness(1.1);
}	

#activity article ul li.play{
	background-color:#e3d858;  
}

@media screen and (max-width:640px){
#activity article ul li.play , #activity article ul li.event {
	margin-right:0; 
}
}

#activity article ul li.search {
	background-color:#43bf92;  
}

@media screen and (max-width:1000px){
#activity article ul li.search {
	margin-right:0;   
}
}

@media screen and (max-width:640px){
#activity article ul li.search a{
	margin-right:10px;   
}
}

#activity article ul li.event{
	background-color:#fb5012;  
}

#activity article ul li.doctor {
	margin-right:0; 
}

#activity article ul li.doctor{
	background-color:#12bffb; 
	margin-right:0; 
}

#activity article ul li a {
	width:100%;
	height:100%;
	display:block;
	text-decoration:none;
	text-align:center;
	color:#fff;
	padding: 40px 20px 20px;
	box-sizing: border-box;
}

@media screen and (max-width:1260px){
#activity article ul li a p br {
	display:none;
}
}

#activity article ul li .iconimg{
	width: auto;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: auto;
    height: 105px;
}

@media screen and (max-width:640px){
#activity article ul li .iconimg{
	width: 25%;
    display: inline-block;
    float: left;
}
}

#activity article ul li.top .iconimg{
	background-image:url(../image/contants/top/icon1-0.png);  
}

#activity article ul li.play .iconimg{
	background-image:url(../image/contants/top/icon-1-1.png);  
}

#activity article ul li.search .iconimg{
	background-image:url(../image/contants/top/icon-1-2.png);  
}

#activity article ul li.event .iconimg{
	background-image:url(../image/contants/top/icon-1-3.png);  
}

#activity article ul li.doctor .iconimg{
	background-image:url(../image/contants/top/icon-1-4.png);  
}

#activity article ul li h2{
	font-size:1.25em;
	color:#3e3e3e; 
	margin-bottom:0; 
}

@media screen and (max-width:640px){
#activity article ul li h2{
	font-size:1.1em;
	float:left;
	width: 75%;
	text-align: left;
}
}

#activity article ul li p{
	margin-bottom:0; 
	color: #3e3e3e;
}

@media screen and (max-width:640px){
#activity article ul li p{
	width:75%; 
	float:left;
	text-align:left; 
}
}

/*------------------------------------------------------------------------

information

----------------------------------------------------------------------*/

#information {
	background-color:#fff;
	background-image:none;
	background-position:bottom;
	background-repeat:no-repeat;
	padding: 35px 0 30px;
}

#information article {
    width: 100%;
    max-width:1200px; 
}

@media screen and (max-width:1260px){
#information article {
    width: 100%;
    max-width:inherit; 
	padding:0 30px;
	box-sizing:border-box; 
}
}

#information article #information-content ul  {
	font-size:1.2em; 
}

#information article #information-content ul li {
    width: 100%;
    display: block;
	padding:1em 0;
	margin-bottom:0;
	border-bottom:1px dotted #dbdbdb;
}

#information article #information-content ul li span {
    color: #7ae2ff;
    font-size: 1em;
    display: block;
    width: 95px;
    float: left;
}

#information article #information-content ul li p {
    overflow: hidden;
    float: left;
    margin: 0;
    padding: 0;
    padding-left: 12px;
	width:auto; 
}

@media screen and (max-width:1000px){
#information article #information-content ul li p {
    overflow: hidden;
    float: none;
    padding-left: 0;
	width:100%; 
}
}

@media screen and (max-width:640px){
#information article #information-content ul li p {
    font-size:110%; 
}
}

#information article #information-content ul li p a {
    color: #2d2d2d;
    font-size: 1em;
    text-decoration: none;
    border-bottom:none;
    display: inline-block;
    padding-bottom: 0;
}

#information article #information-content ul li p a:hover {
    color: #44bf91;
	border-bottom:none;
}

#information article #information-content {
	width:100%;
	max-width:inherit; 
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

#information article #information-content h3{
	background-image: url(../image/contants/top/information.png);
    width: 202px;
    height: 62px;
    margin: 0;
    padding: 0;
    display: block;
    margin-bottom: 30px;
    overflow: hidden;
    text-indent: 100%;
	white-space: nowrap;
}

#information article #information-content .archive-button {
    background-image: url(../image/contants/top/information-archive.jpg);
    width: 230px;
    height: 62px;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}

.info-corona{
    background: url(../image/covid19_top.jpg?v=2) top center no-repeat;
	width: 100%;
    height: 0;
    padding-top: 45%;
    background-size: contain;
	margin-top:-50px; 
	margin-bottom:50px; 
}

@media screen and (max-width:640px){
.info-corona{
    background: url(../image/covid19_top_sp.jpg?v=2) top center no-repeat;
    padding-top:137.5862068965517%;
	margin-top:0;
	margin-bottom:60px; 
}
}

.top-alart {
	margin-bottom: 30px;
	border: 3px solid #0189d5;
	padding: 30px;
	box-sizing: border-box;
}

.top-alart strong {
	display: block;
	text-align: center;
	font-size: 24px;
	margin-bottom: 30px;
}

.top-alart p {
	margin: 0;
	padding: 0;
	font-size: 18px;
}

@media screen and (max-width:640px){
	.top-alart strong {
		font-size: 28px;
	}
	.top-alart p {
		font-size: 24px;
	}
}

.top-pagelink-primary {
	width: calc(100% + 30px);
	margin-bottom: 30px;
}

@media screen and (max-width:640px){
	.top-pagelink-primary {
		margin-bottom: 50px;
	}
}

.top-pagelink-primary .list {
	width: calc(50% - 30px);
	margin-right: 30px;
	margin-bottom: 30px;
	float: left;
	position: relative;
	box-sizing: border-box;
	border: 3px solid #5fccda;
	padding: 30px;
	padding-right: 60px;
	color: #5fccda;
	font-weight: bold;
	text-align: left;
	font-size: 20px;
	background-image: url("../image/layout/ar.png");
	background-position: center right 20px;
	background-repeat: no-repeat;
	display: flex;
  align-items: center;
	transition: 0.2s;
}

.top-pagelink-primary .list.bana {
	border: none;
	padding: 0;
}

.top-pagelink-primary .list.bana img {
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width:900px){
	.top-pagelink-primary {
		width: 100%;
	}
	.top-pagelink-primary .list {
		width: 100%;
		float: none;
		margin-right: 0;
	}
}

.top-pagelink-primary .list:hover {
	background-position: center right 10px;
}

.top-pagelink-primary .list span {
	font-size: 18px;
	color: #666666;
}

.top-pagelink-primary .list a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
	transition: 0.2s;
}

.top-pagelink-primary .list a:hover {
	background-color: rgba(255,255,255,0.3);
}

.top-pagelink-primary .list p {
	font-size: 20px;
}

@media screen and (max-width:640px){
	.top-pagelink-primary .list span {
		font-size: 22px;
	}
	.top-pagelink-primary .list p {
		font-size: 26px;
	}
}

/*------------------------------------------------------------------------

content-link

----------------------------------------------------------------------*/

#content-link {
	padding: 70px 0 40px;
	background-color:#f5f5f5;
	box-sizing:border-box;
}

@media screen and (max-width:640px){
#content-link {
	padding: 0;
	background-color:#f5f5f5;
	box-sizing:border-box;
}
}

#content-link article {
	box-sizing: border-box;
}

#content-link ul {
	padding:0;
	margin:0 auto;
	list-style:none; 
}

@media screen and (max-width:640px){
#content-link ul {
	padding:0;
	margin:0 auto;
	list-style:none;
	border-top:1px solid #8a8a8a;
}
}

#content-link ul li {
	width:calc( 33.33333% - 20px);
	margin:0 33px 30px 0;
	float:left; 
	max-width:378px; 
}

@media screen and (max-width:1200px){
#content-link ul li {
	margin:0 30px 30px 0;
}
}

#content-link ul li a {
	background-repeat:no-repeat;
	background-position: center;
	background-size:contain; 
	background-color:#fff;
	width:100%;
	height:0; 
	padding-top:39.68253968253968%; 
	box-sizing:border-box;
	float:left; 
	display: block;
    overflow: hidden;
    white-space: nowrap;
    text-indent: 100%; 
}

@media screen and (max-width:640px){
#content-link ul li {
	width: 100%;
	height:auto;
	border-bottom:1px solid #8a8a8a;
	margin: 0 0 0;
	max-width: none;
}
	
#content-link ul li a {
	background-repeat:no-repeat;
	background-position: center;
	background-size:contain;
	background-color:#fff;
	width:100%;
	height:0;
	padding-top:11.875%;
	margin: 0;
	box-sizing:border-box;
	float:left;
	display: block;
	overflow: hidden;
	white-space: nowrap;
	text-indent: 100%;
}
}

#content-link ul li:hover{
	 opacity:0.7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

#content-link ul li.child , #content-link ul li.link {
	margin-right:0;
}

@media screen and (max-width:640px){
#content-link ul li.child {
	margin-right:30px;
}
#content-link ul li.link {
	margin-right:auto;
}
#content-link ul li.poster {
	margin-right:0;
}
#content-link ul li.visit {
	margin-right:0;
}
}

#content-link ul li.mouth a{
	background-image:url(../image/contants/top/icon-2-1.jpg);
}

#content-link ul li.visit a {
	background-image:url(../image/contants/top/icon-2-2.jpg);
}

#content-link ul li.child a {
	background-image:url(../image/contants/top/icon-2-3.jpg);
}

#content-link ul li.poster a  {
	background-image:url(../image/contants/top/icon-2-4.jpg); 
}

#content-link ul li.work a {
	background-image:url(../image/contants/top/icon-2-5.jpg);
}

#content-link ul li.link a {
	background-image:url(../image/contants/top/icon-2-6.jpg);
}

@media screen and (max-width:640px){
#content-link ul li.mouth a{
	background-image:url(../image/contants/top/icon-2-1-sp.jpg);
}

#content-link ul li.visit a {
	background-image:url(../image/contants/top/icon-2-2-sp.jpg);
}

#content-link ul li.child a {
	background-image:url(../image/contants/top/icon-2-3-sp.jpg);
}

#content-link ul li.poster a  {
	background-image:url(../image/contants/top/icon-2-4-sp.jpg); 
}

#content-link ul li.work a {
	background-image:url(../image/contants/top/icon-2-5-sp.jpg);
}

#content-link ul li.link a {
	background-image:url(../image/contants/top/icon-2-6-sp.jpg);
}
}


#content-link .banner-area{
	display: flex;
	justify-content: center;
}

#content-link .banner-area > a{
	display: block;
}

#content-link .banner-area > a:nth-of-type(1){
	margin-right: 30px;
}

#content-link .banner-area img{
	max-width: 450px;
	width: 100%;
}

@media screen and (max-width:930px){
	#content-link .banner-area{
		flex-wrap: wrap;
	}
	#content-link .banner-area > a:nth-of-type(1){
		margin-right: 0px;
		margin-bottom: 30px;
	}
}

@media screen and (max-width:640px){
	#content-link .banner-area{
		padding: 20px 0;
	}
/* #content-link .banner-area img{
	padding: 20px 0px 20px 0px;
} */
}
