@charset "UTF-8" ;


@font-face {
  font-family: "YuGothic M";
  src: local("Yu Gothic Medium");
}


/* ボディ */
body
{
	margin: 0 ;		/* スペース */
	padding: 0 ;		/* 余白 */
	font-size: 18px ;	/* 文字サイズ */
	font-family: "游ゴシック体", YuGothic, "YuGothic M", sans-serif;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* ボディ */
	body
	{
		font-size: 15px ;	/* 文字サイズ */
	}
}


/* 一般テキストＰタグ */
p.text
{
	margin-left: 30px ;		/* スペース */
	margin-right: 15px ;		/* スペース */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* 一般テキストＰタグ */
	p.text
	{
		margin-left: 20px ;		/* スペース */
		margin-right: 10px ;		/* スペース */
	}
}


/* iframeレスポンシブその1-index用 */

.ifrm-container {
	width:93%;
	height:600px;
	overflow-y:auto;
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;
	display: inline-block;
	border:double;
	margin: 2% ;
}

.ifrm {
	width:100%;
	height:100%;
	border:none;
	display:block;
}


/* iframeレスポンシブその2-専用ページ用 */

.ifrm-container2 {
	width:96%;
	height:800px;
	overflow-y:auto;
	overflow-x:hidden;
	-webkit-overflow-scrolling:touch;
	display: inline-block;
	border:double;
	margin: 2% ;
}

.ifrm2 {
	width:100%;
	height:100%;
	border:none;
	display:block;
}


/* h1 */
h1
{
	margin: 0 ;		/* スペース */
	padding: 0 ;		/* 余白 */
	font-size: 12px ;	/* 文字サイズ */
}


/* h1見出し用 */
.h1midashi
{
	background-image: url("./img/cptb.jpg");
	padding: 10px ;		/* 余白 */
	font-size: 30px ;	/* 文字サイズ */
	color: #ffffff ;	/* 文字サイズ */
	margin-top: 3px ;	/* 文字サイズ */
}


/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* h1見出し用 */
	.h1midashi
	{
		background-image: url("./img/cptb.jpg");
		padding: 10px ;		/* 余白 */
		font-size: 16px ;	/* 文字サイズ */
		color: #ffffff ;	/* 文字サイズ */
		margin-top: 3px ;	/* 文字サイズ */
	}
}


/* h2 */
h2
{
	background-color:#ffff66;
	border: 1px solid gray;
	margin-top: 10px ;		/* スペース */
	padding: 5px ;		/* 余白 */
	font-size: 15px ;	/* 文字サイズ */
}

/* h2見出し */
h2.title
{

	font-size: 24px ;
	margin-top: 20px ;		/* スペース */
	background: #ffff66;
	box-shadow: 0px 0px 0px 6px #ffff66;
	border: dashed 1px #993300;
	padding: 0.8em 1.0em;
	border-radius: 0.5em;	/*角丸*/

}


/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* h2見出し */
	h2.title
	{
		font-size: 16px ;
		margin-top: 18px ;		/* スペース */
		background: #ffff66;
		box-shadow: 0px 0px 0px 4px #ffff66;
		border: dashed 1px #993300;
		padding: 1.0em 0.5em;
		border-radius: 0.5em;	/*角丸*/
	}
}


