﻿@import url('https://use.fontawesome.com/releases/v6.1.1/css/all.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/*--------------------------------------------------------------------
  3タイプ共用スタイルシート
  #one_colomun				「上メニュー」
  #two_colomun_leftmenu		「左メニュー」
  #two_colomun_rightmenu	「右メニュー」
--------------------------------------------------------------------*/

* {
margin: 0;
padding: 0;
word-break: normal;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}


BODY{
margin:0;
padding:0;
color:#000;
background:#FFF;
font-size: 100.0%;	/* 16pxベース */
line-height:1.6;
text-align: center;
letter-spacing:1px;
font-family:'Open Sans', 'Noto Sans JP', "メイリオ", Meiryo, sans-serif;
font-weight:400;
}


/*------ フォントサイズ ------
font-size:62.5%;	10px
font-size:75.0%;	12px
font-size:87.5%;	14px
font-size:100.0%;	16px
font-size:112.5%;	18px
font-size:125.0%;	20px
font-size:137.5%;	22px
font-size:150.0%;	24px
font-size:162.5%;	26px
font-size:175.0%;	28px
font-size:187.5%;	30px
font-size:200.0%;	32px
font-size:212.5%;	34px
font-size:225.0%;	36px
font-size:237.5%;	38px
font-size:250.0%;	40px
-----------------------------*/

IMG,
A IMG{
border:none;
width:auto;
height:auto;
}
IMG{
max-width: 100%;
image-rendering: -webkit-optimize-contrast;
}

P{
margin-top:1.8em;
margin-bottom:1.8em;
line-height:1.8;
}


/*--------------------------------------------------------------------
  リンクテキスト
--------------------------------------------------------------------*/
A{
color:#043C78;	/* Indigo */
transition: color 0.5s ease,  background 0.5s ease, opacity 0.5s ease;
-webkit-transition: color 0.5s ease,  background 0.5s ease, opacity 0.5s ease;
-moz-transition: color 0.5s ease,  background 0.5s ease, opacity 0.5s ease;
-o-transition: color 0.5s ease,  background 0.5s ease, opacity 0.5s ease;
text-decoration:none;
word-break: break-all;	/* URL や E-mailアドレスを改行する */
}
ARTICLE A{
border-bottom-style:solid;
border-bottom-width:1px;
}
A:visited{
color:#369;
}
A:hover{
color:#09C;
text-decoration:none;
}
ARTICLE A:has(IMG){
border-bottom:none;
}
ARTICLE A:has(IMG):hover{
opacity:0.8;
}




/*------ 外部リンクアイコン ------*/
#content A[href^="http"]::after {
margin-left:0.25em;
content: "\f35d";
font-family: "Font Awesome 6 Free";
font-weight : 900;
text-decoration:none;
display:inline-block;
}
#content A[href*="sapmed"]::after {	/* 自社リンクは除外 */
content:none;
}



/*--------------------------------------------------------------------
  「レスポンシブ」固有
--------------------------------------------------------------------*/
.pc,
.pc_sp,
.pc_tablet{
display:inline-block;
}

.tablet_sp,
.tablet,
.sp{
display:none;
}
.block_pc{	/* PCの時だけ改行する */
display:block;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	IMG{
	width:auto;
	height:auto;
	max-width: 100%;
	}
	.block_tablet_sp{	/* タブレット・スマホの時だけ改行する */
	display:block;
	}
	.block_pc{	/* PCの時だけ改行する */
	display:inline-block;
	}
}

@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.pc_sp,
	.pc,
	.sp{
	display:none !important;
	}
	.tablet_sp,
	.pc_tablet,
	.tablet{
	display:inline-block !important;
	}
	.block_tablet{	/* タブレット・スマホ横の時だけ改行する */
	display:block;
	}
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.pc_tablet,
	.pc,
	.tablet{
	display:none !important;
	}
	.pc_sp,
	.tablet_sp,
	.sp{
	display:inline-block !important;
	}
	.block_sp{	/* スマホ縦の時だけ改行する */
	display:block;
	}
}



.pc_none{
display:none;
}

/*--------------------------------------------------------------------
  見出し
--------------------------------------------------------------------*/
H1{
margin:0;
}
H2{
margin:0.2em auto;
font-size:187.5%;	/* 30px */
}
/*------------------------------------------------
   H3
------------------------------------------------*/
/*------ H3基本設定 ------*/
H3{
margin:30px 0 20px 0;
font-size:175.0%;	/* 28px */
clear:both;
}
#content_top H2,
#content H3{
padding:0.8em 0.5em 0.5em 0.5em;
border-bottom:5px solid #A52A2A;	/* Brown */
font-weight:normal;
line-height:1.3;
}
#content H3 .extrasmall{
font-size:57.14%;	/* 16px */
}
/*------ 他要素隣接時 ------*/
#content *:not(#pkl)+H3{
margin-top:2.5em;
}



/*------------------------------------------------
   H4
------------------------------------------------*/
/*------ H4基本設定 ------*/
H4{
margin:40px auto 15px auto;
clear:both;
}
#content H4{
padding:0.4em 0.5em 0.2em 0.5em;
border-bottom:2px solid #800000;	/* Maroon */
font-size:125.0%;	/* 20px */
font-weight:normal;
}

