@charset "utf-8";


/*slide.cssの読み込み*/
@import url(slide.css);



/*画面幅1450px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:1450px){

/*上の#containerのpaddingの数字部分と合わせておく*/
body.is-fixed #menubar {
	margin: 0 50px;
}

}



/*画面幅900px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:900px){

/*containerの設定（footer以外の、ホームページを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	padding: 0 3%;	/*上下、左右へのブロック内余白*/
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	position: static;
	height: auto;
	background: none;
	padding: 10px 0;
	text-align: left;
}
/*ロゴ画像*/
header #logo {
	position: static;
	margin: 0 auto ; margin-bottom:2%
}
/*フラッグ*/
header #flag {
	display: none;	/*非表示にする*/
}

/*TELブロック*/
header address {
	position: static;
}

/*文字サイズ変更ボタン（※文字サイズを「大」にした時の設定はchange.cssで行う）
---------------------------------------------------------------------------*/
/*ボタンブロック全体*/
#fsize {
	display: none;	/*非表示にする*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*アニメーションのフレーム設定。全100コマアニメーションだと思って下さい。透明(0%)から色を100%出すアニメーション指定。*/
@keyframes menu1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
/*スマホ用メニューブロック*/
#menubar-s {
	display: block;overflow: hidden;z-index: 1;
	position: fixed;
	top: 0px;			/*上からの配置場所指定*/
	left: 0px;			/*左からの配置場所指定*/
	width: 100%;		/*幅*/
	animation-name: menu1;		/*上のkeyframesの名前*/
	animation-duration: 0.5S;	/*アニメーションの実行時間。0.5秒。*/
	animation-fill-mode: both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 5px 10px;	/*上下、左右へのメニュー内の余白*/
	border-bottom: 1px solid #fff;	/*下の線の幅、線種、色*/
	background-color: rgba(0,0,0,0.8);	/*背景色*/
	font-size: 18px;		/*文字サイズ*/
	color: #fff;		/*文字色*/
}
/*英語表記（飾り文字）*/
#menubar-s li a span {
	font-size: 12px;	/*文字サイズ*/
	margin-left: 20px
}
/*PC用メニューを非表示にする*/
#menubar {display: none;}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr {
	display: block;position: fixed;z-index: 2;
	top: 25px;	/*上からの配置場所指定*/
	right: 3%;	/*右からの配置場所指定*/
	border: 1px solid #fff;	/*枠線の幅、線種、色*/
}
/*アイコン共通設定*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 42px;		/*幅*/
	height: 42px;		/*高さ*/
	border-radius: 6px;	/*円形にする。この行削除すれば正方形になります。*/
}
/*三本バーアイコン*/
#menubar_hdr.close {
	background:  rgba(0,0,0,0.8) url(../images/icon_menu.png) no-repeat center top/42px;	/*背景色、アイコンの読み込み、上半分(top)を表示、幅50px*/
}
/*閉じるアイコン*/
#menubar_hdr.open {
	background:  rgba(0,0,0,0.8) url(../images/icon_menu.png) no-repeat center bottom/42px;	/*背景色、アイコンの読み込み、上半分(bottom)を表示、幅50px*/
}

/*fixmenu。メインメニューが画面上部に到達した際の設定
---------------------------------------------------------------------------*/
body.is-fixed header {
	margin-bottom: 0px;	/*fixmenuから折りたたみメニューになるので、ここはリセット。*/
}

/*main,sub
---------------------------------------------------------------------------*/
#main, #sub {
	float: none;
	width: auto;
	overflow: hidden;
}

/*フッター設定
---------------------------------------------------------------------------*/
/*footer内のinner*/
footer .inner {
	padding: 0 3%;	/*上下、左右へのブロック内余白*/
}
/*footer内の２カラムブロックを１カラムにする*/
footer .half.fr,footer .half.fl {
	float: none;
	margin: 0 0 20px;
	width: 100%;
}

/*その他
---------------------------------------------------------------------------*/
body.s-n #sub,body.s-n #side {display: none;}
.big1 {font-size: 150%;letter-spacing: normal;}
.sh {display:block;}
.pc {display:none;}
.link {display: block;margin-top: 0px;padding-top: 0px;}

}



/*画面を横向きにした場合の高さが500px以下の場合の設定。
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (orientation: landscape) and (max-height:500px){

/*メインメニュー。小さな端末用メニューを２列に。
---------------------------------------------------------------------------*/
/*メニュー１個あたりの設定*/
#menubar-s li {
	float: left;		/*左に回り込み*/
	width: 50%;			/*幅*/
}
}



/*■■画面幅480px以下の設定■■
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:480px){

/*containerとfooterの文字サイズ指定
---------------------------------------------------------------------------*/
body {
	line-height:1.3em;		/*行間*/
}

#container, footer {
	font-size: 15px;
	font-size: 4.00vw;
}

/*ヘッダー（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #logo {
	width:40%;	/*ロゴ画像の幅*/
}
/*TELブロックの電話番号部分*/
header address .tel {
	font-size: 20px;
	background: url(../images/icon_tel.png) no-repeat left center / 18px;
	padding-left: 25px;
}

/*メインコンテンツ
---------------------------------------------------------------------------*/
/*他。微調整。*/
#main section + section {
	padding-top: 20px;
}

#main h2 {
	font-size: 105%;	}


/*フッター設定
---------------------------------------------------------------------------*/

footer .logo{ width:100px}

/*フッター内のaddress（電話番号の行）タグ*/
footer address .tel {
	font-size: 24px;
	background: url(../images/icon_tel.png) no-repeat left center / 20px;
	padding-left: 30px;
}

/*listブロック
---------------------------------------------------------------------------*/
/*ブロック１個あたりの設定*/
.list {
	width: auto;
	float: none;
	margin-left : 0;
}
.list figure {
	float: left;
	width: 40%;
	margin-right: 2%;
}


/*廃棄*/
.pic_list h4, .pic_list p {
	height: ;
}


.pic_list {
	width: 43%;

}

.pic_list p {
	height: 3em;		/*高さ。1.5emを１行分とカウントして下さい。6emなら４行です。*/
}




/*よく頂く質問
---------------------------------------------------------------------------*/
.faq dt,.faq dd {
	background-size: 25px;
}

/*テーブル（ta1）
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
	padding: 5px;	/*ボックス内の余白*/
}
/*ta1設定*/
.ta1, .ta1 td, .ta1 th {width: 96%}
.ta1, .ta1 td, .ta1 th {
	padding: 5px;	/*ボックス内の余白*/
}
/*ta1の左側ボックス*/
.ta1 th {
	width: 100px;
}

/*その他
---------------------------------------------------------------------------*/
.ws,.wl {width: 94%;}

}