/* 見出し装飾 */
article h3 {
position: relative;
background: -webkit-linear-gradient(top, #cccac3 0%, #f3f3f3 100%);
background: linear-gradient(to bottom, #cccac3 0%, #f3f3f3 100%);
padding: 12px 0px 12px 15px ;
margin: 40px 0px 20px;
}



/*============================================
表
============================================*/

ul.spec {
list-style:none;
margin-left:0px;
}

li.first {
margin-top: 20px;
border: 1px solid #cccccc;
width: 95%;
}

li.next {
width: 95%;
border-left: 1px solid #cccccc;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}

span.dan {
float: left;
padding: 10px;
width: 40%;
margin-left: 0%;
}

span.dan2 {
display: block;
margin-left: 40%;
padding: 10px;
border-left: 1px solid #cccccc;
width: 60%;
}



/* テキストエリア1 */
p.tarea1
{
	width: 90%;
	margin: 0;
	font-size: 120%;
	padding: 2.0em 1.0em;
	border: 1px solid #cccccc;
}


/* テキストエリア2 */
p.medate
{
	font-size: 120%;
	color: #ff0066;
}


/* テキストエリア3 */

.use2
{

	margin: 0;
	background-image:url("img/use_bg1.jpg") no-repeat;

}


/*============================================
サイドメニュー
============================================*/
/* ul */
.sideul
{
	list-style-type:none ;
	padding-left:0px ;
}

.sideli
{
	padding:8px ;
	background: -webkit-linear-gradient(top, #e0cbd6 0%, #f3f3f3 100%);
	background: linear-gradient(to bottom, #e0cbd6 0%, #f3f3f3 100%);
	margin-bottom: 4px;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{

	/* ul */
	.sideul
	{
		list-style-type:none ;
		padding-left:0px ;
	}


	/* li */
	.sideli
	{
		font-size: 18px ;	/* 文字サイズ */
		padding-left:10px ;
		margin-bottom: 4px ;
		border-bottom: 1px solid gray;
		border-top: 1px solid gray;
		border-right: 1px solid gray;
		border-left: 1px solid gray;
	}
}



/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pcheader { display: block !important; width: 970px; margin:auto ; }
.spheader { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 749px) 
{
.pcheader { display: none !important; }
.spheader { display: block !important; width: 100% ; }
}



/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pcside { display: block !important; width: 180px; margin:0 ; }
.spside { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 749px) 
{
.pcside { display: none !important; }
.spside { display: block !important; width: 100% ; }
}



/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pcnagare { display: block !important; width: 970px; margin:0 ; }
.spnagare { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 749px) 
{
.pcnagare { display: none !important; }
.spnagare { display: block !important; width: 100% ; }
}



/* ヘッダー */
.header
{
	border-bottom: 2px solid #cccccc ;		/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	padding: 1em 0 ;			/* 上下の余白 */
	margin-bottom: 1em ;			/* 他のブロックとのスペース */
	background: #ffffff;			/* 背景色(確認用) */
}

/* ロゴ画像を囲むh1 */
.logo-wrapper
{
	margin: 0 ;
	padding: 0 ;
	line-height: 1 ;
}

/* ロゴ画像 */
.logo
{
	width: 400px ;
	height: auto ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* ロゴ画像 */
	.logo
	{
		width: 100% ;
	}
}


/* ヘッダー画像 */
.headerimg
{
	width: 970px ;
	height: auto ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* ロゴ画像 */
	.headerimg
	{
		width: 100% ;
	}
}




/*============================================
メインメニュー
============================================*/
ul#menu {
	height:50px; background-color:#ffffff; font-weight:; font-size:18px; width: 970px; margin: 10px auto ; padding: 0 ;

}
li#menu01,li#menu02,li#menu03,li#menu04,li#menu05 {
	float:left;			/*リスト項目を横に並べる*/
	display:inline;			/*リスト項目をインライン表示にする*/
	list-style-type:none;		/*リストマーカー無しにする*/
	background-repeat:no-repeat; 	/*背景画像を繰り返さない*/
	margin-bottom: 0em ;		/* 他のブロックとのスペース */
}

/*ボタン01～05にはそれぞれ異なる背景画像を指定する*/
li#menu01 {
	width:194px; height:auto;	/*背景画像に合わせたサイズ指定*/
	background-image:url("img/bg_menu_01.jpg");	/*背景画像*/
}
li#menu02 {
	width:194px; height:auto;	/*背景画像に合わせたサイズ指定*/
	background-image:url("img/bg_menu_02.jpg");	/*背景画像*/
}
li#menu03 {
	width:194px; height:auto;	/*背景画像に合わせたサイズ指定*/
	background-image:url("img/bg_menu_03.jpg");	/*背景画像*/
}
li#menu04 {
	width:194px; height:auto;	/*背景画像に合わせたサイズ指定*/
	background-image:url("img/bg_menu_04.jpg");	/*背景画像*/
}
li#menu05 {
	width:194px; height:auto;	/*背景画像に合わせたサイズ指定*/
	background-image:url("img/bg_menu_05.jpg");	/*背景画像*/
}
ul#menu a {
	display:block;				/*リンクをブロック表示にする*/
	height:50px; padding-top:8px; text-align:center;
	text-decoration:; 			/*リンクの下線を無くす*/
	font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
}



