@charset "utf-8";


/*Google Fontsの読み込み
---------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=BIZ+UDPGothic&family=Kiwi+Maru:wght@300;400;500&display=swap');


/*header（ロゴなどが入った最上段のブロック）
---------------------------------------------------------------------------*/
header {
	height: 46px;
}

header a {
	text-decoration: none;
}

/*ロゴ文字*/
header #logo {
	width: auto;		/*ロゴの幅*/
	padding: 5px 40px;	/*ロゴ内の余白。ロゴ画像と背景グラデーションの余白です。*/
	left: 0%;	/*ヘッダーの左からの配置場所の指定*/
}

header #logo img {
	display:inline-block;
	height: 24px;
}

h1#logo {
	font-size: 1.2em;
}

h1#logofix {
	font-size: 1.2em;
}

/*メニュー１個あたりの設定*/
#menubar a.sns {
	padding: 8px 15px 5px 15px;	/*上下、左右への余白*/
}

#menubar img.sns {
	height: 20px;
}


/*３本バーを囲むブロック*/
#menubar_hdr {
	top: 50px;			/*上からの配置場所指定*/
}


/*ドロップダウンメニュー
---------------------------------------------------------------------------*/
/*ドロップダウンメニューを持つ親に矢印アイコンをつける設定*/
a.ddmenu::before {
	font-family: none;
	content: url(../images/icon_down.png);		/*使いたい画像をここで指定。*/
	font-weight: bold;		/*この手の設定がないとアイコンが出ない場合があります*/
	margin-right: 0.2em;	/*アイコンとテキストとの間に空けるスペース*/
}


/*FAQ
---------------------------------------------------------------------------*/
/*アイコン（Font Awesome）*/
.faq dt::before {
	font-family: none;
	content: url(../images/icon_hatena.png);		/*使いたい画像をここで指定。*/
	color: #001478;			/*アイコンの色*/
	padding-right: 1em;		/*アイコンとテキストの間の余白*/
}


/*スライドショー（slickを使用）
---------------------------------------------------------------------------*/
.slider-image {
    margin: 0;
    padding: 0;
    line-height: 0}

.slick-outer {
	position: relative;
}

.slick-content{
	position: absolute;
	top: 45%;left: 10%;
/*  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);*/
	z-index: 150;
	color: #fff;
	img{width: 100%;}
	margin: 0 10px;padding: 0;
	text-align: left;
/*  p{margin: 0;padding: 0;font-weight: bold;font-size: 1rem;color: #000;}*/
/*  h2{margin: 0;padding: 0;font-weight: bold;font-size: 3rem;color: #000;}*/
	p {
		position: absolute;
		-ms-transform: translate(0, 3rem);
		-webkit-transform: translate(0, 3rem);
		transform: translate(0, 3rem);
		z-index: 150;
		margin: 0;
		padding: 0;
		font-weight: bold;
	}
	h2 {margin: 0;
		padding: 0;
		font-weight: bold;
	}
}

.slick-content h2 {
/*	font-family: 'BIZ UDPGothic', sans-serif;
	font-family: 'Kiwi Maru', serif;*/
	font-size: 1rem;
	color: #fff;
	text-shadow: 0 0 0.4em rgba(0,0,0,1);}

.slick-content p {
/*	font-family: 'BIZ UDPGothic', sans-serif;
	font-family: 'Kiwi Maru', serif;*/
	font-size: 0.5rem;
	color: #fff;
	text-shadow: 0 0 0.2em rgba(0,0,0,1);}
}

/*mainブロック
---------------------------------------------------------------------------*/
main h3::before {
	margin-left: 20px;
}

.soba {
	margin-left: 20px;
}

.copper h4 {
	margin-left: 20px;
	margin-bottom: 0;
}

.soba .sp{
	Display: ;
}


/*listブロック
---------------------------------------------------------------------------*/
/*listブロック全体を囲むブロック*/
.list3-container {
	text-align: center;
}

.list3-container .list {
	text-align: center;
	margin-top: 30px;
	margin-bottom: 0;
}

