@charset "utf-8";

#header {
}

/** under 767px **/
@media screen and (max-width: 767px) {

#home #header {
	background: url(../images/main-sp.png) no-repeat 0 0;
	background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	padding: 150.625% 0 0;
}
#home #header h1 {
	overflow: hidden;
	height: 0px;
}

#home #header #oa-info {
	display: none;
}

#home #header #sp-info {
	display: none;
}

#home #header #oa-info2 {
	display: none;
}

.tree #header {
	padding: 1.8% 0 0;
}
.tree #header h1 {
	background: url(../images/header-sp.png) no-repeat 0 0;
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
	padding: 13.38% 0 0;
	background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	margin: 0 0 4.8%;
	position: relative;
}
.tree #header h1 a {
	width: 41.4%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.tree #header #oa-info,
.tree #header #oa-info2,
.tree #header #sp-info {
	display: none;
}


/** program-nav **/

#home #header #program-nav2 {
	display: none;
}

.tree #header #program-nav {
	display: none;
}

#home #program-nav {
	width: 94%;
	margin: 0 auto 7.2%;
}
#home #program-nav-inner {
	display: block;
	background: url(../images/program-nav-sp.png) no-repeat center;
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
	padding: 13.3% 0 0;
	background-size: 50% auto;
	-webkit-background-size: 50% auto;
	-moz-background-size: 50% auto;
	position: relative;
}
#home #program-nav ul {
}
#home #program-nav li {
}
#home #program-nav li.program-nav-backnumber a {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 25%;
}
#home #program-nav li.program-nav-mail a {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 50%;
}

.tree #program-nav2 {
	width: 94%;
	margin: 0 auto 4.8%;
}
.tree #program-nav2-inner {
	display: block;
	background: url(../images/program-nav-sp2.png) no-repeat 0 0;
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
	padding: 13.19% 0 0;
	background-size: 100% auto;
	-webkit-background-size: 100% auto;
	-moz-background-size: 100% auto;
	position: relative;
}
.tree #program-nav2 ul {
}
.tree #program-nav2 li {
}
.tree #program-nav2 li.program-nav-backnumber a {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.tree #program-nav2 li.program-nav-mail a {
	width: 33.33%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 33.33%;
}
.tree #program-nav2 li.program-nav-top a {
	width: 50%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 50%;
}


}



/** over 768px **/
@media screen and (min-width: 768px) {

#header {
	background: linear-gradient(#fff 402px, #ff92ca 0);
	width: 100%;
}
#header #header-inner {
	background: url(../images/main.png) no-repeat center 0;
	width: 980px;
	height: 692px;
	margin: 0 auto;
	position: relative;
}

#header h1 a {
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
	text-decoration: none;
	width: 620px;
	height: 200px;
	position: absolute;
	top: 260px;
	left: 60px;
}
#header #oa-info,
#header #oa-info2,
#header #sp-info h2,
#header #sp-info p {
	overflow: hidden;
	height: 0px;
}


/** program-nav **/

#header #program-nav2 {
	display: none;
}

#header #program-nav {
}
#header #program-nav-inner {
}
#header #program-nav ul {
}
#header #program-nav li a {
	display: block;
	font-size: 0px;
	line-height: 0px;
	text-indent: -9999px;
	text-decoration: none;
	width: 231px;
	height: 48px;
	position: absolute;
}

#header #program-nav .program-nav-backnumber a {
	background: url(../images/btn-backnumber.png) no-repeat 0 0;
	top: 614px;
	left: calc((100% - 231px) / 2);
}
#header #program-nav .program-nav-backnumber a:hover {
	background: url(../images/btn-backnumber.png) no-repeat 0 -48px;
}

#header #program-nav .program-nav-mail a {
	background: url(../images/btn-mail.png) no-repeat 0 0;
	top: 614px;
	left: 504px;
}
#header #program-nav .program-nav-mail a:hover {
	background: url(../images/btn-mail.png) no-repeat 0 -48px;
}


}