/*------ 他要素隣接時 ------*/
#content *+H4{	/* H4 他要素のすぐ下は余白を多く */
margin-top:2.0em;
}



/*------------------------------------------------
   H5
------------------------------------------------*/
/*------ H5基本設定 ------*/
H5{
margin:40px auto 10px auto;
padding:0.2em 0 0.2em 6px;
border-left:4px solid #800000;	/* Maroon */
font-size:112.5%;	/* 18px */
font-weight:normal;
clear:both;
}

/*------ 他要素隣接時 ------*/
#content *+H5{	/* H5 他要素のすぐ下は余白を多く */
margin-top:60px;
}



/*--------------------------------------------------------------------
  インデント 
--------------------------------------------------------------------*/
.indent{
margin-left:15px;
}

#content .subtitle{
font-size:112.5%;	/* 18px */
color:#F30;
}



/*--------------------------------------------------------------------
  画像レイアウト枠
--------------------------------------------------------------------*/
/*------ 1枚・複数共通 ------*/
.photo,
.photos{
text-align:center;
}
.photo IMG,
.photos IMG{
margin:0 auto;
padding:5px 0;
}

/*------ 1枚 ------*/
.photo IMG{
display:block;
}
/*------ 複数 ------*/
.photos IMG{
display:inline-block !important;
vertical-align:middle;
}
.photos IMG:nth-child(n+2){	/* 2個目以降 */
margin-left:10px;
}


@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.photos BR{
	display:none;
	}
	.photos IMG:nth-child(n+2){	/* 2個目以降 */
	margin-left:10px !important;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.photos IMG:nth-child(n+2){	/* 2個目以降 */
	margin-left:auto;
	display:block;
	}
}




/*--------------------------------------------------------------------
  左寄せ・右寄せ
--------------------------------------------------------------------*/
.aligncenter{
text-align:center;
}
.alignright{
text-align:right;
}

/*------------------------------------------------
  画像の左寄せ・右寄せ
------------------------------------------------*/
.left{
float: left;
margin: 0 20px 20px 0;
}
.right{
float: right;
margin: 0 0 20px 20px;
}
.clear{
clear:both;
}
@media only screen and (max-width:1100px) {	/* 幅の狭いPC以下用 */
	.photo.right{
	margin-right:auto;
	margin-left:auto;
	float:none;

	}
}


/*--------------------------------------------------------------------
  フォントサイズ・色
--------------------------------------------------------------------*/
.extrasmall{
font-size:75.0%;	/* 12px */
}
.small{
font-size:87.5%;	/* 14px */
}
.large{
font-size:125.0%;	/* 20px */
}
.extralarge{
font-size:162.5%;	/* 26px */
}

.red{
color:#F00;
}
.orange{
color:#f60;
}
.green{
color:#690;
}


/*------------------------------------------------
   強調下線
------------------------------------------------*/
.borderbottom{
border-bottom:2px solid #000;
}
.underline{
display:inline;
background: -prefix-linear-gradient(	/* Webkit系 */
bottom,
rgba(255,0,204,0.2),
rgba(255,0,204,0.2) 34%,
rgba(255,0,204,0) 35%),
url(img/spacer.gif);
background: linear-gradient(	/* ピンク 12.1、IE 10、Fx 16 以降 */
to top,
rgba(255,0,204,0.2),
rgba(255,0,204,0.2) 34%,
rgba(255,0,204,0) 35%),
url(img/spacer.gif);
/ border-bottom:5px solid #CF0;	/* IE7対策 */
}
html.android .underline{
/* Android は下線 */
border-bottom:5px solid rgba(255,0,204,0.2);
}


/*--------------------------------------------------------------------
  リストスタイル
--------------------------------------------------------------------*/
UL{
margin:1.2em 0;
padding:0;
list-style:none;
}
LI{
margin:0;
padding:0;
background:url(img/spacer.gif) no-repeat;	/* Android4.0対策 */
}


#content LI{
margin-top:0.5em;
margin-bottom:0.5em;
}
#content LI LI{
margin-top:0.2em;
margin-bottom:0.2em;
}


/*------------------------------------------------
  ネスト時
------------------------------------------------*/
LI UL,
DD UL,
TD UL{
margin-top:0;
margin-bottom:0.3em;
}


/*------------------------------------------------
  箇条書きリスト
------------------------------------------------*/
UL.list>LI,
UL>LI.list{
padding-left:1.3em;
text-indent:-1.3em;
}
UL.list>LI *,
UL>LI.list *{
padding-left:0;
text-indent:0;
}


LI.list:not(.kome)::before,
.list>LI:not(.kome)::before{
margin:-0.22em 0.5em 0 0.5em;
text-indent:0;
content:"\f111";
font-family: "Font Awesome 5 Free";
font-weight : 900;
font-size:0.6em;
vertical-align:middle;
display:inline-block;
color:#999;
}


/*------------------------------------------------
  横並びリスト
------------------------------------------------*/
UL.inline-block-li{
display:block;
}
UL.inline-block-li.table{
display:table;
}
UL.inline-block-li>LI{
margin-top:0.2em;
margin-bottom:0.2em;
padding:0 0.6em 0 0;
display:inline-block;
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	UL.inline-block-li>LI:has(.link_large){
	margin:0.5em auto;
	padding:0;
	display:block;
	}

}
UL.inline-block-li.list>LI{
padding-left:0.9em;
padding-right:0.6em;
display:inline-block;
text-indent:0.8em;
}
UL.inline-block-li.list>LI *{
text-indent:0;
}

