@charset "utf-8";

@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

/*----------------------------------
  reset
----------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%;
	vertical-align: baseline; background: transparent;
}
body {
	line-height: 1; color: #211;
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック","MS P Gothic","Osaka","Hiragino Kaku Gothic Pro", Verdana,Arial, Helvetica, sans-serif; 
	font-family: 'Noto Sans Japanese', sans-serif;
	-webkit-text-size-adjust: none;
}
ol, ul { list-style: none; }

:focus { outline: 0; }
img { max-width: 100%; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }


/*----- 共通内容 -----*/

.clearfix:after { 
	content: "."; 
	display: block; 
	visibility: hidden; 
	height: 0.1px; 
	line-height: 0; 
	clear: both; 
}

body {
	position: relative;
	max-width: 1920px;
	margin: 0 auto;
	background: #eee;
}
a {
	color: #211;
	text-decoration: none;
	transition: .3s;
}
a:hover,
a.underbar:hover {
	color: #999;
}
a.underbar {
	color: #666;
    text-decoration: underline;
}

/* header, nav */

.sp_logo {
	display: none;
}

.header_bar {
	display: flex;
	justify-content: space-between;
	padding: 10px 20px;
	background: #A4A5AE;
	color: #fff;
}
.header_bar p {
	line-height: 1.5;
}

.header_inner {
	margin-left: 200px;
	width: calc(100% - 200px);
}

.search_form {
	position: relative;
}
.search_form label {
	display: none;
}
.search_form input[type="text"] {
	border: 1px solid #777;
	width: 200px;
	height: 1rem;
	padding: .25rem;
	font-size: 1rem;
}
.search_form input[type="submit"] {
	position: relative;
	top: 1px;
	height: 1.66rem;
	padding: .25rem 1rem;
	border: none;
	background: #7A4E6E;
	color: #fff;
	font-size: 1rem;
	cursor: pointer;
}
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

.header_nav {
	background: #7A4E6E;
}
.header_nav ul {
	display: flex;
	justify-content: space-between;
}
.header_nav ul > li {
    position: relative;
	width: calc(15.5% - 1px);
	border-left: 1px solid #fff;
	font-size: .875rem;
	text-align: center;
}
.header_nav ul > li:nth-of-type(2) {
	width: calc(19.5% - 1px);
}
.header_nav ul > li:nth-of-type(5),
.header_nav ul > li:nth-of-type(6) {
	width: calc(17% - 1px);
}
.header_nav ul > li a {
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 10px 0;
}
.header_nav ul > li a:hover {
	background: #968;
}
.header_nav ul > li:nth-of-type(5) a,
.header_nav ul > li:nth-of-type(6) a {
	background: #BC3F55;
}
.header_nav ul > li:nth-of-type(5) a:hover,
.header_nav ul > li:nth-of-type(6) a:hover {
	background: #d57;
}

.header_nav ul > li ul.subnav {
    display: block;
    position: absolute;
    top: 35px;
    z-index: 9999;
    width: 100%;
}
.header_nav ul > li ul.subnav li {
    width: 100%;
    margin-bottom: 1px;
	border-left: none;
}
.header_nav ul > li ul.subnav li a {
    display: block;
	background: rgba(159,137,187,.5);
}
.header_nav ul > li ul.subnav li a:hover {
	background: rgba(159,137,187,1);
}
.header_nav ul > li:nth-of-type(5) ul.subnav li a,
.header_nav ul > li:nth-of-type(6) ul.subnav li a {
	background: rgba(188,63,85,.5);
}
.header_nav ul > li:nth-of-type(5) ul.subnav li a:hover,
.header_nav ul > li:nth-of-type(6) ul.subnav li a:hover {
	background: rgba(188,63,85,1);
}