.list3-container .list a {
	text-decoration: none;
}

/*ボックス内のtextブロック*/
.list3-container .list p {
	color: #ffffff;
	text-shadow: 0 0 0.2em rgba(0,0,0,1);
	font-size: 1.0em;
	line-height: 1.5;
}

.list3-container .list  h4 {
	color: #ffffff;
	text-shadow: 0 0 0.2em rgba(0,0,0,1);
	font-size: 1.5em;
}

img.topimg {
	width: 128px;
	filter: drop-shadow(5px 5px 5px #000);
}

/*ボタン
---------------------------------------------------------------------------*/
.button-001 {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 200px;
	margin: 20px auto 10px;
	padding: 0.6em 0.6em;
	border: 2px solid #ffffff;
	color: #ffffff;
	font-size: 1em;
	background: none;
	text-shadow: 0 0 0.2em rgba(0,0,0,1);
}

/*エラー表示
---------------------------------------------------------------------------*/
#Error {
	color: red;
	font-size: 16px;
	line-height: 1.2;
}
.error {
	color: red;
	font-size: 12px;
	line-height: 1.0;
	padding-top: 2px;
}

/*その他
---------------------------------------------------------------------------*/
.c {text-align: center !important;}
.r {text-align: right !important;}
.l {text-align: left !important;}
.ws {width: 95%;display: block;}
.wl {width: 95%;display: block;}
.clearboth {display: block;clear: both;}

.mt0  {margin-top:  0px !important;}
.mt5  {margin-top:  5px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}