UL.inline-block-li.padding0{
padding-left:0.25em;
}

UL.inline-block-li.padding0>LI{
padding:0;
margin:0 0 0 -0.25em;
}


/*------------------------------------------------
  番号付きリスト
------------------------------------------------*/
OL{
margin:1.2em 0;
padding:0;
}

/*------ ネスト時 ------*/
LI OL,
DD OL,
TD OL{
margin-top:0;
margin-bottom:0.3em;
}
OL>LI{
margin-left:2.2em;
list-style-type : decimal;
}
UL>LI OL>LI{
text-indent:0;
}

/*------ 両側に()カッコ ------*/
OL.kakko>LI{
margin-left:0;
padding-left:2.2em;
text-indent: -2.1em;
list-style-type:none;
list-style-position:inside;
counter-increment: cnt;
}
OL.kakko>LI::before{
display: marker;
content: "（" counter(cnt) "）";
}

/*------ 右側に)カッコ ------*/
OL.katakakko>LI{
margin-left:0;
padding-left:2.2em;
text-indent: -2.5em;
list-style-type:none;
list-style-position:inside;
counter-increment: cnt;
}
OL.katakakko>LI::before{
/* display: marker; */
display: inline-block;
content: counter(cnt) "）";
text-align:right;
width:2.5em;
}


OL[class*="kakko"] >LI *{
text-indent:0;
}

/*------------------------------------------------
  注釈 ※ リスト
------------------------------------------------*/
UL.kome>LI,
LI.kome{
padding-left:1.3em;
text-indent:-1.3em;
line-height:1.3;
}
UL.kome>LI::before,
LI.kome::before{
margin-right:0.2em;
display:inline-block;
content:"※";
color:#F00;
text-indent:0;
}

/*------------------------------------------------
  PDF・Word・Excel・PowerPoint・ZIP・Imageリスト
------------------------------------------------*/
/*------ 共通 ------*/
UL.pdf>LI,
UL.word>LI,
UL.excel>LI,
LI.pdf,
LI.word,
LI.excel{
padding-top:0.3em;
padding-left:40px;
background-repeat:no-repeat;
background-position:0 0;
list-style:none;
min-height:32px;
}

/*------ PDFリスト ------*/
UL.pdf>LI,
LI.pdf{
background-image:url(img/pdf.png);
}

/*------ Wordリスト ------*/
UL.word>LI,
LI.word{
background-image:url(img/word.png);
}

/*------ Excelリスト ------*/
UL.excel>LI,
LI.excel{
background-image:url(img/excel.png);
}


/*------ PDFリスト（小） ------*/
A.pdf_s,
UL.pdf_s>LI,
LI.pdf_s{
padding-left:20px;
list-style:none;
background-image:url(img/pdf.png);
background-repeat:no-repeat;
background-position:0 0.2em;
background-size:16px 16px;
-webkit-background-size:16px 16px;
-moz-background-size:16px 16px;
-o-background-size:16px 16px;
-ms-background-size:16px 16px;
}
A.pdf_s{
display:inline-block;
}



/*--------------------------------------------------------------------
  表
--------------------------------------------------------------------*/
TABLE,
TH,
TD{
font-size:100%;
}
TH{
text-align:center;
font-weight:normal;
}



/*------------------------------------------------
  罫線を表示するタイプの表
------------------------------------------------*/
TABLE.data_table{
border-collapse:collapse;
border:1px solid #999;
}

TABLE.data_table CAPTION{
text-align:right;
}
.data_table TH{
padding:15px;
border:1px solid #999;
background:#F5F5F5;
}

.data_table TD{
padding:15px;
border:1px solid #999;
background:#FFF;
}

/*------------------------------------------------
  罫線を表示しないレイアウト用の表
------------------------------------------------*/
TABLE.layout_table{
margin-left:10px;
}
.layout_table TH{
padding:5px 0;
text-align:left;
}
.layout_table TD{
padding:5px 0;
}
.layout_table TH+TD{
padding:5px 40px 5px 5px;
}



/*--------------------------------------------------------------------
  「トップページ」固有の設定
--------------------------------------------------------------------*/
/*------------------------------------------------
  トップページ 開催情報欄
------------------------------------------------*/

@media only screen and (min-width:901px) {	/* 幅の広いPC用 */
	#information .dl_table.flexbox{
	margin:0 auto;
	padding:2px 3px 3px 3px;
	background:rgba(102,0,0,0.3);	/* #600 */
	}
	#content_top H2{
	display:none;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#content_top H2,
	#content_top H3,
	#content_top H4,
	#content_top H5{
	text-align:center;
	}

}





/*------------------------------------------------
  トップページ お知らせ欄
------------------------------------------------*/
#news H3{
margin:3.0em 0 0 0;
padding:0.5em 0.8em;
font-size:125.0%;	/* 20px */
font-weight:500;
}



