@charset "UTF-8";

@import url("grid.css");



img {

	max-width:100%;

	height: auto;/*高さ自動*/

}





a img:hover {

	opacity: 0.8;

}

.underline {

	border-bottom: 3px solid #000;

	padding-bottom: 0.5rem;

}

.center {

	text-align: center;

}



.red {

	color: #FF0004;

}



/*言語選択

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

.langarea {

	display:flex;

	justify-content: center;

	background:#FFF;

	padding:5px;

}



.langarea a {

	padding:5px;

	margin:0 20px;

}





/*ヘッダー

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

.head {

	display: flex;

    flex-direction: row;

    padding: 1rem 0 0 0;

		background: #000000;

}



.head h1 { 

	font-weight: 700;

	letter-spacing: 3px;

	text-align:center;

	color:#000;

	margin:auto;

}



/*

.head h1 a {

	color:#666;

	font-size:2rem;

}

*/



.head h1 span {

	display:block;

	font-size:5.5rem;

	color:#000000;

	padding-top:1rem;

}



.snsbox {

	margin-left: auto;

	font-size: 3.0rem;

	padding: 1rem 0 0 0;

}

nav ul {

	display: flex;

    flex-direction: row;

    justify-content: center;

    list-style: none;

	margin-bottom: 0.5rem;

}

nav li {

    display: block;

    flex: 0 0 15%;

}

nav li a {

    text-decoration: none;

    text-align: center;

}

nav a:hover {

    text-decoration: underline;

}

nav a {

    padding: 1rem;

}





@media screen and (min-width: 768px){

	/* PC時はMENUボタンを非表示 */

	#open,#close {

		display: none !important;

	}



	#navi {

		display: block !important;

	}

}



@media screen and (max-width: 768px){

	.head {

		flex-direction: column;

		text-align: left;

	/*

		margin-bottom: 20px;

	*/

	}



	.head h1 span {

		font-size:4.4rem;

	}



	.telbox {

		margin-left: 0;

		text-align: center;

	}

	.head #open,#close  {

		position: absolute;

		top: 28px;

		right: 12px;

		}

	nav ul {

		flex-direction: column;

	}



	nav li {

		padding-top: 0;

		border-bottom: 1px solid #ccc;

		margin-bottom: 0;

	}

	/* スマホ時はMENUボタンを表示 */

	#open,#close  {

		display: block;

		width: 50px;

		border: none;

		position: absolute;

		top: 20px;

		right: 12px;

	}

	/* スマホ時はメニューを非表示 */

	#navi {

		display: none;

	}

}



/*メイン画像

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

.mainimg figure {

	margin: 0;

}

/*

figure img {

	border:4px solid #fff;

}

*/



.mainimg img {

	width: 100vw;

	vertical-align: bottom;

}



/*メインコンテンツ

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

main {

    margin: auto;

/*

    margin: 5rem 0 5rem 0;

*/

}



/*キャッチタイトル

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

h2.catch {

	text-align: center;

	color: #666;

	font-size: 4.0rem;

	margin-bottom: 3rem;

}



/*フッター

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

footer {

    background-color: #fff;

    padding: 3rem 0;

}

footer h5 {

    border-bottom: 1px solid #ccc;

}



/*コピーライト

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

.copyright {

    text-align: center;

    padding: 1rem 0;

	/*

    background-color: #fff;

	*/

}

.copyright a {

    color: #000;

    text-decoration: none;

	display: inline-block;

}



/*ページトップへ戻るボタン

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

#pagetop {

    position: fixed;

    bottom: 15px;

    right: 15px;

}

#pagetop a {

    display: block;

    background: #666;

    color: #fff;

    padding: 10px 15px;

    text-align: center;

}

#pagetop a:hover {

    background: #999;

}

/*パンくずリスト

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

.breadcrumb {

    margin: 0 0 1em 0;

    padding: 0;	

}

.breadcrumb li {

    list-style-type: none;

}

.breadcrumb li a {

    display: inline-block;

    color: #959fa5;

}





/*英語サイトリンク

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

.en-btn {

	padding:7px 12px;

	border-radius:100vh;

	background:#FFFFFF;

	border:#FFFFFF 3px solid;

	box-shadow:5px 5px 5px #666;

	transition: all .3s;

}





.en-btn:hover {

	color:#FFFFFF;

	background:#3399FF;

	border:#FFFFFF 3px solid;

}







@media screen and (min-width: 768px){

	header .container {

		position:relative;

	}

	.en-btn {

		position:absolute;

		top:40px;

		right:3%;

	}



	.head h1 { 

		padding: 5rem 0;

		font-size:2rem;

	}

}



@media screen and (max-width: 768px){

	header .container {

		margin-bottom:40px !important;

	}



	.en-btn {

		display: table !important;

		margin: auto;

	}



	.head h1 { 

		padding: 1rem 0;

		font-size:2rem;

	}

}





/* 祈祷申込書ボタン

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

.app-button {

	display: inline-block;

  padding: 10px 10px 10px 20px;

  color: #fff;

  text-align: center;

  font-weight: 600;

  letter-spacing: .1rem;

  text-transform: none;

  text-decoration: none;

  white-space: nowrap;

  background: #d22020;

  cursor: pointer;

  box-sizing: border-box;

  border-radius: 8px;

}



.app-button:hover {

  color: #F0FF00;

}



.cont-button {

	display: table;

	margin: 15px auto;

	border: 2px solid #4300E9;

	padding: 15px;

	background: #fff;

	text-align: center;

	font-size: 1.8rem;

	font-weight: bold;

	color: #4300E9;

}