@media screen and (max-width: 1280px){
	
	.header_inner {
		margin-left: 160px;
		width: calc(100% - 160px);
	}
	.header_bar p {
		margin-top: .25rem;
		font-size: .75rem;
	}
	
	.search_form input[type="text"] {
		width: 15vw;
	}	
	
	.header_nav ul > li {
		font-size: .8125rem;
	}
    .header_nav ul > li {
        width: calc(14.5% - 1px);
    }
    .header_nav ul > li:nth-of-type(2) {
        width: calc(22.5% - 1px);
    }
    
    .header_nav ul > li ul.subnav {
        top: 34px;
    }

}
@media screen and (max-width: 1024px){

	.header_bar {
		padding: 10px 15px;
	}
	.header_bar p {
		margin-top: 7px;
		font-size: 1.25vw;
	}
	.header_inner {
		margin-left: 0;
		width: 100%;
	}
	
	.search_form input[type="text"] {
		width: 12vw;
	}

    .header_nav ul > li {
		font-size: .75rem;
	}
	.header_nav ul > li:first-child {
		border-left: none;
	}
    
    .header_nav ul > li ul.subnav {
        top: 33px;
    }
	
}
@media screen and (max-width: 767px){
    .header_nav ul > li ul.subnav {
        display: none!important;
    }
}

/* mark */
.mark_new {
    margin-right: .3rem;
    padding: 0 .2rem;
    font-size: 75%;
    opacity: .75;
    animation: m_new 1.5s ease-in-out infinite alternate;
}
.mark_uc {
    margin-left: .1rem;
    opacity: .75;
    font-size: 75%;
}
@media screen and (max-width: 1280px){}
@media screen and (max-width: 1024px){
    .mark_new {
        font-size: 60%;
        margin-right: .5vw;
        padding: 0 .1vw;
    }
    .mark_uc {
        margin-right: .1vw;
    }
}
@media screen and (max-width: 767px){
    .mark_new {
        font-size: 75%;
        margin-right: 1vw;
        padding: 0 .5vw;
    }
    
}
@keyframes m_new {
    0% {
        color: rgba(188,63,85,1);
        background: #fff;
    }
    100% {
        color: #fff;
        background: rgba(188,63,85,1);
    }
}

/* nav */

.navFixed {
	position: fixed;
	top: 15px;
	left: 20px;
	z-index: 999;
}
nav {
	position: absolute;
	top: 100px;
	left: 20px;
	width: 180px;
	z-index: 99;
}
nav h1 {
	padding: 20px 15px;
	text-align: center;	
	background: #fff;
}
nav h1 img {
	width: 150px;
}
nav h1 span {
	display: block;
	margin-top: 10px;
	font-size: 1.125rem;
	font-weight: normal;
	line-height: 1.5;
}
nav ul {
	text-align: center;	
}
nav ul li {
    position: relative;
}
nav ul li a {
	display: block;
	margin-bottom: 1px;
	padding: 12px 0;
	background: rgba(159,137,187,.7);
	color: #fff;
	text-decoration: none;
}
nav ul li a:hover {
	color: #fff;
	background: rgba(159,137,187,1);
}
nav ul li.exam a {
	background: rgba(188,63,85,.7);
}
nav ul li.exam a:hover {
	background: rgba(188,63,85,1);
}

nav ul li ul.subnav {
    position: absolute;
    top: 0;
    left: 180px;
	width: 220px;
    margin-left: 1px;
}
nav ul li ul.subnav li a {
	background: rgba(159,137,187,.5);
}
nav ul li ul.subnav li a:hover {
	color: #fff;
	background: rgba(159,137,187,1);
}
nav ul li.exam ul.subnav li a {
	background: rgba(188,63,85,.5);
}
nav ul li.exam ul.subnav li a:hover {
	background: rgba(188,63,85,1);
}
nav ul li.exam ul.subnav {
    top: auto;
    bottom: -42px;
}
nav ul li.exam:last-child ul.subnav {
    bottom: -1px;
}

nav .fb {
    margin: 3vw 0;
    text-align: center;
}
nav .fb a img {
    width: 66px;
    transition: .3s;
}
nav .fb a:hover img {
    opacity: .7;
}

@media screen and (max-width: 1600px){
    nav .fb {
        margin: 2vw 0;
    }
    nav .fb a img {
        width: 55px;
    }    
}
@media screen and (max-width: 1280px){

	nav {
		width: 140px;
	}
	nav h1 {
		padding: 15px 0;
	}
	nav h1 img {
		width: 120px;
	}
	nav h1 span {
		margin-top: 10px;
		font-size: 1rem;
	}
	nav ul li a {
		font-size: .875rem;
		padding: 12px 0;
	}
	
    nav ul li ul.subnav {
        left: 140px;
        width: 200px;
    }    
    nav ul li.exam ul.subnav {
        bottom: -40px;
    }

    nav .fb {
        margin: 15px 0;
    }
    nav .fb a img {
        width: 44px;
    }
    
}