/*------------------------------------------------
  #two_colomn 「左メニュー」「右メニュー」
------------------------------------------------*/
#two_colomun_leftmenu #news{
margin-top:30px;
}
#news DL{
margin:0 0 0.5em 0;
padding:0;
border-top:2px solid #A52A2A;	/* Brown */
border-bottom:2px solid #A52A2A;	/* Brown */
}
#news DL.flexbox>*{
margin:0;
padding:1.0em;
border-top:1px solid #A52A2A;	/* Brown */
}
#news DT{
width:9em;
}
#news DT SPAN{
font-size:93.75%;	/* 15px */
}

#news DD{
width : -webkit-calc(100% - 9em) ;
width : calc(100% - 9em);
}
#news DT:first-of-type,
#news DD:first-of-type{
border-top:none;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	#news DL.flexbox>DT{
	padding:0.75em 0.5em 0 0.5em;
	width:100%;
	}
	#news DL.flexbox>DD{
	padding:0 0.5em 0.75em 0.5em;
	width:100%;
	border-top:none;
	}
}


/*------------------------------------------------
  トップページ右側 住所欄 
------------------------------------------------*/
#footer_address{
margin:4.0em 0 0 0;
padding:0 0 9px 0;
}
#footer_address H5{
margin:0;
padding:0.5em 1.0em;
background:#DCD6D2;	/* Sand beige */
font-weight:normal;
border-left:none;
font-size:100.0%;	/* 16px */
}

#footer_address_inner{
padding:0.2em 1.0em 1.0em 1.0em;
background:rgba(238,231,224,0.5);	/* Ecru #EEE7E0 */
}
#footer_address P{
margin:10px 0 0 0;
}
#footer_address SPAN{
margin:0 5px 0 0;
display:inline-block;
width:5em;
}



/*--------------------------------------------------------------------
  「コンテンツ」固有の設定
--------------------------------------------------------------------*/
/*------------------------------------------------
  会長挨拶 
------------------------------------------------*/
.belong.table{
margin:0.3em 0 auto auto;
}

/*------------------------------------------------
  ポスター
------------------------------------------------*/
IMG.max600{
max-width:600px;
width:100%;
}


/*------------------------------------------------
  アクセスマップ 
------------------------------------------------*/
#accessmap{
margin:auto !important;
text-align:center;
border:1px solid #CCC;
}
#two_colomun_leftmenu #accessmap{
width:610px;
}
#one_colomun #accessmap{
width:810px;
}


#accessmap IFRAME{
margin:4px;
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#one_colomun #accessmap{
	padding:4px;
	width:92%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	}

	#accessmap IFRAME{
	margin:0;
	width:100%;
	height:300px;
	}
}

/*------------------------------------------------
   行頭アイコン
------------------------------------------------*/
/*------ 行頭に配置 ------*/
.icon [class^="fa-"]{
margin-right:0.5em;
vertical-align:middle;
line-height:1.0;
}

H4.icon:has( [class^="fa-"] ){
padding-left:1.5em;
text-indent:-1.5em;
}
H4.icon [class^="fa-"] {
margin-top:-0.1em;
text-indent:0;
width:1.0em;
}


/*------ 上に配置 ------*/
.icon.block [class^="fa-"]{
margin:0 auto 0.2em auto;
display:block;
}
.icon.before::before,
.icon.after::after{
font-family: "Font Awesome 6 Free";
display:inline-block;
content: "\f105";
font-weight : 900;
display:inline-block;
vertical-align:middle;
}
.icon.before::before{
margin-right:0.5em;
}
.icon.after::after{
margin-left:0.5em;
}
.icon.after.download::after{
content: "\f019";
font-size:120%;
}
.icon.before.word::before{
content: "\f1c2";
font-size:120%;
}


/*-----------------------------------------------
  flexbox レイアウトをレスポンシブで可変
------------------------------------------------*/
/* flexbox レイアウトをレスポンシブで可変 */
BODY .flexbox{
margin-right:auto;
margin-left:auto;
display : -webkit-box;     /* old Android */
display : -webkit-flex;    /* Safari etc. */
display : -ms-flexbox;     /* IE10        */
display : flex;
-webkit-flex-wrap: wrap;          /* Safari etc. */
-ms-flex-wrap    : wrap;          /* IE10        */
flex-wrap        : wrap;
align-items: stretch;	/* 子要素の高さを揃える */
justify-content:center;	/* 左右中央揃え（センタリング） */
}
.flexbox.space-between{
justify-content: space-between;
}
.flexbox.space-around{
justify-content: space-around;
}
.flexbox.start{
justify-content:flex-start;	/* 左揃え（初期値） */
}
.flexbox.end{
justify-content:flex-end;	/* 右揃え */
}

.flexbox.startalign{
align-items: flex-start;	/* 子要素の高さを揃えず上に付ける */
}
.flexbox.center{
align-items: center;	/* 子要素の高さを揃えず天地中央に置く */
}


/*------------------------------------------------
  アイテム横並び .flexbox
------------------------------------------------*/
.item{
}
.item>*{
margin-top:1.5em;
margin-bottom:0;
padding:0;
text-indent:0;
}

.item.margin{
margin-top:-1.0em;
}
.item.margin>*{
margin-top:3.0em;
}

.item.padding>*{
padding:1.0em;
}
.item>*::before{
display:none !important;
}

.item>*>*{
margin-bottom:0;
}
.item>* :first-child{
margin-top:0;
}
.item>*>*+H4{
margin-top:1.0em;
}


