@charset "UTF-8";

/* --------------------------------------------------------------

	清光学園 受験生NAVI [基本CSS：スマホ用]
	/common/css/base_sp.css

-------------------------------------------------------------- */

/* ==================================================
	base
================================================== */

html {
	-webkit-text-size-adjust: 100%;
}
body {
	background: none;
}
img { max-width: 100%; }
a {
	/*-webkit-tap-highlight-color:rgba(0,0,0,0);*/
}


/* ==================================================
	group header
================================================== */

#fixed_header {
	position: fixed;
	width: 100%;
	border-top: solid 4px #7aa0ea;
	background: #fff;
	padding-bottom: 10px;
	z-index: 2010;
}

#group_header {
	height: auto;
	max-height: 97px;
	overflow: hidden;
	margin: 0 4%;
}

/* group_nav
------------------------------------------ */
#group_nav {
	margin: 0 3% 10px;
	padding-top: 0.5em;
	text-align: center;
}
#group_nav li {
	float: left;
	width: 49.5%;
	line-height: 1.5;
}
#group_nav li.nav01 {
	border-right: solid 1px #ccc;
}
#group_nav li a {
	background: none;
	text-indent: 0px;
	text-align: center;
}

/* search
------------------------------------------ */
#search {
	margin-top: 0;
	padding: 0;
	float: right;
	height: 24px;
	background: #eee;
}
#search form {
	width: 100%;
	height: 24px;
	line-height: 0;
}
#search p input {
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	border-radius: 0;
	line-height: 2.5em;
}
#search p.text {
	width: 87%;
	height: 24px;
}
#search p.text input {
	width: 100%;
	height: 24px;
	line-height: 24px;
	margin: 0;
	padding: 0;
}
#search p.button {
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
}
#search p.button input {
	width: 24px;
	height: 24px;
	margin: 0;
	padding: 0;
}


/* ==================================================
	header
================================================== */

#header {
	width: 100%;
	margin: 0;
	position: relative;
	border-bottom: solid 1px #cacaca;
}

@media screen and (min-width: 320px) and (max-width: 374px) {	/* iPhone4,5,5s */
#header {
	padding: 75px 0 0;
}
}
@media screen and (min-width: 375px) and (max-width: 413px) {	/* iPhone6 */
#header {
	padding: 75px 0 0;
}
}
@media screen and (min-width: 414px) and (max-width: 740px) {	/* iPhone6 Plus */
#header {
	padding: 80px 0 0;
}
}


#header_logo {
	float: left;
	width: 50%;
	max-width: 312px;
	margin: 0 0 12px 10px;
	z-index: 2005;
}

/* global_nav
------------------------------------------ */
#global_nav_open_btn {
	float: right;
	margin: 4px 15px 0 0;
	width: 8%;
	z-index: 2004;
}
#global_nav_open_btn a {
	display: block;
	background: url(../images/global_nav_open_btn.png) center no-repeat;
	background-size: contain;
}
.active#global_nav_open_btn a {
	background: url(../images/global_nav_close_btn.png) center no-repeat;
	background-size: contain;
}

.accordion {
	display: none;
	position: absolute;
	width: 100%;
	height: 3000px;
	background: #fff;
	z-index: 9999;
}
@media screen and (min-width: 320px) and (max-width: 374px) {	/* iPhone4,5,5s */
.accordion { top: 120px; }
}
@media screen and (min-width: 375px) and (max-width: 413px) {	/* iPhone6 */
.accordion { top: 125px; }
}
@media screen and (min-width: 414px) and (max-width: 740px) {	/* iPhone6 Plus */
.accordion { top: 134px; }
}

#global_nav {
	clear: both;
	width: 100%;
	border-bottom: solid 1px #cacaca;
}
#global_nav li {
	float: none;
	width: 100%;
	line-height: 3.5;
	border-top: solid 1px #cacaca;
}
#global_nav li a {
	display: block;
	margin: 0 15px;
	text-decoration: none;
	background: url(../images/header_sp/nav_arw_gr.png) right center no-repeat;
	background-size: 5px 7px;
}

/* global_nav spカレント表示
------------------------------------------ */
#message #global_nav li.nav01,#campus #global_nav li.nav02,#event #global_nav li.nav03 {
	background-color: #f2f2f2;
}


/* ==================================================
	pagetop
================================================== */

#pagetop_sp {
}
#pagetop_sp a {
	display: block;
	background: #7aa0ea;
	padding: 1em 0;
	text-align: center;
}


/* ==================================================
	footer_add
================================================== */

#footer_add {
	clear: both;
	margin: 0 0 11px;
	padding-top: 2em;
}
#footer_add p {
	float: none;
	width: 50%;
	margin: 0 auto;
	text-align: center;
}
#footer_add #footer_link {
	float: none;
	margin-top: 12px;
	border-top: solid 1px #9e9e9e;
	padding-top: 12px;
	text-align: center;
}
#footer_add #footer_link li {
	display: inline;
	margin: 0 20px;
}


/* ==================================================
	footer_nav
================================================== */

#footer_nav {
	display: none;
}


/* ==================================================
	copyright
================================================== */

#copyright {
	background: #808080;
}
#copyright p {
	width: 100%;
	margin: 0;
	text-align: center;
}


/* ==================================================
	content
================================================== */

#top #content_wrap {
	background: url(../images/body_bg_sp.png) center top no-repeat;
	background-size: 100% auto;
	position: relative;
}
#content_wrap #content {
	width: 100%;
}
#content_wrap #main_col {
	float: none;
	width: 100%;
	min-height: 100%;
	padding: 0;
	background: none;
}
#content_wrap #side_col {
	position: absolute;
	top: 0px;
	display: none;
	float: none;
	width: 100%;
	height: 100%;
	margin: -1px 0 0 0;
	border-bottom: solid 1px #cbcbcb;
	z-index: 4000;
	background: #fff;
}


/* ==================================================
	topic path
================================================== */

#topic_path {
	margin-top: -1px;
	background: none;
	padding-top: 0;
}
#topic_path ul {
	width: 100%;
}
#topic_path ul li {
	float: left;
	margin-left: -1em;
	background: url(../images/topic_path_arw.png) right center no-repeat;
	background-size: contain;
	padding: 0 1em 0 0;
	line-height: 3em;
}
#topic_path ul li#path_top {
	margin-left: 0;
	background: url(../images/topic_path_arw_top.png) right center no-repeat #cad9f7;
	background-size: contain;
}
#topic_path ul li.current {
	background: none;
}
#topic_path ul li a,
#topic_path ul li em {
	display: block;
	border-top: solid 1px #cacaca;
	padding: 0 0.5em 0 1.5em;
}
#topic_path ul li#path_top a {
	padding-left: 1em;
	color: #7aa0ea;
}
#topic_path ul li span {
	display: none;
}


/* ==================================================
	side nav
================================================== */

#side_nav_open_btn {
	position: absolute;
	top: -36px;
	right: 0px;
}
#side_nav_open_btn a {
	display: block;
	width: 60px;
	height: 36px;
	background: url(../images/side_nav_open_btn.png) center center no-repeat;
	background-size: 10px 7px;
}

.side_nav {
	border-top: solid 1px #ccc;
}
.side_nav li {
	line-height: 3.5;
	border-bottom: solid 1px #ccc;
}
.side_nav li a {
	display: block;
	margin-right: 15px;
	background: url(../images/header_sp/nav_arw_gr.png) right center no-repeat;
	background-size: 5px 7px;
	background-repeat: no-repeat;
	padding-left: 15px;
}
.side_nav li a:hover {
	background-color: #fff;
	text-decoration: none;
}