@media screen and (max-width: 1024px){
	
	.navFixed,
	nav {
		position: absolute;
		top: 95px;
		left: 15px;
		width: 120px;
	}
	nav h1 {
		padding: 1vw 0;
	}
	nav h1 img {
		width: 100px;
	}
	nav h1 span {
		font-size: .875rem;
	}
	nav ul li a {
		padding: 1.05vw 0;
	}

    nav ul li ul.subnav {
        left: 120px;
    }    
    nav ul li.exam ul.subnav {
        bottom: calc(-1rem - 2.1vw);
    }
    
    nav .fb {
        display: none;
    }
        
}

@media screen and (max-width: 767px){
    
    nav.top_nav {
        display: block!important;
    }
    nav ul li ul.subnav {
        display: none!important;
    }
}

@media screen and (min-width: 768px){
	.head_sp_frame {
		display: block!important;
	}
}


/*------ SP header, nav -----*/

@media screen and (max-width: 767px){
	
	html.sp_stop {
		overflow: hidden;
		height: 100%;
	}
	html.sp_stop .head_sp_frame {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.head_sp_frame {
		display: none;
	}
	#head_sp {
		display: block;
		position: fixed;
		background: #7A4E6E;
		width: 100%;
		z-index: 9999;
	}
	.sp_logo {
		position: relative;
		display: block;
		background: #7A4E6E;
		width: 100%;
		z-index: 998;
		height: 70px;
	}
	.sp_logo img {
		width: 60px;
		background: #fff;
		padding: 5px;
		line-height: 1;
	}
	#menu-icon {
		display: block;
		position: absolute;
		z-index: 999;
		top: 20px;
		right: 15px;
		width: 40px;
		height: 32px;
		cursor: pointer;
	}
	#menu-icon span {
		background: #fff;
		display: block;
		height: 3px;
		position: absolute;
		width: 100%;
	}
	#menu-icon span:nth-of-type(2) {
		top: 14px;
	}
	#menu-icon span:nth-of-type(3) {
		bottom: 0;
	}
	#menu-icon.active span:nth-of-type(1) {
		top: 14px;
		transform: rotate(45deg);
	}
	#menu-icon.active span:nth-of-type(2) {
		transform: scaleX(0);
	}
	#menu-icon.active span:nth-of-type(3) {
		bottom: 15px;
		transform: rotate(135deg);
	}
	
	.navFixed,
	nav {
		position: absolute;
		top: 70px;
		left: 0;
		width: 100%;
		background: none;
	}
	nav ul {
		display: flex;
		flex-wrap: wrap;
		text-align: center;	
	}
	nav ul li {
		width: 50%;
		box-sizing: border-box;
	}
	nav ul li a {
		margin-bottom: 0;
		padding: 20px 0;
		background: rgba(159,137,187,.95);
		border-bottom: 1px solid #ccc;
		font-size: .9375rem;
	}
	nav ul li a:hover {
		background: #a9b;
	}
	nav ul li:nth-of-type(2n) a {
		border-left: 1px solid #ccc;
	}	
	nav ul li:nth-of-type(9),
	nav ul li:nth-of-type(10) {
		display: none;
	}

	.header_nav ul {
		position: absolute;
		top: 294px;
		width: 100%;
		justify-content: flex-start;
		flex-wrap: wrap;
		background: rgba(122,78,110,.95);
	}
	.header_nav ul li {
		width: 50%;
		box-sizing: border-box;
		border-left: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
		font-size: .875rem;
		text-align: center;
	}
	.header_nav ul li:nth-of-type(2),
	.header_nav ul li:nth-of-type(5),
	.header_nav ul li:nth-of-type(6) {
		width: 50%;
	}
	.header_nav ul li:nth-of-type(3),
	.header_nav ul li:nth-of-type(5) {
		border-left: none;
	}
	.header_nav ul li a {
		padding: 18px 0;
	}
	.header_nav ul li:nth-of-type(7) a,
	.header_nav ul li:nth-of-type(8) a {
		background: rgba(188,63,85,.8);
	}
	
	.header_bar {
		display: block;
		position: absolute;
		top: 440px;
		height: 100px;
		margin: 0;
		padding: 50px 0 0;
		background: rgba(164,165,174,.9);
		color: #fff;
		width: 100%;
	}
	.header_bar p {
		line-height: 1.5;
		font-size: .6rem;
		text-align: center;
	}
	.search_form {
		position: absolute;
		top: 15px;
		width: 100%;
		text-align: center;
	}
	.search_form input[type="text"] {
		width: 40vw;
	}	
    .search_form input[type="submit"] {
        top: 0;
        height: auto;
        padding: .5vw 3vw;
    }
	
	nav h1 {
		position: absolute;
		width: 100%;
		top: 470px;
		margin: 0;
		padding: 0;
		color: #fff;
		text-align: center;
		background: none;
	}
	nav h1 br,
	nav h1 img {
		display: none;
	}
	
}
@media screen and (max-width: 369px){
    .header_nav ul li:nth-of-type(2) {
		font-size: .8125rem;
    }
}


