@charset "UTF-8";

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

 common.css
 
 Copyright (C) Ichizu

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

/* root
================================================================================*/
:root {
	--color-blue: #0082cd;
	--color-blue-dark: #165f98;
	--color-red: #e50012;
	--color-red-dark: #a80e20;
	--color-green: #009c45;
	--color-green-dark: #006934;
	--color-hover: #fff100;
	--color-warning: #f00;
}

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

 デバイス別スタイル / スマートフォン（差分のみ）
 
------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 768px) {

	/* general layout
	================================================================================*/
	/* common
	------------------------------------------------*/
	.sp {
		display: block;
	}
	span.sp {
		display: inline-block;
	}
	.sp360 {
		display: none;
	}
	.pc {
		display: none;
	}
	.pc.tb {
		display: none;
	}
		
	/* body
	================================================================================*/
	body {
		margin: 0;
		font-size: 1.4rem;
	}
	
	/* a
	------------------------------------------------*/
	a[href^="tel:"]:link {
		text-decoration: underline;
		cursor: pointer;
	}
	
	/* p, dl
	------------------------------------------------*/
	p,
	dl {
		margin-bottom: 30px;
	}
	
	/* text
	------------------------------------------------*/
	.f-xl { font-size: 2.0rem; }
	.f-l { font-size: 1.6rem; }
	.f-base { font-size: 1.4rem; }
	.f-s { font-size: 1.2rem; }
	.f-xs { font-size: 1.0rem; }
	
	/* col
	------------------------------------------------*/
	.col4 li {
		width: 49%;
	}
	
	/* list
	------------------------------------------------*/
	.checkList > li {
		padding: 0 0 0 26px;
	}
	.checkList > li:before {
		top: .2rem;
		font-size: 1.8rem;
	}

	
	
	/* button
	------------------------------------------------*/
	.btn a {
		width: 90%;
		padding: 15px;
		margin-left: auto;
		margin-right: auto;
	}
	.btn a .pc,
	.btn a .pc.tb {
		display: none;
	}

	.btn a:after {
		font-size: 1.8rem;
	}
	.btn a:focus:after {
		right: 4px;
	}
	
	/* submit */
	[type="submit"] {
		display: block;
		width: 90%;
		margin: 0 auto;
		padding: 0 20px;
		font-size: 1.8rem;
	}
	
	/* header
	================================================================================*/
	.header .logo {
		width: 220px;
	}
	
	
	/* main
	================================================================================*/
	#main {
		padding: 0 0 30px;
	}
	
	/* wrap
	------------------------------------------------*/
	.wrap {
		padding: 0 0 60px;
	}
	.breadcrumbs + .wrap {
		padding-top: 40px;
	}
	.inner {
		width: 100%;
		padding: 0 5%;	
	}
	
	/* infoWrap
	------------------------------------------------*/
	.infoWrap .inner {
		width: 90%;
		margin: 0 auto;
		padding: 30px;
	}
	.infoWrap .inner h2 {
		margin: -45px 0 30px;
		font-size: 2.4rem;
	}
	.infoWrap .inner h2 span {
		padding: 0 10px;
	}

	/* breadcrumbs
	------------------------------------------------*/
	.breadcrumbs {
		width: 96%;
		margin: 10px auto;
	}
	.breadcrumbs ul {
		font-size: 1.2rem;
		letter-spacing: 0;
	}
	.breadcrumbs li {
		margin: 0;
		line-height: 1;
	}
	.breadcrumbs li:not(:first-of-type) a {
		padding: 0 5px 0 10px;
	}
	.breadcrumbs li:first-of-type a {
		display: block;
		position: relative;
		width: 20px;
		padding: 0;
	}
	.breadcrumbs li:first-of-type a .material-icons {
		position: absolute;
		top: -1px;
		left: 0;
		font-size: 1.4rem;
	}
	.breadcrumbs li:not(:first-of-type) a:before {
		top: 2px;
		left: 0;
	}
	.breadcrumbs li:first-of-type a:before {
		display: none;
	}
	
	/* title
	------------------------------------------------*/
	.title {
		margin: 0 0 40px;
		padding: 0 5%;
	}
	.title .titleTxt {
		margin: 0;
		padding-top: calc( 80px * 538 / 600 + 20px );
		font-size: 2.4rem;
	}
	.title .titleTxt span {
		margin: 10px 0 0;
		padding: 20px 0 0;
		font-size: 1.6rem;
	}
	.title .titleTxt:before {
		width: 80px;
		height: calc( 80px * 538 / 600 );
		background-size: 80px auto;
	}
	
	/* simple title
	------------------------------------------------*/
	.title.simple {
		padding: 20px 0;
	}
	
	/* pageLink
	------------------------------------------------*/
	.pageLink {
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		width: 96%;
		margin: -20px auto 20px;
	}
	.title + .pageLink {
		display: none;
	}
	.pageLink li {
		width: 49.5%;
		margin: 1% 0 0;
	}
	.pageLink li a {
		padding: 10px 4px;
		border: 1px solid #ddd;
		font-size: 1.2rem;
		line-height: 1;
	}
	.pageLink li a:before,
	.pageLink li a:after {
		display: none;
	}
	
	/* h
	------------------------------------------------*/
	.underLine {
		position: relative;
		padding: 0 0 10px;
		font-weight: bold;
	}
	.centerLine:after {
		margin-left: 10px;
	}
	.centerLine.doubleLine:before {
		margin-right: 10px;
	}
	
	/* footer
	================================================================================*/
	/* footerInner
	------------------------------------------------*/
	.footerInner {
		width: 100%;
		padding: 20px 5%;
	}
	
	/* footerTop
	------------------------------------------------*/
	.footerTopInner {
		display: none;
	}
	.home .footerTopInner {
		display: block;
		padding: 40px 5% 30px;
	}
	.footerTopInner .facebook {
		width: 90%;
		margin: 0 auto 30px;
	} 
	.footerTopInner .facebook span,
	.footerTopInner .facebook iframe {
		height: 380px !important;
	}
	.footerTopInner  #footerSchedule {
		width: 100%;
	}
	.footerTopInner  #footerSchedule .scheduleTitle {
		font-size: 2.0rem;
	}
	.footerTopInner  #footerSchedule iframe {
		margin: 0 auto 20px;
	}
		
	/* footerBottom
	------------------------------------------------*/
	.footerBottom {
		display: none;
	}
	
	/* footerCopyright
	------------------------------------------------*/
	.footerCopyright {
		background: #f7f7f7 url(/common_img/bg_square.svg) repeat-x left bottom;
		background-size: 30px auto;
		}
	.home .footerCopyright {
		background: #fff url(/common_img/bg_square.svg) repeat-x left bottom;
		background-size: 30px auto;
	}
	.footer small.copyright {
		-webkit-box-ordinal-group: 3;
		-ms-flex-order: 2;
		order: 2;
		width: 100%;
		text-align: center;
	}
	.footerCopyright .footerPrivacy {
		-webkit-box-ordinal-group: 2;
		-ms-flex-order: 1;
		order: 1;
		margin: 0 auto 10px;
	}
	
	/* pagetop
	------------------------------------------------*/
	.pagetop {
		bottom: 12px;
		right: 12px;
	}
	.pagetop a {
		width: 40px;
	}

	
} /*---- デバイス別スタイル / スマートフォン ----*/


/* iPhone5サイズの分岐
================================================================================*/
@media only screen and (max-width: 360px) {
	.sp360 {
		display: block;
	}
	span.sp360 {
		display: inline-block;
	}
	.pcANDsp {
		display: none;
	}
	
	/* header
	------------------------------------------------*/
	
}