@charset "utf-8";
/* Responsive foundation */

html {
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
}

*,
*:before,
*:after {
	box-sizing: inherit;
}

img,
object,
embed,
iframe {
	max-width: 100%;
}

img {
	height: auto;
}

table {
	max-width: 100%;
}

#global-menu-toggle {
	display: none;
}

#global-navi ul li.gn-sub {
	display: none;
}

@media screen and (max-width: 960px) {
	body {
		min-width: 0;
	}

	#wrapper,
	#foot-navi .inner,
	footer .inner,
	#error404 {
		width: auto;
		max-width: 960px;
		margin-right: 12px;
		margin-left: 12px;
	}

	#main-area {
		width: 68%;
	}

	#side-area {
		width: 29%;
	}

	#main-area,
	#side-area {
		max-width: 100%;
	}

	#pgttl img {
		width: 100%;
		max-width: 100%;
	}

	#local-navi h3 img,
	#side-contact,
	.widget-container,
	.xo-month-wrap {
		max-width: 100%;
	}

	#side-contact {
		width: 100%;
		background-size: 100% auto;
	}

	#side-contact dl .mail-c {
		width: 86.6667%;
		left: 6.6667%;
	}

	#side-contact dl .mail-c img {
		width: 100%;
	}

	.xo-month-wrap,
	.xo-month-wrap .xo-month {
		width: 100%;
	}

	.xo-month-wrap table {
		display: table;
		width: 100%;
		overflow: visible;
		table-layout: fixed;
	}

	div.page-list,
	div.page-list .listbox-wrapp,
	.contact section div.btn,
	.contact section div.btn ul {
		width: auto;
	}

	div.page-list .listbox-wrapp section,
	.contact section div.btn ul li {
		max-width: 100%;
	}

	.contact section div.btn ul li img {
		width: 100%;
	}

	.contact form table,
	.contact form table tbody,
	.contact form table tr,
	.contact form table th,
	.contact form table td,
	.mhpro form table,
	.mhpro form table tbody,
	.mhpro form table tr,
	.mhpro form table th,
	.mhpro form table td,
	.idneo form table,
	.idneo form table tbody,
	.idneo form table tr,
	.idneo form table th,
	.idneo form table td,
	.phase01 table,
	.phase01 table tbody,
	.phase01 table tr,
	.phase01 table th,
	.phase01 table td,
	.phase02 table,
	.phase02 table tbody,
	.phase02 table tr,
	.phase02 table th,
	.phase02 table td {
		display: block;
		width: auto;
	}

	.contact form table,
	.mhpro form table,
	.idneo form table,
	.phase01 table,
	.phase02 table {
		overflow: visible;
		border-right: solid 1px #999;
	}

	.contact table.inquiry th,
	.contact table.inquiry th.mst,
	.mhpro form table th,
	.mhpro form table th.mst,
	.idneo form table th,
	.idneo form table th.mst,
	.phase01 table th,
	.phase02 table th,
	.phase02 table th.mst {
		width: auto;
		padding-right: 12px;
		background-position: right 12px top 10px;
	}

	form#mailformpro input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
	form#mailformpro textarea,
	form#mailformpro select,
	.contact form textarea,
	.contact form select,
	.mhpro form textarea,
	.mhpro form select,
	.idneo form textarea,
	.idneo form select {
		max-width: 100%;
	}

	form#mailformpro input[type="email"],
	form#mailformpro input[size="40"],
	form#mailformpro input[size="50"],
	form#mailformpro textarea,
	.contact form textarea,
	.mhpro form textarea,
	.idneo form textarea {
		width: 100%;
	}

	#foot-navi .inner #bottom-menu ul li,
	#foot-navi .inner #fnavi .fnv {
		width: 25%;
	}

	#foot-navi .inner #fnavi .fnv {
		padding-right: 12px;
	}

	#image-navigation {
		width: 100%;
		height: auto;
		padding: 0;
		background-size: 100% auto;
	}

	#image-navigation > div,
	#image-navigation img {
		width: 100%;
	}

	#recommend-course .inner {
		width: auto;
	}

	#recommend-course .inner .link-box {
		width: 31.8%;
		margin-right: 2.3%;
	}

	#recommend-course .inner .link-box:last-child {
		margin-right: 0;
	}

	#recommend-course .inner .link-box h2 img {
		width: 100%;
	}

	.course-list-wrapp .inner,
	.entry-info .inner ul,
	.trial-info .inner ul,
	#archi-courses ul,
	.mh-course div.detail-archi div.inner,
	.mh-course-open div.detail-archi div.inner,
	.id-course div.detail-archi div.inner {
		width: auto;
	}

	.entry-info .inner ul li,
	.trial-info .inner ul li {
		width: 48%;
		margin-right: 4%;
	}

	.entry-info .inner ul li:nth-child(2n),
	.trial-info .inner ul li:nth-child(2n) {
		margin-right: 0;
	}

	.entry-info .inner ul li img,
	.trial-info .inner ul li img,
	.course-list-wrapp .inner .link-box h4 img,
	#archi-courses ul li img {
		width: 100%;
	}

	.mh-course div.detail-archi div.inner dl,
	.mh-course-open div.detail-archi div.inner dl,
	.id-course div.detail-archi div.inner dl {
		padding-right: 0;
	}

	.mh-course div.detail-archi div.inner dl dd ol,
	.mh-course-open div.detail-archi div.inner dl dd ol,
	.id-course div.detail-archi div.inner dl dd ol {
		width: auto;
	}

	.mh-course div.detail-archi div.inner dl dd ol li,
	.mh-course-open div.detail-archi div.inner dl dd ol li,
	.id-course div.detail-archi div.inner dl dd ol li {
		float: none;
		width: auto;
		margin-right: 0;
	}
}