/* footer */

footer {
	background: #ddd;
}
.footer_inner {
	margin-left: 240px;
	width: calc(100% - 240px);
}
.sitemap {
	display: flex;
	justify-content: space-between;
	padding: 50px 20px 80px 0;
}
.sitemap ul {
	width: 32%;
	border-top: 1px solid #7A4E6E;
}
.sitemap ul li {
	padding: 10px 0;
	border-bottom: 1px solid #7A4E6E;
}
.sitemap ul li.staff {
	margin-top: 54px;
	border-top: 1px solid #7A4E6E;
}
.sitemap ul li p {
	color: #7A4E6E;
	font-size: 1rem;
	line-height: 1.4;
}
.sitemap ul li p a {
	display: block;
	color: #7A4E6E;
	text-decoration: none;
}
.sitemap ul li p a:hover {
	color: #a79;
}
.sitemap ul li.sub {
	display: flex;
	justify-content: space-between;
}
.sitemap ul li.sub p {
	width: 35%;
}
.sitemap ul li.sub .sublink {
	width: 62%;
}
.sitemap ul li.sub .sublink p {
	width: 100%;
	padding: 0 0 5px;
}
.sitemap ul li.sub .sublink p a {
	color: #251E1C;
}
.sitemap ul li.sub .sublink p a:hover {
	color: #999;
}

.footer_nav {
	background: #7A4E6E;
}
.footer_nav ul {
	display: flex;
	justify-content: space-between;
}
.footer_nav ul li {
	width: calc(25% - 1px);
	border-left: 1px solid #fff;
	font-size: .875rem;
	text-align: center;
}
.footer_nav ul li a {
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 10px 0;
}
.footer_nav ul li a:hover {
	background: #968;
}
.copyright {
	padding: 10px 0;
	font-size: .875rem;
	line-height: 1.5;
	text-align: center;
}
.copyright span {
	margin-right: 1rem;
}

@media screen and (max-width: 1400px){

	.sitemap {
		padding: 40px 20px 60px 0;
	}
	.sitemap ul li p {
		font-size: .8125rem;
	}
	.sitemap ul li.staff {
        margin-top: 41px;
    }

	.footer_nav ul li {
		font-size: .8125rem;
	}

}

@media screen and (max-width: 1280px){

	.footer_inner {
		margin-left: 195px;
		width: calc(100% - 195px);
	}

}

@media screen and (max-width: 1024px){

	.footer_inner {
		margin-left: 0;
		width: 100%;
	}
	.sitemap {
		padding: 30px 15px 50px;
	}
	.sitemap ul {
		width: 32%;
	}
	.sitemap ul li p {
		font-size: .75rem;
	}
	.sitemap ul li.sub .sublink p {
		padding: 0 0 8px;
	}	
	.sitemap ul li.staff {
        margin-top: 4vw;
    }
	
	.footer_nav ul li:first-child {
		border-left: none;
	}
	.copyright {
		font-size: .75rem;
	}

}

