@charset "utf-8";
/* CSS Document */

/*-----------------------------------------------
sky   #82D2E6
blue  #4B9BE1
brown #5A3C00
-----------------------------------------------*/

/*-----------------------------------------------
  font
-----------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
/* font-family: "Noto Sans JP", sans-serif; */
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400&display=swap");
/* font-family: "Noto Serif JP", serif; */
@import url("https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@400;500&display=swap");
/* font-family: "Kiwi Maru", serif; */
@import url("https://fonts.googleapis.com/css2?family=Kanit:wght@400;700&display=swap");
/* font-family: "Kanit", sans-serif; */
@import url("https://fonts.googleapis.com/css2?family=Rubik&display=swap");
/* font-family: "Rubik", sans-serif; */

/*-----------------------------------------------
  text
-----------------------------------------------*/
body {
font-size: 16px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
line-height: 1.5;
/* font-feature-settings: "palt"; */
color: #151515;
}
input,
textarea {
font-size: 16px;
font-family: "Noto Sans JP", sans-serif;
font-weight: 400;
line-height: 1.5;
}
a {
color: inherit;
text-decoration: none;
transition: 0.2s;
}
a img {
transition: 0.2s;
}
a:hover {
text-decoration: none;
}
img {
display: block;
max-width: 100%;
}


/*-----------------------------------------------
  layout
-----------------------------------------------*/
header {
position: -webkit-sticky;
position: sticky;
top: 0;
z-index: 1000;
width: 100%;
background-color: #FFF;
box-shadow: 0 0 4px rgba(0,0,0,0.1);
}

/*-----------------------------------------------
  header
-----------------------------------------------*/
header .inner {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px 4%;
background-color: #82D2E6;
}
header .logo {
margin: 0 auto;
font-family: "Kiwi Maru", serif;
font-size: 2em;
font-weight: 500;
line-height: 1.2;
color: #FFF;
}
header .logo a {
color: #FFF;
}
header .menu {
display: none;
}
@media screen and (max-width: 1024px) {
	header .inner {
	background-color: #FFF;
	}
	header .logo {
	margin: 0 auto 0 0;
	color: #82D2E6;
	}
	header .logo a {
	color: #82D2E6;
	}
}
@media screen and (max-width: 640px) {
	header .inner {
	padding: 4vw 4%;
	}
	header .logo {
	margin: 0 auto 0 0;
	font-size: 5.25vw;
	}
}

/*-----------------------------------------------
  bread
-----------------------------------------------*/
#bread {
padding: 0.5em 4%;
background-color: #F5F5F5;
}
#bread ul {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
max-width: 1000px;
margin: 0 auto;
}
#bread li {
font-size: 0.8em;
}
#bread li:not(:first-child):before {
content: "　>　";
}
#bread a {
text-decoration: underline;
}
@media screen and (max-width: 640px) {
	#bread {
	display: none;
	}
}

/*-----------------------------------------------
  footer
-----------------------------------------------*/
footer {
}
footer h2 {
width: 10em;
max-width: 100%;
margin: 0 auto;
font-family: "Kanit", "Kiwi Maru", sans-serif;
font-size: 2em;
font-weight: 500;
line-height: 1.25;
letter-spacing: 0.1em;
text-align: center;
color: #5A3C00;
overflow: hidden;
}
footer h2 span {
position: relative;
display: inline-block;
padding: 0 0.5em;
text-align: left;
}
footer h2 span:before,
footer h2 span:after {
position: absolute;
top: 50%;
content: "";
width: 100%;
height: 2px;
background-color: #5A3C00;
}
footer h2 span:before {
right: 100%;
}
footer h2 span:after {
left: 100%;
}
footer hr {
border-color: #CCC;
}
@media screen and (max-width: 640px) {
	footer {
	padding-bottom: 4em;
	}
	footer h2 {
	font-size: 1.5em;
	}
	footer hr {
	border-color: #5A3C00;
	}
}

/* sns */
footer .sns {
padding: 60px 4% 30px 4%;
}
footer .sns .inner {
max-width: 800px;
margin: 0 auto;
}
footer .sns ul {
display: flex;
justify-content: center;
margin-top: 2%;
}
footer .sns li {
width: 15%;
max-width: 60px;
margin: 0 1%
}
footer .sns a:hover img{
opacity: 0.8;
}
@media screen and (max-width: 640px) {
	footer .sns {
	padding: 10% 4% 4% 4%;
	}
	footer .sns li {
	margin: 0 1.5%
	}
}