/*------ 2列 ------*/
.item.part2>*{	/* □1.5□ */
width : -webkit-calc( (100% - 1.5em) / 2 );
width : calc( (100% - 1.5em) / 2 );
}
.item.part2.margin>*{	/* □3.0□ */
width : -webkit-calc( (100% - 3.0em) / 2 );
width : calc( (100% - 3.0em) / 2 );
}

/*------ 3列 ------*/
.item.part3::after,	/* ダミーカラム */
.item.part3>*{	/* □1.5□1.5□ */
width : -webkit-calc( (100% - 3.0em) / 3 );
width : calc( (100% - 3.0em) / 3 );
}
.item.part3.margin::after,	/* ダミーカラム */
.item.part3.margin>*{	/* □3.0□3.0□ */
width : -webkit-calc( (100% - 6.0em) / 3 );
width : calc( (100% - 6.0em) / 3 );
}
.item.part3::after{	/* ダミーカラム */
content:"";
display: block;
}

/*------ 4列 ------*/
.item.part4::after,	/* ダミーカラム */
.item.part4>*{	/* □1.5□1.5□1.5□ */
width : -webkit-calc( (100% - 4.5em) / 4 );
width : calc( (100% - 4.5em) / 4 );
}
.item.part4::after{	/* ダミーカラム */
content:"";
display: block;
}
	
@media only screen and (min-width:769px) and (max-width:900px) {	/* 幅の狭いPC用 */
	.item.part4::after,	/* ダミーカラム */
	.item.part4>*{	/* □1.5□1.5□ */
	width : -webkit-calc( (100% - 3.0em) / 3 );
	width : calc( (100% - 3.0em) / 3 );
	}
}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.item.part3:not(.tab2)>LI,
	.item.part2:not(.tab2)>*{
	width:100% !important;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/* スマホ横用 */
	.item.part4>LI,
	.item.tab2>*{	/* □1.5□ */
	width : -webkit-calc( (100% - 1.5em) / 2 );
	width : calc( (100% - 1.5em) / 2 );
	}
	.item.tab2.margin>*{	/* □3.0□ */
	width : -webkit-calc( (100% - 3.0em) / 2 );
	width : calc( (100% - 3.0em) / 2 );
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.item[class*="part"].tab2>LI,
	.item[class*="part"]>*{
	width:100%;
	}
}



/*------------------------------------------------
  左右振り分け 任意の幅 .flexbox.space-betweenと併用
------------------------------------------------*/
.layoutbox{
padding-top:1.0em;
}

.layoutbox>*.w30p,
.layoutbox>*.w70p+*{
width:30%;
}
.layoutbox>*.w30p+*,
.layoutbox>*.w70p{
width : -webkit-calc(70% - 1.5em);
width : calc(70% - 1.5em);
}
.layoutbox>*.w40p,
.layoutbox>*.w60p+*{
width:40%;
}
.layoutbox>*.w40p+*,
.layoutbox>*.w60p{
width : -webkit-calc(60% - 1.5em);
width : calc(60% - 1.5em);
}
.layoutbox>*:nth-child(n+3){
margin-top:1.5em;
}


@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.layoutbox>*,
	.layoutbox>*+*{
	width:100% !important;
	height:auto;
	}
}


/*------------------------------------------------
  電話番号自動リンク(with JavaScript)
------------------------------------------------*/
A.tellink {
pointer-events: none;	/* PCの時はリンクしない */
cursor: default;
border-bottom:none !important;
display:inline-block;
color:#000;
}
A.tellink.tel {
pointer-events: auto;
}
#content A.tellink{
display:inline-block;
}


/*------------------------------------------------
  2列の表のようなDLリスト( .flexbox併用)
------------------------------------------------*/
.dl_table.flexbox{
margin:1.0em auto;
padding:0;
}

.dl_table.large{
font-size:112.5%;	/* 18px */
}

.dl_table *{
opacity:1.0;	/* スクロールエフェクト除外 */
}
.dl_table>DT,
.dl_table>DD{
margin:1px 0 0 0;
transition : all 0s;
}

.dl_table>DT{
padding:0.75em 0.5em;
width:10em;
text-align:center;
background:#DCD6D2;	/* Sand beige */
}
.dl_table>DD{
padding:0.75em 1.0em;
width : -webkit-calc(100% - 10em) ;
width : calc(100% - 10em);
text-align:left;
background:#F6F2EE;	/* Ecru #EEE7E0 55% */
}

.dl_table.middlename>DT{
width:15em;
}
.dl_table.middlename>DD{
width : -webkit-calc(100% - 15em) ;
width : calc(100% - 15em);
}

.dl_table.longname>DT{
width:22em;
}
.dl_table.longname>DD{
width : -webkit-calc(100% - 22em) ;
width : calc(100% - 22em);
}

@media only screen and (max-width:900px) {	/* 幅の狭いPC以下用 */
	.dl_table.flexbox{
	width:100%;
	min-width:auto;
	min-width:initial;
	}
	.dl_table>DT,
	.dl_table>DD{
	margin:0;
	}

	.dl_table DT BR{
	display:none;
	}
	.dl_table>DT{
	padding:0.25em 0.5em;
	text-align:left;
	display:block;
	width:100% !important;
	}
	.dl_table.longname>DD,
	.dl_table>DD{
	padding:0.5em 0.5em 0.6em 0.5em;
	width:100%;
	}
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
}


