@charset "utf-8";
/* CSS Document */

body {
	color: #333333;
	font-size: 16px;
	font-family: 'Noto Serif JP','Noto Sans JP', "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
	line-height: 1.6;
	/*font-family: 'Noto Sans JP', sans-serif;ゴシック体*/
	/*font-family: 'Noto Serif JP', serif;明朝体*/
}

img{
	max-width : 100%;
	height : auto;
	vertical-align : middle;
}
a{
	text-decoration : none;
	color : #333333;
}
.flex {
	display: flex;
}
.is_between {
	justify-content: space-between;
}
.is_center {
	align-items: center;
}
.inner {
	width: 96%;
	max-width: 1100px;
	margin: 0 auto;
	/*padding: 20px;*/
}
.sp-only{
	display: none;
}
.tab-only{
	display: none;
}
@media screen and (max-width: 1245px){
	.tab-only{
		display: block;
	}
}

/*======================
	ヘッダー
======================*/
.header{
	width: 98%;
	margin: 0 0 0 auto;
	padding: 25px 0 10px;
}
.header-tel{
	font-size: 22px;
	line-height: 25px;
}
.header-tel span{
	font-size: 13px;
	text-align: right;
	padding: 5px;
	line-height: 13px;
	font-weight: bold;
    border: solid 1px #000000;
}
.instagram{
	margin: 0 0.5em;
}

@media screen and (max-width: 1245px){
	.header{
		padding: 20px 0 10px;
	}
	.header-tel{
		display: none;
	}
	#logo{/*ヘッダーのロゴの領域*/
		margin: 0 0 0 80px;
	}
}
@media screen and (max-width: 768px){
	.header-right{
		width: 30%;
	}
	.header-right img{
		width: 96%;
	}
	#logo{/*ヘッダーのロゴの領域*/
		max-width: 250px;
		width: 100%;
		margin: 0 0 0 60px;
			}
}
@media screen and (max-width: 500px){/*ヘッダーのロゴの領域*/
	#logo{
		max-width: 200px;
		width: 100%;
		margin: 0 0 0 40px;
	}
	.header-right img{
		width: 100%;
	}
	.instagram{
		margin: 0 0.5em;
}
}
/*グロナビ(PC表示の時)
======================*/
nav.globalMenu ul{
	display: flex;
	justify-content: space-between;
	width: 100%;
	padding: 0;
}
nav.globalMenu li{
	min-width: 95px;
	font-size: 15px;
	font-weight: 500;
	text-align:center;
}	
.globalMenu li:nth-child(3){
	min-width: 160px;
	text-align: center;
}
nav.globalMenu a{
	position: relative;/*アンダーラインの位置を決めるための基準 */
}
nav.globalMenu a::after{
	position: absolute; /*親要素であるaタグを基準に位置を指定*/
	bottom: -2px; /*アンダーラインが位置する、各リストの下端からの高さ　ヘッダーの下端に合わせています*/
	left:0; /*アンダーラインを各メニュー（aタグ）の左端に指定*/
	content: ''; /*本来は、擬似要素に入るテキストなどを’’内に指定。今回はアンダーラインなので何も記載しない*/
	width:100%; /*アンダーラインを各aタグの幅に合わせる*/
	height: 1.5px; /*アンダーラインの高さ（太さ）*/
	background-color: #91CAD3; /*下線の色*/
	transition: all .3s; /*アニメーション速度*/
	transform: scaleX(0); /*水平(X軸)方向*/
	}