/* link */
footer .link {
padding: 30px 4%;
background-color: #FFFFF5;
}
@media screen and (max-width: 640px) {
	footer .link {
	padding: 4%;
	}
}

/* link_group */
footer .link_group {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 1000px;
margin: 0 auto;
}
footer .link_group li {
width: calc(50% - 5px);
margin: 5px 0;
}
footer .link_group li a {
display: block;
padding: 1em 0;
font-family: "Kiwi Maru", serif;
text-align: center;
color: #FFF;
background-color: #5A3C00;
border-radius: 0.5em;
}
footer .link_group li a:hover {
opacity: 0.8;
}
@media screen and (max-width: 640px) {
	footer .link_group li {
	width: 49%;
	margin: 1% 0;
	font-size: 0.85em;
	}
}

/* link_other */
footer .link_other {
display: flex;
display: none;
flex-wrap: wrap;
justify-content: center;
max-width: 1000px;
margin: 0 auto;
margin-top: 30px;
}
footer .link_other li {
margin: 0 1em;
}
footer .link_other a {
color: #5A3C00;
}
footer .link_other a:hover {
text-decoration: underline;
}
@media screen and (max-width: 640px) {
	footer .link_other {
	display: block;
	display: none;
	text-align: left;
	margin-top: 5%;
	}
	footer .link_other li {
	margin: 0;
	}
}

/* college */
footer .college {
padding: 30px 4% 60px 4%;
background-color: #FFF;
}
@media screen and (max-width: 640px) {
	footer .college {
	padding: 4% 4% 8% 4%;
	}
}

/* college_data */
footer .college_data {
max-width: 1000px;
margin: 0 auto;
margin-bottom: 30px;
text-align: center;
color: #5A3C00;
}
footer .college_data a {
color: #5A3C00;
}
footer .college_data dt {
font-size: 1.25em;
}
footer .college_data .address {
margin-top: 0.5em;
}
footer .college_data .tel,
footer .college_data .fax {
display: inline-block;
}
footer .college_data .tel {
margin-right: 1em;
}
@media screen and (max-width: 640px) {
	footer .college_data {
	margin-bottom: 4%;
	text-align: left;
	}
}

/* college_menu */
footer .college_menu {
display: flex;
justify-content: space-between;
align-items: stretch;
max-width: 1000px;
margin: 0 auto;
margin-top: 30px;
}
footer .college_menu li {
width: calc(25% - 10px);
background-color: rgba(130,210,230,1);
border-radius: 7.5px;
transition: 0.2s;
}
footer .college_menu li a {
display: block;
padding: 4.25em 0.5em 0.75em 0.5em;
line-height: 1.2;
text-align: center;
color: #FFF;
background-position: center top 0.75em;
background-size: 3em;
background-repeat: no-repeat;
}
footer .college_menu li:hover {
opacity: 0.8;
}
footer .college_menu .icon_opencampus {
padding-top: 3.5em;
background-image: url("../img/common/ico_opencampus.png");
}
footer .college_menu .icon_request {
background-image: url("../img/common/ico_request.png");
}
footer .college_menu .icon_access {
background-image: url("../img/common/ico_access.png");
}
footer .college_menu .icon_contact {
background-image: url("../img/common/ico_contact.png");
}
@media screen and (max-width: 640px) {
	footer .college_menu {
	position: fixed;
	bottom: -4em;
	left: 0;
	z-index: 900;
	width: 100%;
	margin-top: 0;
	transition: 0.5s;
	}
	footer .college_menu li {
	width: 25%;
	font-size: 0.65em;
	border-radius: 0;
	}
	footer .college_menu li:not(:first-child) {
	border-left: 1px solid rgba(255,255,255,0.5);
	}
	footer .college_menu li:hover {
	opacity: 1;
	}
}

/* copyright */
footer .copyright {
margin-top: 30px;
padding: 0 4%;
font-size: 0.65em;
text-align: center;
}
@media screen and (max-width: 640px) {
	footer .copyright {
	font-size: 0.65em;
	}
}

/* pagetop */
footer .pagetop {
margin-top: 30px;
font-family: "Kanit", sans-serif;
font-size: 0.85em;
text-align: center;
}
footer .pagetop a {
display: block;
max-width: 12em;
margin: 0 auto;
padding: 1.25em 1em;
color: #FFF;
background-color: #82D2E6;
border-radius: 2em;
}
footer .pagetop span:before {
content: "▲";
margin-right: 0.5em;
}
footer .pagetop a:hover {
opacity: 0.8;
}

/* fixed */
@media screen and (max-width: 640px) {
	footer.fixed .college_menu {
	bottom: 0;
	}
}