.mb0  {margin-bottom:  0px !important;}
.mb5  {margin-bottom:  5px !important;}
.mb10 {margin-bottom: 10px !important;}
.mb20 {margin-bottom: 20px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb40 {margin-bottom: 40px !important;}
.mb50 {margin-bottom: 50px !important;}

.ml0  {margin-left:  0px !important;}
.ml5  {margin-left:  5px !important;}
.ml10 {margin-left: 10px !important;}
.ml20 {margin-left: 20px !important;}
.ml30 {margin-left: 30px !important;}
.ml40 {margin-left: 40px !important;}
.ml50 {margin-left: 50px !important;}

.mr0  {margin-right:  0px !important;}
.mr5  {margin-right:  5px !important;}
.mr10 {margin-right: 10px !important;}
.mr20 {margin-right: 20px !important;}
.mr30 {margin-right: 30px !important;}
.mr40 {margin-right: 40px !important;}
.mr50 {margin-right: 50px !important;}

.pt0  {padding-top:  0px !important;}
.pt5  {padding-top:  5px !important;}
.pt10 {padding-top: 10px !important;}
.pt20 {padding-top: 20px !important;}
.pt30 {padding-top: 30px !important;}
.pt40 {padding-top: 40px !important;}
.pt50 {padding-top: 50px !important;}

.pb0  {padding-bottom:  0px !important;}
.pb5  {padding-bottom:  5px !important;}
.pb10 {padding-bottom: 10px !important;}
.pb20 {padding-bottom: 20px !important;}
.pb30 {padding-bottom: 30px !important;}
.pb40 {padding-bottom: 40px !important;}
.pb50 {padding-bottom: 50px !important;}

.pl0  {padding-left:  0px !important;}
.pl5  {padding-left:  5px !important;}
.pl10 {padding-left: 10px !important;}
.pl20 {padding-left: 20px !important;}
.pl30 {padding-left: 30px !important;}
.pl40 {padding-left: 40px !important;}
.pl50 {padding-left: 50px !important;}

.pr0  {padding-right:  0px !important;}
.pr5  {padding-right:  5px !important;}
.pr10 {padding-right: 10px !important;}
.pr20 {padding-right: 20px !important;}
.pr30 {padding-right: 30px !important;}
.pr40 {padding-right: 40px !important;}
.pr50 {padding-right: 50px !important;}

.black   {color: #000000 !important;}
.gray    {color: #808080 !important;}
.silver  {color: #c0c0c0 !important;}
.white   {color: #ffffff !important;}
.blue    {color: #0000ff !important;}
.navy    {color: #000080 !important;}
.teal    {color: #008080 !important;}
.green   {color: #008000 !important;}
.lime    {color: #00ff00 !important;}
.aqua    {color: #00ffff !important;}
.yellow  {color: #ffff00 !important;}
.red     {color: #ff0000 !important;}
.fuchsia {color: #ff00ff !important;}
.olive   {color: #808000 !important;}
.purple  {color: #800080 !important;}
.maroon  {color: #800000 !important;}

.bg_black   {background: #000000 !important;}
.bg_gray    {background: #808080 !important;}
.bg_silver  {background: #c0c0c0 !important;}
.bg_white   {background: #ffffff !important;}
.bg_blue    {background: #0000ff !important;}
.bg_navy    {background: #000080 !important;}
.bg_teal    {background: #008080 !important;}
.bg_green   {background: #008000 !important;}
.bg_lime    {background: #00ff00 !important;}
.bg_aqua    {background: #00ffff !important;}
.bg_yellow  {background: #ffff00 !important;}
.bg_red     {background: #ff0000 !important;}
.bg_fuchsia {background: #ff00ff !important;}
.bg_olive   {background: #808000 !important;}
.bg_purple  {background: #800080 !important;}
.bg_maroon  {background: #800000 !important;}

.ws10  {width:  10px;}
.ws20  {width:  20px;}
.ws30  {width:  30px;}
.ws40  {width:  40px;}
.ws50  {width:  50px;}
.ws60  {width:  60px;}
.ws70  {width:  70px;}
.ws80  {width:  80px;}
.ws90  {width:  90px;}
.ws100 {width: 100px;}
.ws125 {width: 125px;}
.ws150 {width: 150px;}
.ws175 {width: 175px;}
.ws200 {width: 200px;}

.ws40p {width:  40%;}
.ws45p {width:  45%;}
.ws50p {width:  50%;}

.ws45p5em {width: calc(90% - 5em);}
.ws45p100px {width: calc(90% - 100px);}

.fwn {font-weight: normal;}
.fwb {font-weight: bold;}
.fwl {font-weight: lighter;}




/*---------------------------------------------------------------------------
ここから下は画面幅600px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:600px) {

.list3-container .list a {
	display: flex;
	justify-content: space-around;
}

.list3-container .list text {
	padding-left: 34%;
}

img.topimg {
	width: 256px;
	filter: drop-shadow(5px 5px 5px #000);
}

.sh {display: none;}


/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで下さい。　*/

}





/*---------------------------------------------------------------------------
ここから下は画面幅900px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:900px) {

/*header（ロゴなどが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	height: 46px;
}


/*listブロック全体を囲むブロック*/
.list3-container {
	display: flex;		/*flexボックスを使う指定*/
	flex-wrap: wrap;	/*折り返す指定*/
	justify-content: space-around;	/*並びかたの種類の指定*/
}

.list3-container .list a {
	flex-direction: column;
/*	width: 32%;*/
}

img.topimg {
	width: 128px;
	filter: drop-shadow(5px 5px 5px #000);
}

/*listブロック
---------------------------------------------------------------------------*/
/*listブロック全体を囲むブロック*/
.list-container::after {
	content:"";
	display: block;
	width:32%;
}

.list3-container::after {
	content:"";
	display: block;
	width:32%;
}


/*FAQ
---------------------------------------------------------------------------*/
/*FAQボックス全体*/
.faq {
	padding: 0 20px;	/*上下、左右へのボックス内の余白*/
}


/*スライドショー（slickを使用）
---------------------------------------------------------------------------*/
.slick-content h2 {
	font-family: 'BIZ UDPGothic', sans-serif;
	font-family: 'Kiwi Maru', serif;
	font-size: 3rem;
	color: #fff;
}

.slick-content p {
	font-family: 'BIZ UDPGothic', sans-serif;
	font-family: 'Kiwi Maru', serif;
	font-size: 1rem;
	color: #fff;
}


/*その他
---------------------------------------------------------------------------*/
.ws {width: 48%;display: inline;}


/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで下さい。　*/

}