@media screen and (max-width: 767px){
	
	.sitemap {
		flex-wrap: wrap;
	}
	.sitemap ul {
		width: 48.5%;
	}
	
	.footer_nav ul {
		flex-wrap: wrap;
	}
	.footer_nav ul li {
		width: calc(50% - 1px);
		font-size: .75rem;
	}
	.footer_nav ul li:nth-of-type(1),
	.footer_nav ul li:nth-of-type(2) {
		border-bottom: 1px solid #fff;
	}
	.footer_nav ul li:nth-of-type(3) {
		border-left: none;
	}
	.footer_nav ul li a {
		padding: 15px 0;
	}
	.copyright {
		padding: 28px 15px;
		font-size: .6rem;
		text-align: left;
	}

}
@media screen and (max-width: 567px){

	.sitemap {
		display: block;
		padding: 30px 15px;
	}
	.sitemap ul {
		width: 100%;
	}
	.sitemap ul:nth-of-type(2),
	.sitemap ul:nth-of-type(3) {
		border-top: none;
	}	
	.sitemap ul:nth-of-type(3) {
        margin-top: 0;
	}
	
	.footer_nav ul li {
		font-size: 3vw;
	}	
	.footer_nav ul li a {
		padding: 4vw 0;
	}
	.copyright {
		padding: 15px;
		height: 40px;
		font-size: 2.25vw;
	}
	.copyright span::after {
		content: "\A";
		white-space: pre;	
	}

}


/* main */

main {

}
.wrap {
	margin-left: 240px;
	width: calc(100% - 260px);
}

.morebtn a,
.upbtn a {
	display: block;
	position: relative;
	padding: 20px;
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
}
.morebtn a::after,
.upbtn a::after {
	display: block;
	content: "";
	position: absolute;
	bottom: -10px;
	left: calc(50% - 10px);
	width: 20px;
	height: 20px;
	border-top: solid 2px #777;
	border-right: solid 2px #777;
	-webkit-transform: rotate(135deg);
			transform: rotate(135deg);
}
.upbtn a::after {
	top: -10px;
	bottom: auto;
	-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
}

#pagetop {
	position: fixed;
	right: 20px;
	bottom: 90px;
	z-index: 999;
}
#pagetop a {
	display: block;
	width: 64px;
	height: 64px;
	background: #7A4E6E;
}
#pagetop a:hover {
	background: #968;
}
#pagetop a::after {
	display: block;
	content: "";
	position: absolute;
	top: 28px;
	left: calc(50% - 10px);
	width: 20px;
	height: 20px;
	border-top: solid 2px #fff;
	border-right: solid 2px #fff;
	-webkit-transform: rotate(-45deg);
			transform: rotate(-45deg);
}

.col1 {
	margin: 0 0 20px;
}
.col2,
.col3 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.col2 .col_box {
	width: calc(50% - 10px);
	margin-bottom: 20px;
}
.col3 .col_box {
	width: calc(33.33% - 10px);
	margin-bottom: 20px;
}

@media screen and (max-width: 1280px){
	
	.wrap {
		margin-left: 200px;
		width: calc(100% - 220px);
	}

	#pagetop {
		bottom: 85px;
	}

}

@media screen and (max-width: 1024px){
	
	.wrap {
		margin-left: 165px;
		width: calc(100% - 180px);
	}
	.wrap.tw {
		width: calc(100% - 30px);
		margin-left: 0;
		padding: 0 15px;
	}
	
	.morebtn a,
	.upbtn a {
		padding: 15px;
		font-size: .875rem;
	}

	#pagetop {
		right: 15px;
	}
	#pagetop a {
		width: 48px;
		height: 48px;
	}
	#pagetop a::after {
		top: 21px;
		left: calc(50% - 8px);
		width: 16px;
		height: 16px;
	}
	
	.col1 {
		margin: 0 0 15px;
	}
	.col2 .col_box {
		width: calc(50% - 8px);
		margin-bottom: 15px;
	}
	.col3 .col_box {
		width: calc(33.33% - 8px);
		margin-bottom: 15px;
	}

}

@media screen and (max-width: 767px){
	
	.ankerlink {
		position: relative;
	}
	.ankerlink a {
		position: absolute;
		top: -70px;
	}
	
	main {
		padding-top: 70px;
	}
	.wrap {
		width: calc(100% - 30px);
		margin-left: 0;
		padding: 0 15px;
	}

	.morebtn a,
	.upbtn a {
		font-size: .75rem;
	}	

	#pagetop {
		right: 15px;
		bottom: 15px;
	}
	#pagetop a {
		width: 40px;
		height: 40px;
	}
	#pagetop a::after {
		top: 17px;
		left: calc(50% - 7px);
		width: 14px;
		height: 14px;
	}
	
}

@media screen and (max-width: 567px){

	.col1 {
		margin: 0 0 15px;
	}
	.col3 {
		display: block;
	}
	.col2 .col_box,
	.col3 .col_box {
		width: 100%;
		margin-bottom: 15px;
	}

}