@charset "UTF-8" ;

/********************************************************************************

********************************************************************************/


/* ここまでスタッフポップアップページ用のコード */

.modal-content {
	width: 50% ;
	margin: 0 ;
	padding: 10px 20px ;
	border: 2px solid #aaa ;
	background: #fff ;
	position: fixed ;
	display: none ;
	z-index: 2 ;
}
  
#modal-overlay {
	z-index: 1 ;
	display: none ;
	position: fixed ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 120% ;
	background-color: rgba( 0,0,0, 0.75 ) ;
}

.button-link {
	color: #00f ;
	text-decoration: underline ;
}
 
.button-link:hover {
	cursor: pointer ;
	color: #f00 ;
}

 /**********staff-p**********/
 div#modal-content-01, div#modal-content-02, div#modal-content-03, div#modal-content-04, div#modal-content-05, div#modal-content-06, div#modal-content-07 {
 width:60%;
 height:auto;
 overflow:hidden;
 margin: 0 0 0 0;
 padding: 0 0 0 0;
 background-image: url("images/staff-box.png");
 background-repeat: no-repeat;
 }


/*ボックス共通設定*/
section_modal.list_modal {
	margin-bottom: 15px;	/*ボックスの下に空ける余白*/
	position: relative;
	overflow: hidden;
	background: #fff;	/*背景色*/
	padding: 3.5%;		/*ボックス内の余白*/
	color: #333;		/*文字色*/
}
/*ボックス内のh4タグ共通設定*/
section_modal.list_modal h4 {
	color: #32b16c;	/*文字色*/
	padding-left: 10px;	/*王冠マークに文字が重ならないように幅を確保*/
	margin-left: 28%;	/*画像とのバランスをとって設定（※横長タイプ用）*/
}
/*ボックス内の段落タグ共通設定*/
section_modal.list_modal p {
	padding: 10px;
	margin-left: 28%;	/*画像とのバランスをとって設定（※横長タイプ用）*/
}
/*ボックス内の写真共通設定*/
section_modal.list_modal figure img {
	float: left;	/*画像を左へ回り込み（※横長タイプ用）*/
	width: 20%;		/*写真の幅（※横長タイプ用）*/
	padding: 10px;
}

span.fontserif { 
font-family: 'Adobe Caslon Pro','Georgia','KozMinPro-regular',serif;
 }
 
span.font7pt {
 font-size: 7pt;
 line-height: 10pt;
 }
span.fontserif7pt {
 font-family: 'Adobe Caslon Pro','Georgia','KozMinPro-regular',serif;
 font-size: 7pt;
 line-height: 10pt;
 }
 
span.font8pt {
 font-size: 8pt;
 line-height: 14pt;
 }
span.fontserif8pt {
 font-family: 'Adobe Caslon Pro','Georgia','KozMinPro-regular',serif;
 font-size: 8pt;
 line-height: 14pt;
 }

span.font10pt {
 font-size: 10pt;
 letter-spacing:1.3pt;
 }
 
span.font10ptserif {
 font-size: 10pt;
 font-weight: bold;
 font-family: 'Adobe Caslon Pro','Georgia','KozMinPro-regular',serif;
 }
 
span.font11pt {
 font-size: 11pt;
 letter-spacing:1.5pt;
 }
 
span.font11ptserif {
 font-size: 11pt;
 font-weight: bold;
 font-family: 'Adobe Caslon Pro','Georgia','KozMinPro-regular',serif;
 }

  
span.fontwhite {
 color: #fff;
 }

span.fontwhite7pt {
 color: #fff;
 font-size: 7pt;
 }
 
span.fontgold7pt {
 color: #D3B32B;
 font-size: 7pt;
 }

/*ここからタブレット用（481px～800px）環境の設定############################
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media (min-width:481px) and (max-width:800px){
	div#modal-content-01, div#modal-content-02, div#modal-content-03, div#modal-content-04, div#modal-content-05, div#modal-content-06, div#modal-content-07 {
	width:75%;	
	height:auto;
	}

}
 
 /*ここからスマートフォン用（480px以下）環境の設定$$$$$$$$$$$$$$$$$$$$$$$$$$
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media (max-width : 480px){

	div#modal-content-01, div#modal-content-02, div#modal-content-03, div#modal-content-04, div#modal-content-05, div#modal-content-06, div#modal-content-07 {
	width:85%;
	height:auto;
	}
	/*ボックス内の写真共通設定*/
	section_modal.list_modal figure img {
		width: 20%;		/*写真の幅（※横長タイプ用）*/
		float: right;	/*画像を左へ回り込み（※横長タイプ用）*/

	}
	/*ボックス内のh4タグ共通設定*/
	section_modal.list_modal h4 {
		margin-left: 10px;	/*画像とのバランスをとって設定（※横長タイプ用）*/
	}
	/*ボックス内の段落タグ共通設定*/
	section_modal.list_modal p {
		margin-left: 10px;	/*画像とのバランスをとって設定（※横長タイプ用）*/
	}
}