@charset "UTF-8";

@font-face {
	font-family:"Noto Sans JP";
	font-style:normal;
	font-weight:400;
	src:	url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Regular.woff2) format('woff2'),
		url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Regular.woff) format('woff'),
		url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Regular.otf) format('opentype');
}

@font-face {
	font-family:"Noto Sans JP";
	font-style:normal;
	font-weight:700;
	src:	url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Bold.woff2) format('woff2'),
		url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Bold.woff) format('woff'),
		url(/National_Library/oe_/https://mixzone.co.jp/fonts/NotoSansJP-Bold.otf) format('opentype');
}

/* 『*{}』で設定されると他の子要素で継承が使えなくなり個別に指定しなければならなくなるので廃止
*{
}
*/
body{
	font-family:"Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
	font-size:16px;
	line-height:1.65em;
}

h1,h2,h3,h4,h5,h6,.megaMenu,nav{
	font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
}

.background-gradient{
	background-color:#0abeb4 !important;
	background:-moz-linear-gradient(left 45deg, #0abeb4, #1e89c4) !important;
	background:-webkit-gradient(linear, left top, right bottom, from(#0abeb4), to(#1e89c4)) !important;
	background:linear-gradient(to bottom right, #0abeb4, #1e89c4) !important;/* IE10+, W3C */
	color:#ffffff !important;
}

.background-gradient2{
	background-color:#1e89c4 !important;
	background:-moz-linear-gradient(left 45deg, #1e89c4, #005b84) !important;
	background:-webkit-gradient(linear, left top, right bottom, from(#1e89c4), to(#005b84)) !important;
	background:linear-gradient(to bottom right, #1e89c4, #005b84) !important;/* IE10+, W3C */
	color:#ffffff !important;
}

/* loading */
.megaMenu{
	display:none;
	position:absolute;
	top:85px;
	left:0;
	z-index:103;
	width:100%;
	height:165px;
	min-height:85px;
	background-color:#0abeb4;
	background:-moz-linear-gradient(left 45deg, #0abeb4, #1e89c4);
	background:-webkit-gradient(linear, left top, right bottom, from(#0abeb4), to(#1e89c4));
	background:linear-gradient(to bottom right, #0abeb4, #1e89c4);/* IE10+, W3C */
	opacity:1.0;
}

@media screen and (min-width: 0px) and (max-width: 870px){
	.megaMenu{
		top:115px;
	}
}

.megaMenu .megaMenu-closer{
	position:absolute;
	bottom:0;
	width:100%;
	text-align:center;
	line-height:1.5em;
}

.megaMenu .megaMenu-closer .glyphicon{
	color:#0ac4b9;
	font-size:93%;
	opacity:1;
}

.megaMenu .container .megaMenu-lavel{
	margin-top:27px;
/* 	margin-left:90px; */
	color:#ffffff;
	text-align:left;
	font-size:106%;
	font-weight:bold;
}

.megaMenu .container .megaMenu-list{
	list-style-type:none;
	margin:30px 0;
}

.megaMenu .container .megaMenu-list li a{
	font-size:87%;
}

.megaMenu .container a,
.megaMenu .container .no-link{
	color:#ffffff;
}

#whiteLayer{
	display:none;
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	width:100%;
	height:85px;
	background:#ffffff;
	opacity:1.0;
}

@media screen and (min-width: 0px) and (max-width: 870px){
	#whiteLayer{
		height:115px;
	}
}

#glayLayer{
	display:none;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
	width:200%;
	height:200%;
/* 	background-color:#030f3f; */
	background-color:#000000;
	opacity:0.8;
}

#progressMsg{
	display:none;
	position:fixed;
	top:50%;
	left:0;

	z-index:102;
	width:100%;
	text-align:center;
	color:#ffffff;
}

/* .container{}

@media(min-width:768px){
	.container{
		max-width:750px;
	}
}

@media(min-width:992px){
	.container{
		max-width:900px;
	}
}

@media(min-width:1200px){
	.container{
		max-width:900px;
	}
} */

.container,
.container-fluid{
	padding-right:0;
	padding-left:0;
}

/* .jumbotron{
	margin-bottom:0;
	padding-top:0;
	padding-bottom:50px;
	background-color:#1c2637;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	.jumbotron{
		padding-bottom:0;
	}
} */

#header{
	min-height:301px;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	#header{
		min-height:136px;
	}
}

.row{
	margin-left:0;
	margin-right:0;
}

/* .navbar-default */

nav.navbar-default{
/* 		position:absolute;
		z-index:100;
		top:0; */
	margin-top:-51px;
	margin-bottom:0;
	margin-right:auto;
	margin-left:auto;
	border:none;
	width:1170px;
	max-width:100%;
	background-color:transparent;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	nav.navbar-default{
		position:absolute;
		z-index:100;
		top:0;left:0;
		width:100%;
		margin-top:0;
		background:transparent;
	}
}

nav.navbar-default .container-fluid{
	padding:0;
}

nav.navbar-default .navbar-header{
	margin-left:0;
	margin-right:0;
}

nav.navbar-default .navbar-header .navbar-title{
	margin-top:0;
	margin-bottom:0;
}

nav.navbar-default .navbar-header .navbar-title .navbar-brand{
	position:relative;
	top:83px;
	left:15px;
	z-index:102;
	padding:0 15px;height:auto;
	color:#53b5d6;
}

nav.navbar-default .navbar-header .navbar-title .logo{
	width:186px;
	margin-left:10px;
}

nav.navbar-default .navbar-collapse{
	background-color:transparent;
	margin-left:0;
	margin-right:0;
	padding-left:0;
	padding-right:0;
}

nav.navbar-default .navbar-collapse ul.navbar-nav{
	position:absolute;
	top:104px;
	right:30px;
	z-index:101;
	float:none;
	margin-left:auto;
	margin-right:auto;
	width:auto;
	max-width:100%;
	font-weight:bold;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li a{
	margin:0 0 0 0;
	padding:10px 0;
	color:#ffffff;
	white-space:normal;
	font-weight:bold;
}

nav.navbar-default #navbar-ex0-collapse ul.navbar-nav li a{
	margin:-8px 0 0 16px;
	font-size:87%;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li.active a{
	box-shadow:none;
	background-image:none;
	background-color:transparent;
	color:#ffffff;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li.open a{
	box-shadow:none;
	background-image:none;
	background-color:transparent;
	color:#ffffff;
}

.color-turnover{
	color:#333333 !important;
}

.glyphicon{
	padding-right:0.5em;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li a:hover{
/* 	background-image:url("/National_Library/oe_/https://mixzone.co.jp/images/bg_nav_btn.png");
	background-repeat:no-repeat;
	background-position:bottom;
	background-size:auto 100%;
	text-decoration:underline;
	color:#0abeb4; */
}

nav.navbar-default .navbar-collapse ul.navbar-nav li.open ul.dropdown-menu{
	padding-top:0;
	padding-bottom:0;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li.open ul.dropdown-menu a{
	background-color:rgba(255,255,255,0.3);
	padding-left:40px;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li.open ul.dropdown-menu a:hover,
nav.navbar-default .navbar-collapse ul.navbar-nav li.open ul.dropdown-menu a:active{
	color:#ffffff;
}

nav.navbar-default .navbar-collapse ul.navbar-nav li a:hover img{
	opacity:1;
}

@media screen and (min-width: 0px) and (max-width: 927px){
	nav.navbar-default .navbar-header .navbar-title .navbar-brand{
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav{
/* 		width:720px; */
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav li a{
/* 		margin:0 3px; */
	}

}

@media screen and (min-width: 0px) and (max-width: 870px){
	nav.navbar-default .navbar-header .navbar-title .navbar-brand{
/* 		left:10%; */
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav{
/* 		right:10%; */
		top:134px;
	}
}

@media screen and (min-width: 0px) and (max-width: 857px){
	nav.navbar-default .navbar-collapse ul.navbar-nav{
/* 		width:728px; */
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav li a{
/* 		margin:; */
	}
}

@media screen and (min-width: 0px) and (max-width: 767px){
	#whiteLayer{
		display:none;
	}

	nav.navbar-default .navbar-header{
		height:60px;
		background-color:#ffffff;
	}

	nav.navbar-default .navbar-header .navbar-title .navbar-brand{
		position:static;
		color:#53b5d6;
	}

	nav.navbar-default .navbar-header .navbar-title .logo{
		margin-top:15px;
		width:140px;
	}

	nav.navbar-default,
	nav.navbar-default .navbar-collapse{
/* 		box-shadow: 0 3px 3px 3px rgba(127,127,127,0.1); */
		background-color:#0abeb4;
		background:-moz-linear-gradient(left 45deg, #0abeb4, #1e89c4);
		background:-webkit-gradient(linear, left top, right bottom, from(#0abeb4), to(#1e89c4));
		background:linear-gradient(to bottom right, #0abeb4, #1e89c4);/* IE10+, W3C */
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav{
		position:static;
		width:900px;
	}

	nav.navbar-default .navbar-collapse ul.navbar-nav li a,
	nav.navbar-default .navbar-collapse ul.navbar-nav li a:hover{
		margin:0;
		border-bottom:solid 1px #eeeeee;
		padding:20px 24px;
		color:#ffffff;
	}
}

nav.navbar-default #navbar-ex1-collapse{
	position:relative;
	z-index:-1;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	nav.navbar-default #navbar-ex1-collapse{
		position:static;
		z-index:0;
	}
}

nav.navbar-default .navbar-toggle{
	margin-top:13px;
	margin-right:3px;
	border-color:transparent;
	background-color:transparent;
}

nav.navbar-default .navbar-toggle:hover,
nav.navbar-default .navbar-toggle:focus{
	border-color:transparent;
	background-color:transparent;
}

nav.navbar-default .navbar-toggle .icon-bar{
	width:25px;
	height:3px;
	background-color:#0abeb4;
	background:-moz-linear-gradient(left 45deg, #0abeb4, #1e89c4);
	background:-webkit-gradient(linear, left top, right bottom, from(#0abeb4), to(#1e89c4));
	background:linear-gradient(to bottom right, #0abeb4, #1e89c4);/* IE10+, W3C */
}

/* heading 1 */
.h1-container{
	margin-right:auto;
	margin-left:auto;
	border:none;
	width:1170px;
	max-width:100%;
	padding-left:15px;
}

h1{
	margin-top:117px;
	color:#ffffff;
	text-align:left;
	font-size:150%;
	font-weight:normal;
}

h1 small{
	color:#ffffff;
	font-size:62%;
	font-weight:bold;
}

@media screen and (min-width: 0px) and (max-width: 870px){
	h1{
		margin-top:147px;
	}
}

@media screen and (min-width: 0px) and (max-width: 767px){
	h1{
		margin-top:85px;
		margin-bottom:25px;
		text-align:left;
		font-size:150%;
		font-weight:normal;
	}
}

/* heading 2 */
.h2-underline{
	margin-bottom:15px;
	background-color:#1e89c4 !important;
	background:-moz-linear-gradient(left, #1e89c4, #005b84) !important;
	background:-webkit-gradient(linear, left top, right top, from(#1e89c4), to(#005b84)) !important;
	background:linear-gradient(to top right, #1e89c4, #005b84) !important;/* IE10+, W3C */
	padding:0 0 2px 0;
}

.h2-underline h2{
	margin-top:0;
	margin-bottom:0;
	padding:10px;
	background-color:#ffffff;
	color:#333333;
	font-size:150%;
}

/* .breadcrumb */
.breadcrumb{
	margin-bottom:20px;
	background-color:transparent;
	line-height:1.3em;
}

.breadcrumb li a,
.breadcrumb li.active{
	font-size:87%;
}










/* ----------------------------------------
scrollup-btn-block
---------------------------------------- */

#scrollup-btn-block{
	position:fixed;
	right:1.8%;
	bottom:16px;
	z-index:2;
}







/* ----------------------------------------
button
---------------------------------------- */
.btn{
	max-width:90%;
}

.btn span{
	vertical-align:-8%;
}

.btn:hover{
/*	color:#ffffff; btn-defaultで問題を起こすので指定しない */
	opacity:0.8;
}

/* ----------------------------------------
.topnews
---------------------------------------- */
.topnews{
	min-height:3em;
}

.topnews .topnews-left{
	padding-top:1.5em;
}

.topnews .topnews-center{
	padding-top:1.5em;
}

.topnews .topnews-right{
	padding-top:1em;
}

.topnews p{
	font-size:87%;
}

.topnews-btn{
	text-align:right;
}

@media(min-width: 0px) and (max-width: 991px){
	.topnews .topnews-center{
		padding-top:0em;
	}
	.topnews-btn{
		text-align:center;
	}
}

@media(min-width: 0px) and (max-width: 767px){
	.topnews-btn{
		text-align:center;
	}
}

/* ----------------------------------------
.general
---------------------------------------- */
.general{
	padding-top:10px;
	padding-right:0;
	padding-bottom:30px;
	padding-left:0;
}

.general .row{}

.asciionly{
	ime-mode:disabled;
}

label input[type="radio"] {
	margin-top:7px;
}

.datepicker-dropdown {
	margin-top:-50px;
}

.datepicker table tr th {
	font-size:14px;
	color:#fff;
	border-radius:0;
	background-color:#0abeb4;
}
.datepicker table tr td {
	font-size:14px;
}

.datepicker .datepicker-switch:hover, .datepicker .next:hover, .datepicker .prev:hover {
	background-color:#0bd9cf;
}

.mr5 {
	margin-right:5px;
}

.mr10{
	margin-right:10px;
}

.mr15{
	margin-right:15px;
}

.mr20 {
	margin-right:20px;
}

.pad-lr20 {
	padding-left:20px;
	padding-right:20px;
}

/* ----------------------------------------
.feature
---------------------------------------- */
.feature{
	padding-left:0;
	padding-right:0;
	background-color:#f0f1f4;
	background-repeat:no-repeat;
	background-position:center;
	background-size:contain;
}

.feature .row{
	display:table;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	max-width:1200px !important;
	width:100%;
	min-height:500px;
	padding-left:15px;
	padding-right:15px;
}

.feature .v-cell{
	display:table-cell;
	width:100%;
	vertical-align:middle;
}

.feature .row .feature-left,
.feature .row .feature-right{
	display:table;
	margin-top:65px;
	margin-bottom:65px;
}

.feature h2{
	margin-top:0;
	margin-bottom:0;
	font-size:87%;
	font-weight:bold;
}

.feature h3{
	line-height:1.2em;
	margin-top:16px;
	margin-bottom:0;
	font-size:181%;
	font-weight:bold;
}

.feature h3 small{
	color:#333333;
	font-size:68%;
	font-weight:bold;
}

.feature p{
	margin-top:30px;
	margin-bottom:0;
}

.feature .feature-img{
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.feature .feature-img img{
	width:100%;
	max-width:480px;
}

.feature button.btn{
	width:240px;
	height:50px;
}

@media(min-width: 0px) and (max-width: 991px){
	.feature .row{
		background-size:auto !important;
	}

	.feature .row .feature-left,
	.feature .row .feature-right{
		width:100%;
	}

	.feature .feature-btn{
		text-align:center;
	}
}

/* ----------------------------------------
.works
---------------------------------------- */
.works{padding-top:35px;padding-left:0;padding-right:0;
	height:450px;
}

.works h2{margin-bottom:40px;
	text-align:center;
	color:#ffffff;
	font-size:175%;
	font-weight:bold;
}

.works h2 small{
	color:#ffffff;
}

/* ----------------------------------------
.blog-news
---------------------------------------- */
.blog-news{
	padding-left:0;
	padding-right:0;
	background-color:#f0f1f4;
	background-repeat:no-repeat;
	background-position:center;
	background-size:100% auto;
}

.blog-news .row{margin-left:auto;margin-right:auto;max-width:1200px !important;width:100%;
	display:table;
	position:relative;
	min-height:500px;
	padding-left:15px;
	padding-right:15px;
}

.blog-news .v-cell{
	display:table-cell;
	width:100%;
	vertical-align:middle;
}

.blog-news .row .blog-news-left,
.blog-news .row .blog-news-right{
	display:table;
	margin-top:65px;
	margin-bottom:65px;
}

.blog-news h2{
	margin-top:0;
	margin-bottom:0;
	font-size:175%;
	font-weight:bold;
}

.blog-news p{
	margin-top:30px;
	margin-bottom:0;
}

.blog-news .blog-news-btn{
	margin-top:-2.2em;
	text-align:right;
}

.blog-news button.btn{
	width:90px;
	height:40px;
	font-size:106%;
}

@media(min-width: 0px) and (max-width: 991px){
	.blog-news .row{
		background-size:auto !important;
	}

	.blog-news .row .blog-news-left,
	.blog-news .row .blog-news-right{
		width:100%;
	}
}

/* ----------------------------------------
.bunner-area
---------------------------------------- */
.bunner-area{
	padding:15px 0;
	background-color:#f0f1f4;
	background-repeat:no-repeat;
	background-position:center;
	background-size:100% auto;
	text-align:center;
}

.bunner-area img{
	width:100%;
	max-width:468px;
	padding:15px;
}

/* ----------------------------------------
.sitemap
---------------------------------------- */
.sitemap{
	background:#5b5a60;
	padding-left:0;
	padding-right:0;
	color:#ffffff;
}

.sitemap .row{margin-left:auto;margin-right:auto;max-width:1200px !important;width:100%;
	padding-left:15px;
	padding-right:15px;
}

.sitemap .row div{
	padding:15px 0;
}

.sitemap p{
	margin-top:15px;
	margin-bottom:0.2em;
	line-height:1em;
}

.sitemap p a,
.sitemap p .no-link{
	color:#53b5d6;
	font-size:81%;
}

.sitemap ul{
	list-style-type:none;
	padding-left:0.1em;
}

.sitemap li{

}

.sitemap li a,
.sitemap li .no-link{
	color:#ffffff;
	font-size:75%;
}

.sitemap button.btn{
	width:200px;
	height:40px;
}

.sitemap .copyright{
	position:relative;
}

.sitemap .copyright .copyright{
	position:absolute;
	top:6em;
	color:#a0a0a0;
	font-size:81%;
}

@media(min-width: 0px) and (max-width: 767px){
	.sitemap{
		display:none;
	}
}

/* ----------------------------------------
footer
---------------------------------------- */
footer{
	border-top:solid 1px #505052;
	background-color:#5b5a60;
	padding:10px 0 2px 0;
	color:#a0a0a0;
	text-align:center;
}

footer p{
	font-size:68%;
}

footer p *{
	color:#a0a0a0;
	font-size:100%;
}

footer p a:hover{
	color:#a0a0a0;
}

footer .copyright{
	display:none;
}

@media(min-width: 0px) and (max-width: 767px){
	footer{
		padding:30px 0 22px 0;
	}

	footer .copyright{
		display:block;
	}
}




/* 一時的にエンタテインメント情報を非表示にする処置 */
.nav.navbar-nav>li:nth-child(4){
	display:none !important;
}

.sitemap .container-fluid .row div:nth-child(3) p:nth-child(3){
	display:none !important;
}

.admin-menu .row .v-cell div:nth-child(4){
	display:none !important;
}

.admin-top-config #fixed-block-table tbody tr:nth-child(3){
	display:none !important;
}