@charset "utf-8";
/*******************************************************
MeySen Academy Copyright(c) All Rights Reserved.
*******************************************************/

/*****************************************************
	TOP
******************************************************/
/* Main Visual */
#pg-contact { background-image: linear-gradient(to bottom, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .3) 100%), url(../img/contact/mainVisual.jpg); }
#pg-visit { background-image: linear-gradient(to bottom, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .3) 100%), url(../img/contact/visit/mainVisual.jpg); }
/* --- No sideBer Layout ----------------- */
.bl-content-section-single {
	display: block;
	margin:0 auto;
}
.bl-content-section-single .bl-tabContent-wrap { justify-content: center; flex-direction: column; }

h3.hp-marBtm-l { text-align: center; }

/* --- TabMenu ----------------- */
.el-tabSelector {
    position: relative;
	display: block;
    padding: 2rem 3rem;
    font-weight: bold;
    color: #575757;
    cursor: pointer;
    transition: all .3s ease-in;
}

/* --- Card List Layout ----------------- */
.ly-contact-area {
	display: flex;
	justify-content: space-between;
}
	.ly-contact-campus { width: 32%; }
	.ly-contact-campus img { width: 100%; }
	.el-name { margin:.5em 0; font-size: 1.2rem; }

/* Campus Info */
.ly-contact-campus-info {
	width: 32%;
	padding:40px;
	color:#fff;
	font-size: .9rem;
	background-color: rgb(var(--season-sub-color));
}
	.el-title { margin:.5em 0; font-size: 1.2rem }
	.bl-campus-tel {
		margin:24px 0;
		padding:16px 0;
		border-top:solid 1px #fff;
		border-bottom:solid 1px #fff;
	}
		.bl-campus-tel p:first-child { margin-bottom:.5rem; }
		.bl-campus-tel a { color:#fff; }
		.bl-btn { margin: 24px auto; text-align: center; }
			.bl-btn a { width: 290px; }
			.bl-btn a:first-child { margin-bottom: 1rem; }

/* Parts */
h3.hp-head-large { font-size: 40px; }

.el-seperator {
	margin-bottom: 2.2rem;
	color: #fff;
}

.el-seperator {
	margin-bottom: 2.2rem;
	color: #fff;
}

.el-add-detail { margin-left:1rem; }
.el-map-link, .el-map-link:visited{
	padding-left:8px;
	color:rgb(var(--season-main-color));
	font-size: .9rem;
	font-weight: 600;
	transition: .3s;
}
.el-map-link:hover, .el-map-link:active { color:rgb(var(--season-sub-color)); }
.el-map-link::before { padding-right:8px; }

/* PageLink */
#contactAddress {
	overflow: hidden;
	width: 0;
	height: 0;
	margin-top:-380px;
	padding-top:380px;
}
#contactForm {
	overflow: hidden;
	width: 0;
	height: 0;
	margin-top:-180px;
	padding-top:180px;
}

/*****************************************************
	Mobile
******************************************************/
@media (max-width : 1200px) {
	/* --- Card List Layout ----------------- */
	.ly-contact-area { flex-wrap: wrap; }
	.ly-contact-campus { width: 49%; }
	.ly-contact-campus-info { width: 100%; margin-top:3rem; }

	.bl-btn { display: flex; justify-content: center; }
		.bl-btn a:first-child { margin-right:1rem; margin-bottom: 0; }
}
@media (max-width : 768px) {
	.ly-listCard-item{	margin: 0 8px 24px;	}
}
@media (max-width : 640px) {
	#pg-contact { background-image: linear-gradient(to bottom, rgba(0, 0, 0, .4) 0%, rgba(0, 0, 0, .4) 100%), url(../img/contact/sp-mainVisual.jpg); }
  #pg-visit { background-image: linear-gradient(to bottom, rgba(0, 0, 0, .4) 0%, rgba(0, 0, 0, .4) 100%), url(../img/contact/visit/sp-mainVisual.jpg); }

	.ly-contact-campus { width: 100%; margin-bottom:2rem; }
	.ly-contact-campus-info { margin-top: 0; margin-bottom: 2rem; }
	.bl-btn { flex-direction: column; align-items: center; }
		.bl-btn a:first-child { margin-right:0; margin-bottom: 1rem; }
}

@media (max-width : 480px) {
	.el-add-detail {
		display: block;
		margin-left:0;
	}
}