/*------------------------------------------------
  署名
------------------------------------------------*/
.signature{
margin-right:0;
margin-left:auto !important;
display:table;
}

/*------------------------------------------------
  レイアウト
------------------------------------------------*/
.inline-block{
display:inline-block;
}
.block{
margin-right:auto;
margin-left:auto;
display:block;
}
.table{
margin-right:auto;
margin-left:auto;
display:table;
width:auto;
}
.table.left{
margin-left:0;
}

.nowrap{
white-space:nowrap;
}


.relative{
position:relative;
}
.absolute{
position:absolute;
}
.x50y50{
transform : translate(-50%, -50%);
top:50%;
left:50%;
}
.x0y50{
transform : translate(0, -50%);
top:50%;
left:0;
}
.x50y0{
transform : translate(-50%,0);
top:0;
left:50%;
}

/*------------------------------------------------
  準備中表示
------------------------------------------------*/

.underconstruction{
margin:2em auto;
padding:200px 25px 100px 25px;
background-image:url(img/comingsoon.png);
background-position:center 80px;
background-repeat:no-repeat;
text-align:center;
width:90%;
}
.underconstruction.noimage{
padding:150px 25px;
background:#FFF;
}

@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.underconstruction.noimage,
	.underconstruction{
	padding:50px 0;
	background-position:center;
	width:auto;
	}
}


/*------------------------------------------------
   行頭アイコン
------------------------------------------------*/
/*------ 行頭に配置 ------*/
.icon [class^="fa-"]{
margin-right:0.5em;
vertical-align:middle;
line-height:1.0;
}
/*------ 上に配置 ------*/
.icon.block [class^="fa-"]{
margin:0 auto 0.2em auto;
display:block;
}

.icon .mail{
margin-right:0.3em;
margin-left:0.2em;
}



/*------------------------------------------------
   リンクボタン（共通）
------------------------------------------------*/

*[class^="link_"],
A[class^="link_"]:visited{
color:#FFF;
background:#008080;	/* Teal ++ */
border:1px solid #008080;	/* Teal ++ */
zoom: 1;
outline: none;
text-align:center;
display:inline-block;
border-radius:2em;
-moz-border-radius:2em;
-webkit-border-radius:2em;
text-decoration:none;
}
A[class^="link_"]:hover{
color:#FFF;
opacity:0.7;
}

*[class^="link_"].outline,
A[class^="link_"].outline:visited,
A[class^="link_"].outline:hover{
border-color:inherit;
background:transparent;
}


[class^="link_"].invert{
color:#000;
background:#FFF;
border-color:#000;
}
A[class^="link_"].invert.white{
color:#FFF;
background:url(img/spacer.gif);
border-color:#FFF;
}
A[class^="link_"].invert:hover{
color:#FFF;
background:#008080;	/* Teal ++ */
border:1px solid #008080;	/* Teal ++ */
}



[class^="link_"].before::before,
[class^="link_"].after::after{
font-family: "Font Awesome 6 Free";
display:inline-block;
transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
content: "\f105";
font-weight : 900;
}
[class^="link_"].after::after{
margin-left:0.5em;
}
[class^="link_"].before::before{
margin-right:0.5em;
}
[class^="link_"].before.mail::before{
content: "\f0e0";
}


/*------------------------------------------------
   リンクボタン（小）
------------------------------------------------*/
.link_small{
padding:0 0.5em;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	.link_small{
	padding:0.5em 10px;
	}
}

/*------------------------------------------------
   リンクボタン（大）
------------------------------------------------*/
.link_large{
margin:auto;
padding:0.7em 1em;
font-size:112.5%;	/* 18px */

}
.link_large SPAN[class^="fa-"]{
margin:-0.15em 0.5em 0 0;
font-size:150.0%;	/* 24px */
vertical-align:middle;
}



@media only screen and (max-width:768px) {	/*/* スマホ横以下用 */
	.link_large{
	padding:0.5em 0;
	display:block;
	width:90%;
	}
}
@media only screen and (min-width:541px) and (max-width:768px) {	/*/* スマホ横用 */
	.link_large{
	max-width:600px;
	}
}

/*------------------------------------------------
   強調枠囲み
------------------------------------------------*/
/*------------------------------------------------
  お問い合わせ枠
------------------------------------------------*/
.check{
padding:1.0em 1.5em;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
background:#F6F2EE;	/* Ecru #EEE7E0 55% */
}

DIV.check{
margin-top:1.8em;
margin-bottom:1.8em;
}

DIV.check>*{
margin-top:0;
margin-bottom:0;
}
DIV.check>*~*{
margin-top:15px;
}
#content>.check.island{
margin-right:auto;	/* インデントリセット */
margin-left:auto;	/* インデントリセット */
display: table;
min-width:600px;
}





@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	#content>.check,
	#content>.check.island{
	margin-right:0;	/* インデントリセット */
	margin-left:0;	/* インデントリセット */
	min-width:auto;
	min-width:initial;
	display: block;
	width:auto;
	}
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	.check{
	padding:1.0em;
	}
}