nav.globalMenu a:hover::after{
	width:100%;
  	transform: scaleX(1);  /*水平(X軸)方向*/
}
/*===================
グロナビ・ハンバーガーメニュー(スマホ表示の時)
==================*/
@media screen and (max-width:1000px){
	.hamburger {
  		display : block;
  		position: fixed;
  		z-index : 7;
  		left : 10px;
		top   : 22px;
  		width : 42px;
  		height: 42px;
  		cursor: pointer;
  		text-align: center;
  	}
	.hamburger span {
  		display : block;
  		position: absolute;
  		width   : 30px;
  		height  : 4px ;
  		left    : 6px;
  		background : #91CAD3;
  		-webkit-transition: 0.5s all;
  		-moz-transition   : 0.5s all;
  		transition        : 0.5s all;
	}
	.hamburger span:nth-child(1) {
  		top: 10px;
	}
	.hamburger span:nth-child(2) {
  		top: 20px;
	}
	.hamburger span:nth-child(3) {
  		top: 30px;
	}

	/* ナビ開いてる時のボタン */

	.hamburger.active span:nth-child(1) {
  		top : 16px;
  		left: 6px;
  		width: 24px;
  		-webkit-transform: rotate(-45deg);
  		-moz-transform   : rotate(-45deg);
  		transform        : rotate(-45deg);
		background :#FFF;
	}
	.hamburger.active span:nth-child(2) {
  		left: 60%;
  		opacity: 0;
  		-webkit-animation: active-btn17-bar02 .8s forwards;
  		animation: active-hamburger-bar02 .8s forwards;
	}
	@-webkit-keyframes active-hamburger-bar02 {
  		100% {
    			height: 0;
  		}
	}
	@keyframes active-hamburger-bar02 {
  		100% {
    			height: 0;
  		}
	}
	.hamburger.active span:nth-child(3) {
  		top: 16px;
  		width: 24px;
  		-webkit-transform: rotate(45deg);
  		-moz-transform   : rotate(45deg);
  		transform        : rotate(45deg);
		background :#FFF;
	}
	.hamburger::after {
  		position: absolute;
  		top: 50%;
  		left: 50%;
  		display: block;
  		content: '';
  		width: 52px;
  		height: 52px;
  		margin: -32px 0 0 -32px;
  		border-radius: 50%;
  		border: 2px solid rgba(0, 0, 0, 0);
  		transition: all .75s;
	}
	.hamburger.active::after {
  		border: 2px solid #FFF;
	}

	nav.globalMenu {
		position: fixed;
		z-index : 3;
  		top  : 0;
  		left : 0;
  		color: #000;
  		background: #fff;
  		text-align: center;
  		transform: translateY(-100%);
  		transition: all 0.6s;
  		width: 100%;
	}
	nav.globalMenu ul {
		display: block;
  		background: #91CAD3;
		z-index : 5;
		color: #FFF;
  		margin: 0 auto;
  		padding: 0;
  		width: 100%;		
	}
	nav.globalMenu ul li {
		font-size: 18px;
  		list-style-type: none;
		padding: 0;
  		width: 100%;
	}
	nav.globalMenu ul li:last-child {
  		padding-bottom: 10px;
	}
	nav.globalMenu ul li a:hover{
  		color:#fff;
	}
	nav.globalMenu ul li a {
  		display: block;
  		color: #FFF;
		padding: 1.2em 0;
  		text-decoration :none;
			}

	/* このクラスを、jQueryで付与・削除する */
	nav.globalMenu.active {
  		transform: translateY(0%);
	}
}

/*======================
各セクションタイトル
======================*/
.section-ttl{
	display:block;
	padding-top:75px;
	font-size: 30px;
	font-weight: 500;
	margin-bottom: 25px;
	text-align: center;
	color: #3E3A39; 
	line-height: 30px;
}
.eng_ttl{
	position: relative;
	font-size: 22px;
	font-family:游明朝体, 游明朝, YuMincho, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	display: inline-block;
	padding: 0 30px;
	text-align: center;
	line-height:18px ;
	color: #3E3A39;
	
}
.eng_ttl:before,
.eng_ttl:after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 25px;
    height: 2px;
    background-color: #3E3A39;
}
 .eng_ttl:before {
    left: 0;
}
 .eng_ttl:after {
    right: 0;
}
@media screen and (max-width: 768px){
	.section-ttl{
		display:block;
		padding-top:40px;
		font-size: 25px;
		font-weight: 500;
		margin-bottom: 15px;
		text-align: center;
		color: #3E3A39; 
		line-height: 25px;
}
}

/*===========フッター==============*/
.footer{
	padding:30px 0 10px;
	background: url("../img/footer-bg-img.jpg")no-repeat center /cover;
	background-color:rgba(255,255,255,0.20);
	background-blend-mode:lighten;
	color: #fff;
}
.footer a{
	color: #fff;
}
.footer_mainnav,.footer_subnav{
	justify-content: center;	
}
.footer_mainnav li{
	max-width: 150px;
	width: 100%;
	font-size: 17px;
	font-weight: 500;
	text-align:center;	
	padding-bottom: 5px;
	color: #fff;
}
.footer_mainnav li:nth-child(4){
	max-width: 200px;
	width: 100%;
	}
.copyright{
	text-align: center;
	font-size: 12px;
	margin-top: 30px;
}
@media screen and (max-width:768px){
	.footer{
		padding: 5px 0 5px;
	}
	.copyright{
		font-size: 12px;
	}
		}


/*======================
768px以下共通
======================*/
@media screen and (max-width: 768px){
 .sp-only{
 	display: block;
 }
 .pc-only{
 	display: none;
 	}
 .sp-column{
 	flex-direction: column;
 	}
}
/*================各サブページのメインビジュアル====================*/
.subpage-mv{
	background: url("../img/subpage-mv.jpg")no-repeat center /cover;
	position: relative;
	width: 100%;
	height: 300px;
	
		}
.subpage-slogan{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	font-size: 30px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
	color: rgba(255,255,255,1.00);
	text-align: center;
	text-shadow: 0 0 10px #333333, 0 0 20px #333333, 0 0 30px #333333, 0 0 40px #333333;
}
@media screen and (max-width: 768px){
	.subpage_mv_area{
		height: 30vh;
		object-fit: cover;
 		}
	.subpage-slogan{
		font-size: 25px;
	}
	}