@media screen and (max-width: 768px) {
	#wrapper,
	#foot-navi .inner,
	footer .inner,
	#error404 {
		margin-right: 10px;
		margin-left: 10px;
	}

	#header {
		height: auto;
		padding-top: 14px;
		overflow: visible;
	}

	#header #site-title,
	#header #primary-navi,
	#header #primary-tel {
		position: static;
		width: auto;
		height: auto;
	}

	#header #site-title {
		margin-bottom: 12px;
	}

	#header #site-title a {
		width: 100%;
		max-width: 394px;
		height: 68px;
		background-size: contain;
	}

	#header #primary-navi {
		display: none;
	}

	#header #primary-tel {
		margin-bottom: 14px;
		padding: 8px 10px;
		color: #9C051C;
		background: #FFF4F4 none;
		border: solid 1px #FFB3B3;
		text-indent: 0;
		line-height: 1.5;
		font-weight: bold;
	}

	#global-navi {
		overflow: hidden;
		margin-bottom: 14px;
	}

	#global-menu-toggle {
		display: block;
		width: 100%;
		min-height: 46px;
		margin: 0 0 1px;
		padding: 10px 42px 10px 14px;
		position: relative;
		color: #FFF;
		background: #9C051C;
		border: none;
		text-align: left;
		letter-spacing: 0.08em;
		font: inherit;
		font-weight: bold;
		cursor: pointer;
	}

	#global-menu-toggle:after {
		content: "";
		width: 10px;
		height: 10px;
		position: absolute;
		top: 50%;
		right: 18px;
		border-right: solid 2px #FFF;
		border-bottom: solid 2px #FFF;
		transform: translateY(-65%) rotate(45deg);
	}

	#global-menu-toggle.is-open:after {
		transform: translateY(-20%) rotate(225deg);
	}

	.js #global-navi {
		display: none;
	}

	.js #global-navi.is-open {
		display: block;
	}

	#global-navi ul {
		display: block;
	}

	#global-navi ul li {
		float: none;
		display: block;
		width: 100%;
	}

	#global-navi ul li.gn-sub {
		display: block;
	}

	#global-navi ul li a {
		width: auto;
		height: auto;
		min-height: 44px;
		padding: 11px 14px;
		color: #9C051C;
		background: #FFF4F4 none;
		border-right: solid 1px #FFB3B3;
		border-bottom: solid 1px #FFB3B3;
		border-left: solid 1px #FFB3B3;
		text-align: left;
		text-indent: 0;
		text-decoration: none;
		font-weight: bold;
		line-height: 1.4;
	}

	#global-navi ul li a:hover,
	body.school #global-navi ul #gn01 a,
	body.admission #global-navi ul #gn02 a,
	body.courses #global-navi ul #gn03 a,
	body.testing-center #global-navi ul #gn04 a,
	body.faq #global-navi ul #gn05 a,
	body.contact #global-navi ul #gn06 a {
		color: #FFF;
		background: #CC1831 none;
	}

	#main-area,
	#side-area,
	.float-left,
	.float-right {
		float: none;
	}

	#main-area,
	#side-area {
		width: 100%;
	}

	#side-area {
		margin-top: 28px;
	}

	#local-navi {
		max-width: 360px;
		margin-right: auto;
		margin-left: auto;
	}

	#local-navi h3 img {
		width: 100%;
	}

	#side-area .widget-container,
	.xo-month-wrap {
		width: 100%;
		max-width: 360px;
		margin-right: auto;
		margin-left: auto;
	}

	#side-contact {
		width: 100%;
		max-width: 360px;
		height: auto;
		min-height: 0;
		margin-right: auto;
		margin-left: auto;
		padding: 16px;
		overflow: visible;
		background: #FFF none;
		border: solid 4px #D9868E;
	}

	#side-contact .hgr {
		height: auto;
		margin: -16px -16px 14px;
		padding: 12px 14px;
		color: #FFF;
		background: #CC1831;
		text-indent: 0;
		text-align: center;
	}

	#side-contact .hgr h2 {
		margin-bottom: 2px;
		font-size: 125%;
		line-height: 1.3;
	}

	#side-contact .hgr p {
		font-size: 87.5%;
		line-height: 1.4;
	}

	#side-contact dl .mail-t,
	#side-contact dl .tel-t {
		height: auto;
		position: static;
		margin-bottom: 8px;
		color: #333;
		text-indent: 0;
		font-weight: bold;
		line-height: 1.5;
	}

	#side-contact dl .mail-c,
	#side-contact dl .tel-c {
		width: auto;
		height: auto;
		position: static;
		margin-bottom: 12px;
		overflow: visible;
		text-indent: 0;
		line-height: 1.6;
	}

	#side-contact dl .mail-c {
		text-align: center;
	}

	#side-contact dl .mail-c img {
		width: 100%;
		max-width: 260px;
	}

	#to-top {
		text-align: center;
	}

	#foot-navi .inner #bottom-menu ul li,
	#foot-navi .inner #fnavi .fnv {
		float: none;
		width: 100%;
	}

	#foot-navi .inner #bottom-menu ul li a {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	footer .inner {
		padding-right: 10px;
		padding-left: 10px;
		text-align: center;
	}

	table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	.contact form table,
	.contact form table tbody,
	.contact form table tr,
	.contact form table th,
	.contact form table td,
	.mhpro form table,
	.mhpro form table tbody,
	.mhpro form table tr,
	.mhpro form table th,
	.mhpro form table td,
	.idneo form table,
	.idneo form table tbody,
	.idneo form table tr,
	.idneo form table th,
	.idneo form table td,
	.phase01 table,
	.phase01 table tbody,
	.phase01 table tr,
	.phase01 table th,
	.phase01 table td,
	.phase02 table,
	.phase02 table tbody,
	.phase02 table tr,
	.phase02 table th,
	.phase02 table td {
		display: block;
		width: auto;
	}

	.contact form table,
	.mhpro form table,
	.idneo form table,
	.phase01 table,
	.phase02 table {
		overflow: visible;
		border-right: solid 1px #999;
	}

	.contact form table th,
	.mhpro form table th,
	.idneo form table th,
	.phase01 table th,
	.phase02 table th {
		padding: 8px 12px;
		border-bottom: none;
	}

	.contact table.inquiry th,
	.contact table.inquiry th.mst,
	.mhpro form table th,
	.mhpro form table th.mst,
	.idneo form table th,
	.idneo form table th.mst,
	.phase01 table th,
	.phase02 table th,
	.phase02 table th.mst {
		width: auto;
		padding-right: 12px;
		background-position: right 12px top 10px;
	}

	.contact form table td,
	.mhpro form table td,
	.idneo form table td,
	.phase01 table td,
	.phase02 table td {
		padding: 10px 12px 14px;
	}

	form#mailformpro input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
	form#mailformpro textarea,
	form#mailformpro select,
	.contact form textarea,
	.contact form select,
	.mhpro form textarea,
	.mhpro form select,
	.idneo form textarea,
	.idneo form select,
	.phase01 input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
	.phase01 textarea,
	.phase01 select,
	.phase02 input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
	.phase02 textarea,
	.phase02 select {
		max-width: 100%;
	}

	form#mailformpro input[type="email"],
	form#mailformpro input[size="40"],
	form#mailformpro input[size="50"],
	form#mailformpro textarea,
	.contact form textarea,
	.mhpro form textarea,
	.idneo form textarea {
		width: 100%;
	}

	form#mailformpro input[size="15"],
	form#mailformpro input[size="16"] {
		width: 38%;
	}

	form#mailformpro select {
		margin-bottom: 6px;
	}

	form#mailformpro label {
		display: inline-block;
		max-width: 100%;
		line-height: 1.6;
	}

	.mfp_buttons {
		text-align: center;
	}

	.mfp_buttons button {
		max-width: 100%;
		margin-bottom: 8px;
		white-space: normal;
	}

	#image-navigation {
		margin-top: 0;
	}

	#recommend-course {
		overflow: visible;
	}

	#recommend-course .inner .link-box {
		float: none;
		width: 100%;
		margin-right: 0;
		margin-bottom: 14px;
	}

	#recommend-course .inner .link-box h2 {
		margin-bottom: 10px;
	}

	#recommend-course .inner .link-box h2 img {
		width: 100%;
	}

	#news .content {
		max-height: none;
		padding-left: 0;
	}

	#news #news-list dl dt,
	#news #news-list dl dd {
		float: none;
		width: auto;
		margin-left: 0;
		padding-right: 0;
		padding-left: 0;
	}

	#news #news-list dl dt {
		padding-bottom: 4px;
		font-weight: bold;
	}

	#news #news-list dl dd {
		padding-top: 0;
	}

	div.page-list,
	div.page-list .listbox-wrapp,
	.contact section div.btn,
	.contact section div.btn ul,
	.course-list-wrapp .inner,
	.entry-info .inner ul,
	.trial-info .inner ul,
	#archi-courses ul {
		width: auto;
	}

	div.page-list .listbox-wrapp,
	.course-list-wrapp {
		overflow: visible;
	}

	div.page-list .listbox-wrapp section,
	.contact section div.btn ul li,
	.course-list-wrapp .inner .link-box,
	.entry-info .inner ul li,
	.trial-info .inner ul li,
	#archi-courses ul li {
		float: none;
		width: 100%;
		margin-right: 0;
		margin-left: 0;
	}

	div.page-list .listbox-wrapp section,
	.contact section div.btn ul li,
	.course-list-wrapp .inner .link-box,
	#archi-courses ul li {
		margin-bottom: 16px;
	}

	.contact section div.btn ul li img,
	.course-list-wrapp .inner .link-box h4 img,
	#archi-courses ul li img {
		width: 100%;
	}

	.course-list-wrapp .inner .link-box {
		padding-bottom: 52px;
	}

	.course-list-wrapp .inner .link-box .detail-btn {
		left: 50%;
		transform: translateX(-50%);
	}

	.course-info p.lead img,
	#feature section p img,
	.mosflow ol li img {
		float: none;
		display: block;
		width: 100%;
		margin: 0 0 12px;
		padding-left: 0;
	}

	#about-school dl dt,
	#about-school dl dd,
	#lec-info section .detail,
	#staff-info section .detail,
	#lec-info section .lec-pic,
	#staff-info section .lec-pic,
	.mosflow ol li dl {
		float: none;
		width: auto;
		margin-left: 0;
	}

	#lec-info section .lec-pic,
	#staff-info section .lec-pic {
		max-width: 150px;
		height: auto;
		margin-bottom: 12px;
	}

	#lec-info section .lec-pic img,
	#staff-info section .lec-pic img {
		width: 100%;
	}

	#about-school dl dt {
		padding-bottom: 0.2em;
	}

	#about-school dl dd {
		padding-top: 0.2em;
	}

	.mh-course div.detail-archi div.inner,
	.mh-course-open div.detail-archi div.inner,
	.id-course div.detail-archi div.inner {
		width: auto;
		padding: 16px;
	}

	.mh-course div.detail-archi div.inner dl,
	.mh-course-open div.detail-archi div.inner dl,
	.id-course div.detail-archi div.inner dl {
		padding-right: 0;
	}

	.mh-course div.detail-archi div.inner dl dt,
	.mh-course-open div.detail-archi div.inner dl dt,
	.id-course div.detail-archi div.inner dl dt,
	.mh-course div.detail-archi div.inner dl dd,
	.mh-course-open div.detail-archi div.inner dl dd,
	.id-course div.detail-archi div.inner dl dd {
		float: none;
		width: auto;
		margin-left: 0;
		padding: 12px 0;
	}

	.mh-course div.detail-archi div.inner dl dd ol,
	.mh-course-open div.detail-archi div.inner dl dd ol,
	.id-course div.detail-archi div.inner dl dd ol {
		width: auto;
	}

	.mh-course div.detail-archi div.inner dl dd ol li,
	.mh-course-open div.detail-archi div.inner dl dd ol li,
	.id-course div.detail-archi div.inner dl dd ol li {
		float: none;
		width: auto;
		margin-left: 1.5em;
	}
}

@media screen and (max-width: 480px) {
	#wrapper,
	#foot-navi .inner,
	footer .inner,
	#error404 {
		margin-right: 8px;
		margin-left: 8px;
	}

	.thd3 {
		padding: 12px 14px;
		line-height: 1.4;
		font-size: 125%;
	}

	.thd4 em {
		padding-right: 12px;
		padding-left: 12px;
	}

	#header #site-title a {
		max-width: 320px;
		height: 56px;
	}

}