@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');

/* MEMO */
/* ブルー：006ab8 */

/*================================================
 *  CSSリセット
 ================================================*/
* { margin:0; padding:0; border:0; outline:0; vertical-align:baseline; background:transparent; word-wrap:break-word; box-sizing:border-box; }
footer, header, nav, section { display:block; }
div, nav, section, dl, ul { overflow:hidden; }
ul { list-style:none; }
table { border-collapse:collapse; border-spacing:0; table-layout:fixed; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:5px 0; padding:0; }
form, input,select,textarea { vertical-align:middle; box-sizing:border-box; }
input, button, textarea, select { -webkit-appearance:none; -moz-appearance:none; appearance:none; }

/*================================================
 *  タグ定義
 ================================================*/
* { line-height:1.6; font-size:16px; }
html { background-color:#ddd; }
body { -webkit-text-size-adjust:none; background-color:white; }
body, textarea, input { font-family:'Noto Sans JP', sans-serif; }
p:not(:last-child) { margin-bottom:0.3em; }
a { background:transparent; text-decoration:none; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); color:#222; }
a:hover, a:focus { text-decoration:none; outline:none; }
a:hover, input[type="submit"]:hover, .button:hover { opacity:0.7; }
h1, h1 * { font-size:28px; color:#006ab8; }
h2, h3 { margin-bottom:1em; }
h2 { font-size:24px; text-align:center; color:#006ab8; }
h3 { font-size:20px; text-align:center; color:#006ab8; }
table { border:1px solid #ccc; margin-left:auto; margin-right:auto; }
th { padding:10px; vertical-align:middle; border:1px solid #ccc; white-space:nowrap; background-color:#c6e6ff; font-weight:normal; }
td { padding:10px 20px; vertical-align:middle; border:1px solid #ccc; text-align:left; }
img, video { display:block; max-width:100%; }
section { min-height:600px; }
input[type="text"], input[type="password"], textarea { border:1px solid #ccc; background-color:white; padding-left:5px; padding-right:5px; width:100%; }
input[type="checkbox"] { display:none; }
textarea { height:10em; }
input[type="checkbox"]+label { position:relative; display:inline-block; padding:0 30px; width:auto; cursor:pointer; }
input[type="checkbox"]+label::before { position:absolute; display:block; content:''; width:16px; height:16px; top:50%; left:5px;  margin-top:-8px; border:1px solid #ccc; }
input[type="checkbox"]+label::after  { position:absolute; display:block; content:''; width:5px;  height:9px;  top:50%; left:10px; margin-top:-7px; border-right:3px solid #000; border-bottom:3px solid #000; transform:rotate(45deg); opacity:0; }
input[type="checkbox"]:checked+label::after { opacity:1; }
td textarea { margin-top:5px; margin-bottom:5px; }

/*================================================
 *  ヘッダ・ナビ
 ================================================*/
/* ロゴ */
header { padding-top:1em; padding-bottom:1em; display:flex; justify-content:space-between; }
header h1 { display:inline; }
header img, header span { vertical-align: middle; }
header img { display: inline; margin-right:20px; }
header span.small { font-size:75%; margin-right:0.5em; }
header .button { width:150px; }

/*  メニュー */
nav { background-color:#006ab8; }
nav ul { display:flex; justify-content:space-between; flex-wrap:wrap; overflow:hidden; }
nav ul li, nav ul li a { height:40px; line-height:40px; display:block; }
nav ul li { text-align:center; margin-left:0; flex:1; }
nav ul li a { border:0; color:white; }
nav ul li a.nav_selected { background-color:#bbbb44; }
nav ul li a:hover { color:white; opacity:1; background-color:#ff6c00; }
/* スマホメニューボタン */
div.sp_menu_button { display:none; position:absolute; z-index:2; top:20px; right:20px; width:60px; height:60px; cursor:pointer; }
div.sp_menu_button div, div.sp_menu_button div span { display:inline-block; transition:all .4s; box-sizing:border-box; }
div.sp_menu_button div { position:relative; width:60px; height:35px; }
div.sp_menu_button div span { position:absolute; left:0; width:100%; height:4px; background-color:#ff6c00; border-radius:4px; }
div.sp_menu_button div span:nth-of-type(1) { top:5px; }
div.sp_menu_button div span:nth-of-type(2) { top:15px; }
div.sp_menu_button div span:nth-of-type(3) { top:25px; }
div.sp_menu_button.active div span:nth-of-type(1) { -webkit-transform:translateY(10px) rotate(-45deg); transform:translateY(10px) rotate(-45deg); }
div.sp_menu_button.active div span:nth-of-type(2) { opacity:0; }
div.sp_menu_button.active div span:nth-of-type(3) { -webkit-transform:translateY(-10px) rotate(45deg); transform:translateY(-10px) rotate(45deg); }
div.sp_menu_button p { font-size:14px; line-height:8px; text-align:center; color:#ff6c00; }

/*================================================
 *  フッタ
 ================================================*/
footer { text-align:center; padding:50px 0 100px; background-color:#ddd; }
.copyright { margin-top:20px; font-size:80%; }

/*================================================
 *  ページトップへの戻り
 ================================================*/
#go_to_top { display:block; position:fixed; bottom:20px; right:10vw; width:60px; height:60px; background-color:#ff6c00; color:white; font-size:40px; line-height:60px; text-align:center; border:1px solid white; z-index:2; text-decoration:none; opacity:0.85; }
#go_to_top:hover { background-color:#ff6c00; opacity:1; }

/*================================================
 *  モーダル
 ================================================*/
.modal { display:none; position:fixed; top:0; height:100vh; width:100%; }
.modal_bg { position:absolute; height:100vh; width:100%; background:rgba(0,0,0,0.75); }
.modal_content { display:none; position:absolute; z-index:99; top:50%; transform:translate(-50%,-50%); left:50%; width:60%; padding:40px; background:#fff; }

/*================================================
 *  ページ共通
 ================================================*/
/* ブロック構造 */
.inner { width:1020px; margin-left:auto; margin-right:auto; }
.page_top_image { display:block; width:100%; height:30vh; object-fit:cover; }
.content_block { padding:50px; background:url('images/common_bg.png'); margin-top:50px; margin-bottom:50px; }
.content_block.backcolor { color:white; }
.center_wrapper { display:flex; justify-content:center; }
.center { text-align:center; }
.object_fit { background-size:cover; background-position:center center; background-repeat:no-repeat; display:block; position:absolute; top:0; left:0; width:100%; height:100%; }
.backcolor { background-color:#006ab8; color:white; }
.buttons { display:flex; flex-wrap:wrap; justify-content:center; margin-left:auto; margin-right:auto; margin-top:25px; }
section>div.buttons:last-child { margin-bottom:50px; }
.buttons .button:not(:last-child), .buttons input[type="submit"]:not(:last-child) { margin-right:25px; }
.button, input[type="submit"] { display:block; width:250px; height:50px; line-height:50px; background-color:#ff6c00; color:white; text-align:center; font-weight:bold; cursor:pointer; }
.button img { display:inline; vertical-align:middle; margin-right:10px; }
.fade { opacity:0; }
.click_open_trigger { border-bottom: 1px solid #ff6c00; color:#ff6c00; cursor:pointer; line-height:2; }
.click_open_trigger:hover { opacity:0.7; }
.click_open { display:none; }
.click_open_show { display:table; }
.f_req:after { content:'必須'; font-size:85%; margin-left:5px; display:inline-block; border-radius:5px; color:white; background:#ee6868; padding:5px; line-height:1; }
.message { display:flex; justify-content:center; margin-bottom:1em; color:red; }

/* 文字装飾 */
.underconst { text-align:center; color:red; margin-top:100px; font-size:32px; }
.nobr { white-space:nowrap; display:inline-block; }
.error { color:red; }
.error404 { margin-top:200px; margin-bottom:200px; font-size:24px; }
.outlink::after { content:url('images/common_outlink.png'); margin-left:10px; }
.empha { font-weight:bold; }
.underline { border-bottom:1px dotted #006ab8; }

/*================================================
 *  ページ別定義
 ================================================*/
/* TOPページ */
.top_image, .top_image_text, .top_image_text div { width:100%; height:60vh; }
.top_image { position:relative; }
.top_image_text { position:absolute; top:0; bottom:0; left:0; right:0; }
.top_image_text div { display:flex; justify-content:center; align-items:center; text-align:center; }
.top_image_text h2, .top_image_text h2 span  { font-size:32px; line-height:1.6; margin-bottom:0; color:#006ab8; letter-spacing:-1px; font-weight:700; text-shadow:0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff, 0 0 8px #fff, 0 0 12px #fff, 0 0 16px #fff, 0 0 20px #fff, 0 0 24px #fff, 0 0 32px #fff, 0 0 40px #fff, 0 0 48px #fff; }
.top_flow p { margin-top:2em; }
.top_data th { padding-left:20px; padding-right:20px; }
.top_board, .top_board * { border:0; }
.top_board { margin-left:0; margin-right:0; }
.top_board th, .top_board td { padding:5px 0; vertical-align:top; }
.top_board th { background-color:transparent; width:auto; padding-right:2em; }
.top_member { margin-bottom:1em; }
.top_member li:not(:last-child) { margin-bottom:1em; }

/* TOPページNEWS欄・NEWSページ */
.news_item:not(:last-child) { margin-bottom:0.5em; }
.news_item time { display:inline-block; width:125px; margin-right:25px; }
.news_item a { border-bottom:1px solid #ff6c00; line-height:2; }
.news_detail { background-color:white; padding:25px; }
.news_detail time { display:block; text-align:right; margin-bottom:1em; }
.news_detail img { margin-top:25px; }

/* お問い合わせ */
.inquiry { margin-bottom:1em; }
.inquiry th { text-align:right; }
.inquiry td { padding-top:2px; padding-bottom:2px; width:500px; }
.inquiry input[name="tel"] { width:160px; }
.inquiry_finish { text-align:center; margin-bottom:5em; }

/* 管理画面 */
.admin { padding-top:25px; padding-bottom:25px; }
.admin .login { width:350px; }
.admin .login th { width:auto; }
.admin .login td { width:200px; }
.admin table { width:100%; }
.admin table th, .admin table td { padding:2px 10px; }
.admin table th.with_button, .admin table td.with_button { padding:0; }
.admin table th.with_button a, .admin table td.with_button a { display:block; padding:2px 5px; background-color:#ff6c00; color:white; }
.admin_home .home td { width:910px; }
.admin h3 { margin-top:25px; }
.admin .board td, .admin .member td { padding:2px 5px; }
.plus_minus { width:81px; text-align:center; }
.plus_minus span { display:inline-block; width:25px; margin-left:5px; margin-right:5px; background-color:#ff6c00; color:white; cursor:pointer; }
.admin .board .board_title { width:160px; }
.admin .board .board_name  { width:160px; }
.admin .board .board_prof  { width:618px; }
.admin .member .member_name { width:350px; }
.admin .member .member_url  { width:588px; }
.news_list .news_date  { width:120px; }
.news_list .news_title { width:350px; }
.news_list .news_body  { width:459px; }
.news_list .news_file  { width:90px; }
.news_list .news_title, .news_list .news_body { text-overflow:ellipsis; white-space:nowrap; overflow:hidden; }
.news_update th { width:150px; }
.news_update input[name="n_date"] { width:110px; }
.news_update img { display:inline-block; vertical-align:bottom; max-width:800px; max-height:300px; margin-right:5px; }
.news_update iframe { width:750px; height:450px; }

/*■■■■■■■■■■■■■■■■■■■■■■■■■
 *  タブレット
 ■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width:1020px) {

/* 共通 */
.inner { width:100%; margin-left:0; margin-right:0; }

/* スマホメニュー */
div.sp_menu_button { display:block; }
nav { display:none; }
nav ul li, nav ul li a { height:69px; }
nav ul li { width:calc(100% / 4 - 3px); flex:auto; }
nav ul li { border-right:1px solid white; border-bottom:1px solid white; }
nav ul li:nth-child(4n) { border-right:0; }

/* ページの戻り */
#go_to_top { right:5vw; }

/* ヘッダ */
header { padding-left:50px; padding-right:50px; }

/* トップ */
.top_image_text h2, .top_image_text h2 span { font-size:28px; }

}


@media screen and (max-width:800px) {

/* 共通 */
table, thead, tbody, tr, th, td { display:block; margin:auto; border:0; text-align:left; }
tr:not(:last-child) { margin-bottom:10px; }
th { width:auto; }
td { padding:10px; }

/* お問い合わせ */
.inquiry th { text-align:left; }
.inquiry td { padding-left:0; padding-right:0; }
.inquiry input, .inquiry textarea { width:100%; }

}

/*■■■■■■■■■■■■■■■■■■■■■■■■■
 *  スマホ
 ■■■■■■■■■■■■■■■■■■■■■■■■■*/
@media screen and (max-width:640px) {

/* 共通 */
h1, h1 span:last-child { font-size:22px; }
h1 span:first-child { margin-bottom:0; }
h2 { font-size:20px; }
.inner { width:100%; }
.content_block { padding:20px; margin-top:20px; margin-bottom:20px; }
.click_open_show { display:block; }

/* ヘッダ */
div.sp_menu_button { top:15px; right:15px; }
header { padding-left:20px; padding-right:20px; }

/* TOPページ */
.top_image_text h2, .top_image_text h2 span { font-size:24px; }
.top_board th, .top_board td { padding:0; }
.top_board th { padding-right:0; }

/* TOPページNEWS欄・NEWSページ */
.news_item time { display:block; width:auto; margin-right:0; }
.news_item span { display:block; }

}
