@charset "utf-8";


/*keyframes.cssの読み込み
---------------------------------------------------------------------------*/
@import url("keyframes.css");

/*lightbox.cssの読み込み
---------------------------------------------------------------------------*/
@import url(https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.10.0/css/lightbox.css);

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

/*Google Fontsの読み込み
---------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@300&display=swap');


/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/

/*全体の設定
---------------------------------------------------------------------------*/
html,body { font-size:16px;}
body { margin:0px; padding:0px; color:#999; font-family:"M PLUS Rounded 1c", "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; line-height:2; background:#fff; -webkit-text-size-adjust:none;	overflow-x:hidden;}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin:0px;padding:0px;font-size:1rem;font-weight:normal;}
ul {list-style-type:none;}
ol {padding-left:40px;padding-bottom:15px;}
img {border:none;max-width:100%;height:auto;vertical-align:middle;}
table {border-collapse:collapse;font-size:1rem;border-spacing:0;}
video {max-width:100%;}
iframe {width:100%;}

/*リンク（全般）設定
---------------------------------------------------------------------------*/
a { color:#999; transition:0.2s;}
a:hover { color:#a9d1ec; text-decoration:none;}

/*container（サイト全体を囲むブロック）
---------------------------------------------------------------------------*/
#container {/*margin:40px;	ブロックの外側にとるスペース*/}

/*section
---------------------------------------------------------------------------*/
section {overflow:hidden;}

/*ヘッダー
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header { position:relative; width:100%; height:100px;}
/*ヘッダーブロック（※トップページへの追加設定）*/
.home header { height:auto;}
/*ロゴ画像*/
header #logo { position:absolute;z-index:1; left:40%; top:60%; width:20%;}
/*ロゴ画像（※トップページへの追加設定）*/
.home header #logo { top:30%;}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr { display:block; position:fixed;z-index:100; top:60px; left:60px;}
/*アイコン共通設定*/
#menubar_hdr.close,
#menubar_hdr.open { width:50px; height:50px;}
/*三本バーアイコン*/
#menubar_hdr.close { background:url(../images/icon_menu.png) no-repeat center top/50px;}
/*閉じるアイコン*/
#menubar_hdr.open { background:url(../images/icon_menu.png) no-repeat center bottom/50px;}

/*メインメニューブロックの設定
---------------------------------------------------------------------------*/
#menubar {
    animation-name:opa1;		/*keyframes.cssで使う@keyframesの指定*/
	animation-duration:1S;
	animation-fill-mode:both;	/*アニメーションの待機中は最初のキーフレームを維持、終了後は最後のキーフレームを維持。*/
	background:rgba(255,255,255,0.9);
	position:fixed;overflow:auto;z-index:99;
	left:0px; top:0px; width:100%; height:100%; text-align:center;}
#menubar a { text-decoration:none;}
/*メニューブロックの上に空ける余白*/
#menubar ul { margin-top:200px;}
/*文字サイズ。冒頭で指定しているフォントサイズの1.25倍です。*/
#menubar li { font-size:1.25rem;}

/*コンテンツ
---------------------------------------------------------------------------*/
#contents { padding:150px 100px; position:relative; animation-name:opa1;/*keyframes.cssで使う@keyframesの指定*/ animation-duration:0.5S; animation-delay:0.5s;/*出現するタイミング（秒後）*/ animation-fill-mode:both;}
/*h2タグ*/
#contents h2 { clear:both; margin-bottom:50px; font-size:2.25rem; text-align:center; letter-spacing:0.1em;}
/*h2タグ内のspanタグ（装飾文字）*/
#contents h2 span { display:inline-block;white-space:nowrap; font-size:0.875rem; border-top:3px solid #a9d1ec; padding:15px 20px 0;}
/*h3タグ*/
#contents h3 { width: 60%; margin: 0 auto; clear:both; margin-bottom:30px; font-size:1.5rem; border-bottom:1px dashed #999; padding-left:3%; letter-spacing:0.1em;}
/*h3タグ内のspanタグ（装飾文字）*/
#contents h3 span { display:inline-block; font-size:0.875rem; padding-left:20px;}
/*段落タグ*/
#contents p { padding:0 3% 30px;}
/*他、微調整*/
#contents h2 + p,
#contents h3 + p { margin-top:-5px;}
#contents p + p { margin-top:-10px;}
#contents section + section { margin-top:100px;}
#contents p { width: 60%; margin: 0 auto;}
/*list（円形のサムネイル用）
---------------------------------------------------------------------------*/
/*ボックスの設定*/
#contents .list { float:left; overflow:hidden; border-radius:50%; margin:0 6.6% 40px; width:20%;}

/*フッター設定
---------------------------------------------------------------------------*/
footer { clear:both; font-size:0.75rem; text-align:center; box-shadow:0px 0px 50px #fff inset; padding:3%; background:url(../images/1.jpg) no-repeat center center / cover; color:#666;}
footer small {font-size:100%;}
footer a {text-decoration:none;color:#666 !important;}
footer .pr {display:block;}

/*facebookやtwitterなどのアイコン
---------------------------------------------------------------------------*/
/*アイコン全体を囲むブロック*/
ul.icon { margin-bottom:20px;}
/*アイコン１個あたりの設定*/
ul.icon li { display:inline-block;}
/*アイコン画像の設定*/
ul.icon img { width:30px;}
ul.icon img:hover { opacity:0.8;}

/*table設定
---------------------------------------------------------------------------*/
.ta{ width: 65%; margin:5px auto;}
.ta tr {border-bottom:1px solid #eee; height:40px;}

/*checkブロック。赤い注意書きブロックです。
---------------------------------------------------------------------------*/
p.check { background:#ff0000; color:#fff; padding:10px 25px !important; margin-bottom:20px;}
p.check a {color:#fff;}

/*トップページのNEWアイコン
---------------------------------------------------------------------------*/
.newicon { background:#F00; color:#FFF; line-height:1.5; padding:2px 5px; border-radius:2px; margin:0px 5px; vertical-align:text-top;}

/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
/*通常時のボタンは非表示*/
body .nav-fix-pos-pagetop a {display:none;}
/*fixmenu_pagetop.jsで設定している設定値になったら出現するボタンスタイル*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a { display:block; text-decoration:none; text-align:center; width:50px; line-height:50px; z-index:1; position:fixed; bottom:20px; right:3%; background:#666; background:rgba(0,0,0,0.6); color:#fff; border:1px solid #fff; animation-name:opa1;	/*keyframes.cssで使う@keyframesの指定*/ animation-duration:1S; animation-fill-mode:both;}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover { background:#999;}

/*ul.disc,olタグ
---------------------------------------------------------------------------*/
ul.disc { list-style:disc; padding:0 3% 20px 6%;}
ol { padding:0 3% 20px 6%;}

/*その他
---------------------------------------------------------------------------*/
.clearfix::after {content:"";display:block;clear:both;}
.look {background:rgba(0,0,0,0.1);border:1px solid #ccc;display:inline-block;padding:0px 10px !important;border-radius:4px;}
.mb15,.mb1em {margin-bottom:15px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb50 {margin-bottom:50px !important;}
.plr3p {padding-left:3% !important;padding-right:3% !important;}
.clear {clear:both;}
.color1, .color1 a {color:#ad83b4 !important;}
.wl {width:96%;}
.ws {width:50%;}
.w48p {width:48%;}
.c {text-align:center !important;}
.r {text-align:right !important;}
.l {text-align:left !important;}
.fl {float:left;}
.fr {float:right;}
.sh {display:none;}
.ofh {overflow:hidden;}

/*メールフォーム*/
#mailformpro dl {width: 60%; margin: 0 auto;}
#mailformpro dl dt { float: none; width: auto; clear: both; font-size: 12px; padding: 10px 0 0 10px; text-align: left; border-top: solid 1px #CCC;	margin: 0px;}
#mailformpro dl dt,
#mailformpro dl dt span { vertical-align: middle; line-height: 1em;}
#mailformpro dl dt span { margin-top: -0.3em;}
#mailformpro dl dd { border: none; margin: 0px; padding: 10px; font-size: 12px; line-height: 1.5em; text-align: left;}
.mfp_rows {	clear: both;}
.mfp_rows:after { content: ""; clear: both; height: 0; display: block; visibility: hidden;}
.mfp_rows input[type="text"],
.mfp_rows input[type="email"],
.mfp_rows input[type="tel"],
.mfp_rows input[type="number"],
.mfp_rows input[type="date"],
.mfp_rows input[type="file"],
.mfp_rows select,
.mfp_rows button,
form#mailformpro .mfp_rows label { width: 100%; min-width: 100%; word-break: break-all; white-space: normal;}
.mfp_rows textarea { width: 100%; min-width: 100%;}
.mfp_rows .mfp_col1,.mfp_rows .mfp_col2,.mfp_rows .mfp_col3,.mfp_rows .mfp_col4,.mfp_rows .mfp_col5,.mfp_rows .mfp_col6,.mfp_rows .mfp_col7,.mfp_rows .mfp_col8,.mfp_rows .mfp_col9,.mfp_rows .mfp_col10 { float: left; padding: 0 1.5%;}

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

/*コンテンツ
---------------------------------------------------------------------------*/
#contents { padding:50px 0px;}

}

/*画面が横向きの場合の設定、かつ、画面幅800px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (orientation:landscape) and (max-width:800px){

/*メインメニューブロックの設定
---------------------------------------------------------------------------*/
/*メニューブロックの上に空ける余白*/
#menubar ul { margin-top:80px;}

}

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

/*全体の設定
---------------------------------------------------------------------------*/
html,body { font-size:15px;}

/*ヘッダー
---------------------------------------------------------------------------*/
/*ロゴ画像*/
header #logo { left:30%; width:40%; top:40%;}

/*３本バーアイコン設定
---------------------------------------------------------------------------*/
/*３本バーブロック*/
#menubar_hdr { top:30px; left:3%;}

/*コンテンツ
---------------------------------------------------------------------------*/
/*h2タグ*/
#contents h2 { margin-bottom:30px;}
/*他、微調整*/
#contents section + section { margin-top:50px;}

/*テーブル（ta1）
---------------------------------------------------------------------------*/
/*ta1設定*/
.ta1, .ta1 td, .ta1 th { padding:5px;}
/*ta1の左側ボックス*/
.ta1 th { width:100px;}

/*table設定
---------------------------------------------------------------------------*/
.ta{ width: 100%; margin:5px auto;}
.ta tr {border-bottom:1px solid #eee; height:40px;}

/*その他
---------------------------------------------------------------------------*/
.ws,.wl {width:94%;}
.w48p {width:100%;}
.fl {float:none;}
.fr {float:none;}
.sh {display:block;}
.pc {display:none;}

}