/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{

	ul#menu {
		height:30px; background-color:#ffffff; font-weight:bold; font-size:11px; text-shadow:#ffffff 1px 1px 0px, #ffffff -1px 1px 0px, #ffffff 1px -1px 0px, #ffffff -1px -1px 0px; width: 100%; margin: 5px auto ; padding: 0 ;
	}
	li#menu01,li#menu02,li#menu03,li#menu04,li#menu05 {
		float:left;			/*リスト項目を横に並べる*/
		display:inline;			/*リスト項目をインライン表示にする*/
		list-style-type:none;		/*リストマーカー無しにする*/
		background-repeat:no-repeat; 	/*背景画像を繰り返さない*/
		margin-bottom: 2em ;		/* 他のブロックとのスペース */
	}


	li#menu01 {
		width:20%; height:auto;	/*背景画像に合わせたサイズ指定*/
		background-image:url("img/bg_menu_01.jpg");	/*背景画像*/
	}

	li#menu02 {
		width:20%; height:auto;	/*背景画像に合わせたサイズ指定*/
		background-image:url("img/bg_menu_02.jpg");	/*背景画像*/
	}

	li#menu03 {
		width:20%; height:auto;	/*背景画像に合わせたサイズ指定*/
		background-image:url("img/bg_menu_03.jpg");	/*背景画像*/
	}

	li#menu04 {
		width:20%; height:auto;	/*背景画像に合わせたサイズ指定*/
		background-image:url("img/bg_menu_04.jpg");	/*背景画像*/
	}

	li#menu05 {
		width:20%; height:auto;	/*背景画像に合わせたサイズ指定*/
		background-image:url("img/bg_menu_05.jpg");	/*背景画像*/
	}

	ul#menu a {
		display:block;				/*リンクをブロック表示にする*/
		height:25px; padding-top:5px; text-align:center;
		text-decoration:; 			/*リンクの下線を無くす*/
		font-family:Arial, Helvetica, sans-serif;	/*フォントの種類*/
	}


}


/* 一般画像 */
.img0
{
	vertical-align: bottom;
	width: 750px ;
	height: auto ;
	margin: 0px ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* 一般画像 */
	.img0
	{
		vertical-align: bottom;
		width: 100% ;
	}
}


/* 半分画像左 */
.img501
{
	vertical-align: bottom;
	width: 375px ;
	height: auto ;
	float: left;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* 半分画像左 */
	.img501
	{
		vertical-align: bottom;
		width: 50% ;
		float: left;
	}
}


/* 半分画像右 */
.img502
{
	vertical-align: bottom;
	width: 375px ;
	height: auto ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* 半分画像右 */
	.img502
	{
		vertical-align: bottom;
		width: 50% ;
	}
}


/* テキスト内の画像左寄せ */
.imgl1
{
	vertical-align: bottom;
	width: 200px ;
	height: auto ;
	float: left;
	margin-right: 20px;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	/* テキスト内の画像左寄せ */
	.imgl1
	{
		vertical-align: bottom;
		width: 30% ;
		float: left;
		margin-right: 10px;
	}
}


/* ビデオ */
video
{
	width: auto ;
	height: auto ;
	border: inset 5px #000099 ;
}


/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{

/* ビデオ */
video
	{
		width: 95% ;
		border: inset 5px #000099 ;
	}
}

.tv
{
	text-align: center ;
	margin-bottom: 5px ;
}

/* フッター */
.footer
{
	font-size: 11px ;
	border-top: 1px solid gray;	/* 枠線 */
	text-align: center ;			/* テキスト、画像の真ん中寄せ */
	margin-top: 1em ;			/* 他のブロックとのスペース */
	padding: 1em 0 ;			/* 上下の余白 */
	background: #e8e8e8 ;
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.wrapper
{
	width: 970px ;
	margin: 0 auto ;		/* 左右に[auto]を指定することで、真ん中に寄る */
	padding: 0 ;			/* 上下左右の余白を0にしておく */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	.wrapper
	{
		width: auto ;
		padding: 0 5px ;
	}
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
{
	width: 750px ;
	padding: 0px 10px ;		/* 上下左右に20pxの余白 */
	border: 0px solid rgba(0,0,0,.1) ;		/* 枠線 */
	margin-top: 14px ;
	margin-bottom: 8px ;
}

.side
{
	width: 180px ;
	padding-top: 18px ;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	.main
	{
		width: 100% ;
		padding: 0 ;		/* 余白 */
		border: none ;		/* 枠線 */
	}

	.side
	{
		width: auto ;
	}
}

/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
{
	float: right ;		/* 右に寄せる */
}

.side
{
	float: left ;		/* 左に寄せる */
}

/* スマホだけに適用するCSS */
@media screen and (max-width:749px)
{
	.main , .side
	{
		float: none ;
	}
}

.wrapper
{
	overflow: hidden ;
}