/*------------------------------------------------
  Google Map
------------------------------------------------*/
IFRAME.googlemap{
margin:0 20px;
display:block;
width:100%;
width : -webkit-calc( 100% - 40px ) ;
width : calc( 100% - 40px );
}


@media only screen and (max-width:540px) {	/* スマホ縦用 */
	IFRAME.googlemap{
	height:350px;
	}
}

/*-----------------------------------------------
  ふわっと表示　じわじわ(with JavaScript)
------------------------------------------------*/
SECTION>*,ARTICLE>*,P,ARTICLE LI,ARTICLE DL>*,
.effect-fade{
opacity : 0;
transition : opacity 1500ms;
}

SECTION>*.effect-scroll,ARTICLE>*.effect-scroll,P.effect-scroll,ARTICLE LI.effect-scroll,
ARTICLE DL>*.effect-scroll,
.effect-fade.effect-scroll {
opacity : 1.0;
}

.effect-move{
opacity : 0;
transform : translate(0, 10vh);
transition : opacity 2500ms, transform 1500ms;
}
.effect-move.effect-scroll {
opacity : 1;
transform : translate(0, 0);
}


/*--------------------------------------------------------------------
  共通レイアウト枠
--------------------------------------------------------------------*/
MAIN{
display:block;
margin:0 auto;
padding-bottom:2vw;
text-align:left;
background:#FFF;
width : -webkit-calc(100% - 50px) ;
width : calc(100% - 50px);
max-width:1200px;
}
@media only screen and (min-width:901px) {	/* 幅の広いPC用 */
	MAIN{
	position:relative;
	}
	.home MAIN{
	margin:-12vw auto 0 auto;
	background:transparent;
	}
}

#two_colomun_leftmenu #content_top,	/* 「左メニュー」トップページ右側コンテンツ部 */
#two_colomun_leftmenu #content{	/* 「左メニュー」右側コンテンツ部 */
margin: 20px 0 50px 0;
float: right;
width : -webkit-calc(100% - 270px) ;
width : calc(100% - 240px);
}
@media only screen and (min-width:769px) {	/* PC用 */
	ARTICLE#content{
	min-height:90vh;
	}
}
@media only screen and (max-width:900px) {	/* 狭いPC以下用 */
	MAIN{
	display:block;
	width:96%;
	width:100%;
	}

	#two_colomun_leftmenu #content_top,	/* 「左メニュー」トップページ右側コンテンツ部 */
	#two_colomun_leftmenu #content{	/* 「左メニュー」右側コンテンツ部 */
	float: none;
	width: 100%;
	}
	#content_top,
	#content{
	padding:0 4vw;
	}

}


/*--------------------------------------------------------------------
  ヘッダー
--------------------------------------------------------------------*/
HEADER{
margin:0;
width:100%;
}
#header_inner{
margin:0 auto;
padding:5vw 2vw;
background:#000 url(img/header.jpg) no-repeat center center;
position:relative;
color:#FFF;
background-size:cover;
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
-ms-background-size:cover;
text-shadow: 1px 1px 1px #000, -1px -1px 1px rgba(0,0,0,0.5);
}

.home #header_inner{
padding:13vw 2vw;
}
@media only screen and (min-width:901px) {	/* 幅の広いPC用 */
	.home header{
	position:relative;
	}

	.home #header_inner{
	padding:14vw 2vw 26vw 2vw;
	}
	.home header::after{
	content:"";
	width:100%;
	height:15vw;
	display:block;
	position:absolute;
	bottom:0;
	left:0;
	background: -moz-linear-gradient(to bottom, transparent, #FFF);
	background: webkit-linear-gradient(to bottom, transparent, #FFF);
	background:linear-gradient(to bottom, transparent, #FFF);
	}

}
#header_inner H1{
margin:0 auto;
font-size:min(7.0vw,150.0%);	/* 24px */
}
.home #header_inner H1{
font-size:min(8.0vw,300.0%);
}
#header_inner H1 SPAN{
display:inline-block;
}
#header_inner H2{
font-size:min(8.0vw,300.0%);
}


@media only screen and (max-width:900px) {	/* 狭いPC以下用 */
	#header_inner{
	}
	#header_inner H1 SPAN{
	display:block;
	}
	#header_inner H1{
	margin-top:50px;
	}

}
@media only screen and (max-width:768px) {	/* スマホ横以下用 */
}
@media only screen and (min-width:541px) and (max-width:900px) {	/* スマホ横用 */
}
@media only screen and (max-width:540px) {	/* スマホ縦用 */
}
@media only screen and (max-width:380px) {	/* スマホS縦用 */
}

/*------------------------------------------------
  Homeボタン
------------------------------------------------*/


/*--------------------------------------------------------------------
  サイドメニュー欄 「左メニュー」
--------------------------------------------------------------------*/
#global_navi{
margin:20px 0 0 0;
width:200px;
float:left;
}



/*------ 全体 ------*/
#global_navi > SPAN{
display: none;
}
#global_navi LI{
position: relative;
}
#global_navi LI A{
display: block;
}



/*------ PCメインメニュー第一階層 ------*/
#global_navi UL{
margin:0 auto;
padding:0;
}

#global_navi UL LI{
margin:0;
padding:0;
border-bottom:solid 1px rgba(102,0,0,0.75);
}

#global_navi UL LI A{
margin:0;
padding:0.8em 1.0em;
color:#FFF;
width:auto;
text-align:left;
background:#800000;	/* Maroon */
text-decoration:none;
}
@media only screen and (min-width:901px) {	/* 幅の広いPC用 */
	#global_navi UL LI A{
	font-size:87.5%;	/* 14px */
	}
}
#global_navi UL LI A:hover{
background:#544A47;	/* 黒橡 */
}
#global_navi UL LI A::before{
position:absolute;
transform : translate(0,-50%);
top:50%;
right:0.4em;
content: "\f105";
font-family: "Font Awesome 5 Free";
font-weight : 900;
}
#global_navi UL LI.active A{
background:#A52A2A;	/* Brown */
}



/*------ 狭いPC以下用 ------*/
@media only screen and (max-width:900px) {
	
	/* ------ スマホ：メインメニューアウトライン ------ */

	#global_navi{
	margin:0;
	position:absolute;
	top:0;
	right:0;
	width:100%;
	height:50px;
	float:none;
	}
	#global_navi:has(.open){
	background:rgba(128,0,0,0.97);	/* Maroon */
	}

	#global_navi > SPAN{
	display:block;
	padding:0;
	position:absolute;
	top:0;
	right:0px;
	width: 50px;
	height: 50px;
	text-align: left;
	text-indent: -9999px;
	background:url(img/sp_nav.png) no-repeat -50px 0;
	background-size:auto 50px !important;
	-webkit-background-size:auto 50px;
	-moz-background-size:auto 50px;
	-o-background-size:auto 50px;
	-ms-background-size:auto 50px;
	cursor:pointer;
	}

	UL#globalmenu LI SPAN{
	display: block;
	}

	UL#globalmenu.open{
	display: block !important;
	}
	#global_navi > SPAN.open{
	background-position:-100px 0;
	}


	/*------------------------------------------------
	  スマホ：メインメニュー第一階層
	------------------------------------------------*/
	#global_navi{
	margin:0;
	width:100%;
	float:none;
	}
	#global_navi UL{
	padding:0 0 1.0em 0;
	display: none;
	position: absolute;
	top:50px;
	right:0;
	border-top:none;
	background:rgba(128,0,0,0.97);	/* Maroon */
	z-index:110;	/* IE7以下でプルダウンメニューが隠れるための対策 */
	text-align:center;
	}

	#global_navi UL LI{
	display:inline-block;
	border-top:none;
	border-bottom:none;
	}

	#global_navi UL LI A{
	margin:0.5em 1.0em;
	padding:0.5em;
	height:auto;
	color:#FFF;
	text-align:center;
	background-color:#800000;	/* Maroon */
	background-image:none;
	text-decoration:none;
	width:auto !important;
	border:1px solid transparent;
	}
	UL#globalmenu LI A:hover{
	background-color:#800000;	/* Maroon */
	opacity:0.8;
	}
	UL#globalmenu LI.active A{
	background-color:transparent;
	border-color:#FFF;
	}


	UL#globalmenu LI.active A:hover{
	color:#FFF;
	}

	#two_colomun_leftmenu #global_navi UL LI A::before{
	margin:0;
	content: "";
	display:none;
	}

}

/*--------------------------------------------------------------------
  パンくず・アンカー
--------------------------------------------------------------------*/
/*------------------------------------------------
  パンくずリスト
------------------------------------------------*/
#pkl{
font-size:93.75%;	/* 15px */
}
#two_colomun_leftmenu #pkl{	/* 「左メニュー」 */
margin:0;
}


/*------------------------------------------------
  アンカー 
------------------------------------------------*/
#pt{
margin:0;
z-index:100;
position: fixed;
bottom:12px;
right:10px;
width: 40px;
height: 40px;
}
#pt A{
margin:0 auto;
display: block;
width: 40px;
height: 40px;
background:rgba(84,74,71,0.5) url(img/pt.png) 0 0 no-repeat;	/* 黒橡 */
border-radius:50%;
-webkit-border-radius:50%;
-moz-border-radius:50%;
zoom: 1;
}
#pt A:hover{
background-color:rgba(128,0,0,0.5);	/* Maroon */
}
#pt A SPAN{
display:none;
}



/*--------------------------------------------------------------------
  フッター
--------------------------------------------------------------------*/
FOOTER{
padding:2.5em 2vw;
font-size:62.5%;	/* 10px */
color:#FFF;
background:#544A47;	/* 黒橡 */
position: relative;
}

@media only screen and (max-width:768px) {	/* スマホ横以下用 */
	FOOTER{
	text-align:left;
	}

}




/*--------------------------------------------------------------------
  clearfix
--------------------------------------------------------------------*/
/*------ 親要素にまとめて回り込み解除 ------*/
#global_navi:after,
MAIN:after,
#appeal:after{
    content: ""; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#global_navi,
MAIN,
#appeal{
display: inline-table;
min-height:1%;  /* for IE 7*/
}

/* Hides from IE-mac \*/
* html #global_navi,
* html MAIN,
* html #appeal,
* html #news DL{
height: 1%;
}
#global_navi,
MAIN,
#appeal{
display: block;
}
/* End hide from IE-mac */



/*------ 個別に回り込み解除 ------*/
.clearfix:after{
    content: ""; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix{
display: inline-table;
min-height:1%;  /* for IE 7*/
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

