/* ==================================================================================================== */
/* ベース */
/* ==================================================================================================== */

/* 色設定 */
:root {
--bg:#f5f0dd;
--bk:#2d2d2d;
--br:#463e24;
--dg:#6a6a6a;
--gr-1:#5e7c36;
--gr-2:#285117;
--gr-3:#69ad4c;
--gl:#c6a22d;
--ye:#eccb29;
--wh:#fcfcfc;
}

/* 背景色設定 */
html { background-color:var(--bg); color:var(--bk); }

/* 色 */
.tx-br { color:var(--br); }
.tx-wh { color:var(--wh); }

/* よく使う文字制御 */
.w700 { font-weight:700; }

/* 切り替えボタン読み込み */
body::after { 
content:'';
display:none;
background:url(../img/nav/nav-01about-ov.png) no-repeat,
url(../img/nav/nav-02activity-ov.png) no-repeat,
url(../img/nav/nav-03signature-ov.png) no-repeat,
url(../img/nav/nav-04statement-ov.png) no-repeat,
url(../img/nav/nav-05news-ov.png) no-repeat,
url(../img/nav/nav-06publications-ov.png) no-repeat,
url(../img/nav/nav-07contact-ov.png) no-repeat,
url(../img/nav/nav-08englishpng-ov.png) no-repeat,
url(../img/nav/nav-09search-ov.png) no-repeat;
}

/* ==================================================================================================== */
/* フォント */
/* ==================================================================================================== */

/* 全体設定 */
html, h1, h2, h3, h4, h5, p, li, dt, dd {
color:var(--bk);
font-smooth:always;
font-family:"Kiwi Maru", serif;
font-optical-sizing:auto;
font-style:normal;
font-weight:400;
text-align:justify;
text-rendering:optimizeLegibility;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale;
} 

/* notosans */
.noto { font-family:"Noto Sans JP", sans-serif; }

/* Kaisei Opti */
.opti { font-family:"Kaisei Opti", serif; }

/* ==================================================================================================== */
/* ヘッダ */
/* ==================================================================================================== */

/* ヘッダー基礎 */
header { align-content:center; background-color:var(--bg); justify-content:space-between; padding:5px 20px; position:fixed; top:0; height:60px; width:100%; z-index:100; }
header h1 a { align-items:center; align-content:center; flex-direction:column; justify-content:center; height:100%; }
header h1 a img { aspect-ratio:228/44.5; height:auto; max-width:228px; width:228px; }

@media(min-width:960px) {

/* ヘッダー基礎 */
header { box-sizing:border-box; padding:5px 40px; height:100px; }

}

/* ==================================================================================================== */
/* 固定ボタン */
/* ==================================================================================================== */

/* ベース */
ul.fixed-button { align-items:center; align-content:center; justify-content:space-between; position:fixed; bottom:0; left:0; width:100%; z-index:101; }
ul.fixed-button li { font-size:14px; line-height:16px; width:50%; }
ul.fixed-button li:first-child { box-sizing:border-box; width:calc( 50% - 1px ); border-right:1px solid var(--wh); }
ul.fixed-button li a { align-items:center; align-content:center; justify-content:center; padding:8px 24px; height:100%; width:100%; }
ul.fixed-button li a:link, ul.fixed-button li a:visited { background-color:var(--gr-1); transition:.3s; }
ul.fixed-button li a:active, ul.fixed-button li a:hover { background-color:var(--gr-2); transition:.3s; }

@media(min-width:960px) {

/* ベース */
ul.fixed-button { flex-direction:column; gap:16px; justify-content:flex-start; top:140px; right:0; bottom:auto; left:auto; width:auto; }
ul.fixed-button li { font-weight:700; letter-spacing:2px; line-height:16px; writing-mode:vertical-rl; width:auto; }
ul.fixed-button li:first-child { border-right:none; width:auto; }
ul.fixed-button li a { border-radius:10px 0 0 10px; box-shadow:0 3px 0 0 var(--gr-2); padding:24px; height:auto; width:auto; }
ul.fixed-button li a:active, ul.fixed-button li a:hover { transform:translate(3px, 2px); box-shadow:0 0 0 0 transparent; }

}

/* ==================================================================================================== */
/* ナビゲーション */
/* ==================================================================================================== */

/* ハンバーガーメニュー */
label.hamburger { align-content:center; align-items:center; display:flex; flex-direction:column; gap:4px; justify-content:center; position:absolute; top:50%; right:20px; transform:translateY(-50%); height:30px; width:30px; z-index:1; }
label.hamburger span, label.hamburger span::before, label.hamburger span::after { background-color:var(--gl); border-radius:2px; display:block; height:2px; width:26px; transition:.3s; }
label.hamburger span::before, label.hamburger span::after { content:''; position:absolute; z-index:1; }
label.hamburger span::before { top:6px; }
label.hamburger span::after { bottom:6px; }

/* 動くわよ */
#main-nav:checked ~ label.hamburger span { background-color:transparent; transition:.3s; }
#main-nav:checked ~ label.hamburger span::before, #main-nav:checked ~ label.hamburger span::after { top:50%; }
#main-nav:checked ~ label.hamburger span::before { transform:rotate(45deg); }
#main-nav:checked ~ label.hamburger span::after { transform:rotate(-45deg);}

/* ナビ本体 */
ul.nav-content { background-color:var(--wh); border-radius:24px; flex-direction:column; gap:32px; transition:.3s; overflow:hidden; position:fixed; top:50%; left:50%; transform:translate(-50%,-50%);  width:300px; max-height:0; }
ul.nav-news-list { display:flex; flex-direction:column; gap:32px; }
ul.nav-content li { font-size:16px; }
ul.nav-content li.news a { display:none; }
ul.nav-content li.news ul.nav-news-list { display:flex; flex-direction:column; gap:32px; }
ul.nav-content li.news ul.nav-news-list li a { display:block; }
ul.nav-content li.pc-only { display:none; }

/* ナビ本体動かす */
#main-nav:checked ~ ul.nav-content { transition:.3s; padding:32px; max-height:calc( 100vh - 60px ); z-index:1; }
#main-nav:checked ~ label.label-bg { backdrop-filter:blur(4px); display:block; transition:.3s; position:fixed; top:60px; left:0; height:calc( 100vh - 60px ); width:100vw; z-index:-1; }

/* searchボックス用 */
div.search-box-pc { display:none; }

@media(min-width:960px) {

/* ハンバーガーメニュー ※PC版は消す */
label.hamburger, label.label-bg { display:none; pointer-events:none; }

/* ナビ本体 */
nav.main-nav { max-width:calc( 100% - 228px ); width:100%; }
ul.nav-content { align-items:center; background-color:transparent; flex-direction:row; gap:8px; justify-content:flex-end; overflow:visible; position:static; transform:translate(0,0); max-height:100%; height:100%; width:100%; }
ul.nav-content li, ul.nav-content li.news { align-items:center; color:transparent; flex:0 1 auto; display:flex; justify-content:center; }
ul.nav-content li.news { position:relative; z-index:1; }
ul.nav-content li a, ul.nav-content li.news a { aspect-ratio:116/32; background-size:contain; background-position:center; background-repeat:no-repeat; display:block; overflow:hidden; transition:.3s; height:auto; max-width:116px; width:116px; }
ul.nav-content li a span { border:0; clip:rect(0,0,0,0); overflow:hidden; opacity:0; visibility:hidden; padding:0; margin:-1px; height:1px; width:1px; }
ul.nav-content li.pc-only { display:block; }
ul.nav-content li.pc-only label { aspect-ratio:76/32; background-repeat:no-repeat; background-size:contain; background-position:center; background-image:url(../img/nav/nav-09search.png); display:block; height:32px; max-width:76px; width:76px; }
ul.nav-content li.pc-only label:active, ul.nav-content li.pc-only label:hover { background-image:url(../img/nav/nav-09search-ov.png); }

/* ボタン配置 */
ul.nav-content li.about a { background-image:url(../img/nav/nav-01about.png); transition:.3s; }
ul.nav-content li.about a:active, ul.nav-content li.about a:hover, ul.nav-content li.about.current a { background-image:url(../img/nav/nav-01about-ov.png); transition:.3s; }
ul.nav-content li.activities a { background-image:url(../img/nav/nav-02activity.png); }
ul.nav-content li.activities a:active, ul.nav-content li.activities a:hover, ul.nav-content li.activities.current a { background-image:url(../img/nav/nav-02activity-ov.png); transition:.3s; }
ul.nav-content li.signature a { background-image:url(../img/nav/nav-03signature.png); }
ul.nav-content li.signature a:active, ul.nav-content li.signature a:hover { background-image:url(../img/nav/nav-03signature-ov.png); }
ul.nav-content li.voice a { background-image:url(../img/nav/nav-04statement.png); }
ul.nav-content li.voice a:active, ul.nav-content li.voice a:hover, ul.nav-content li.voice.current a { background-image:url(../img/nav/nav-04statement-ov.png); }
ul.nav-content li.news a { background-image:url(../img/nav/nav-05news.png); }
ul.nav-content li.news a:active, ul.nav-content li.news a:hover, ul.nav-content li.news.current a { background-image:url(../img/nav/nav-05news-ov.png); }
ul.nav-content li.publications a { background-image:url(../img/nav/nav-06publications.png); }
ul.nav-content li.publications a:active, ul.nav-content li.publications a:hover, ul.nav-content li.publications.current a { background-image:url(../img/nav/nav-06publications-ov.png); }
ul.nav-content li.contact a { background-image:url(../img/nav/nav-07contact.png); }
ul.nav-content li.contact a:active, ul.nav-content li.contact a:hover, ul.nav-content li.contact.current a { background-image:url(../img/nav/nav-07contact-ov.png); }
ul.nav-content li.english a { background-image:url(../img/nav/nav-08english.png); }
ul.nav-content li.english a:active, ul.nav-content li.english a:hover, ul.nav-content li.english.current a { background-image:url(../img/nav/nav-08english-ov.png); }

/* サブナビ */
ul.nav-content li.news ul.nav-news-list { background-color:var(--wh); border-radius:10px; flex-direction:column; opacity:0; position:absolute; top:32px; margin-top:10px; visibility:hidden; min-height:0; z-index:10; }
ul.nav-content li.news:hover > ul.nav-news-list { box-shadow:0 3px 0 0 var(--gl); gap:16px; opacity:1; padding:20px; visibility:visible; min-height:100%; min-width:222px; max-width:100%; }
ul.nav-content li.news ul.nav-news-list li { color:var(--bk); font-size:14px; }
ul.nav-content li.news ul.nav-news-list li a { aspect-ratio:auto; background-image:none; max-width:100%; width:auto; }
ul.nav-content li.news ul.nav-news-list li a:active, ul.nav-content li.news ul.nav-news-list li a:hover { opacity:.7; }

/* searchボックス用 */
ul li.search-box { display:none; }
div.search-box-pc { background-color:rgba(255,255,255,0.5); backdrop-filter:blur(20px); display:none; top:0; left:0; transition:.3s; padding:25px 10px 30px 10px; position:fixed; z-index:10; min-height:0; width:100vw; }
div.search-box-pc div.search-area { display:flex; justify-content:flex-end; margin:auto; max-width:960px; }
div.gsc-control-searchbox-only { max-width:625px; width:625px; }
#search-on:checked ~ div.search-box-pc { display:block; transform:translateY(95px); transition:.3s; min-height:auto; max-height:100%; }

}

/* ==================================================================================================== */
/* Google検索用 */
/* ==================================================================================================== */

/* ベース */
div.search-area form { border:1px solid #ddd; border-radius:10px; box-sizing:border-box; box-shadow:0 3px 0 var(--gr-2); color:var(--bk); overflow:hidden; padding:0; margin:0; max-height:32px; height:32px; }
div.search-area form table.gsc-search-box, div.search-area form table.gsc-search-box tr { padding:0 !important; margin:0 !important; height:32px !important; max-height:32px !important; }
div.search-area form table.gsc-search-box td.gsib_a { border:none !important; padding:0 !important; margin:0 !important; height:32px !important; }
td.gsib_b { visibility:hidden !important; } 
table.gsc-search-box td.gsc-input { padding:0 !important; }
div.search-area form table.gsc-search-box .gsc-search-button { aspect-ratio:76/32; background-color:var(--gr-3) !important; border:none !important; line-height:1; padding:0 !important; margin:0 !important; height:32px !important; width:76px !important; }
div.search-area form table.gsc-search-box .gsc-search-button svg { display:none !important; }
div.search-area form table.gsc-search-box .gsc-search-button button.gsc-search-button-v2 { aspect-ratio:76/32; background-repeat:no-repeat; background-position:center; background-size:contain; background-image:url(../img/nav/search-button.png); padding:0 !important; height:32px !important; width:76px !important; }
div.gsc-input-box { padding:0 5px !important; }

/* ==================================================================================================== */
/* メイン */
/* ==================================================================================================== */

/* ベース */
main { margin-top:60px; }

@media(min-width:769px) {

/* ミモザデコ */
main::before, main::after { background-position:center; background-size:contain; background-repeat:no-repeat; content:''; display:inline-block; position:absolute; top:0; z-index:-1; }
main::before { aspect-ratio:211/1050; background-image:url(../img/mimosa/left-mimosa.png); left:0; height:auto; max-width:211px; width:211px; }
main::after { aspect-ratio:160/1093; background-image:url(../img/mimosa/right-mimosa.png); right:0; height:auto; max-width:160px; width:160px; }

}

@media(min-width:960px) {

/* ベース */
main { margin-top:100px; }

}

/* ==================================================================================================== */
/* ページャー */
/* ==================================================================================================== */

#pagenation {
  text-align: center;
  padding-bottom:40px;
}

#pagenation #pagenation-list {
  display: inline-block;
  padding: 0;
  margin: 0;
}

#pagenation:after {
  content: ".";
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

#pagenation #pagenation-list li {
  float: left;
  list-style: none;
  margin: 0 10px 5px 0;
}

#pagenation #pagenation-list li:last-child {
  margin-right: 0;
}

/* リンクを丸くして文字中央寄せ */
#pagenation #pagenation-list a,
#pagenation #pagenation-list span {
  display: flex;                 /* flexで縦横中央 */
  justify-content: center;       /* 横中央 */
  align-items: center;           /* 縦中央 */
  width: 35px;                   /* 正方形にして丸く */
  height: 35px;                  /* 正方形にして丸く */
  font-size: 15px;
  text-align: center;
  border-radius: 50%;            /* 完全な円に */
  text-decoration: none;
  margin: 0;
  padding: 0;                     /* 高さ固定なのでpadding不要 */
  background: #FFFFFF;
  color: #69AD4C;
  border: 1px solid #69AD4C;
  box-sizing: border-box;
}

#pagenation #pagenation-list a:hover {
  background: #69AD4C;
  color: #FFFFFF;
  border: 1px solid #69AD4C;
}

#pagenation #pagenation-list .current {
  background: #69AD4C;
  color: #FFFFFF;
  border: 1px solid #69AD4C;
}

#pagenation #pagenation-list .omit {
  padding: 6px 2px;
  color: #69AD4C;
}

@container(min-width:960px) {

#pagenation {
  padding-bottom:80px;
}

}


/* ==================================================================================================== */
/* SNS */
/* ==================================================================================================== */

/* ベース */
section.sns-block { margin-bottom:103px; }

/* 見出し */
section.sns-block h2.center { margin-bottom:16px; }
section.sns-block h2.center img { margin:auto; height:auto; max-width:281px; }

/* リスト */
ul.sns-list { justify-content:center; gap:40px; padding:24px 0; margin:auto; max-width:350px; }
ul.sns-list li { text-align:center; } 
ul.sns-list li img { aspect-ratio:1/1; height:auto; width:45px; }

@container(min-width:960px) {

/* ベース */
section.sns-block { margin-bottom:198px; }

/* 見出し */
section.sns-block h2.center { margin-bottom:40px; }
section.sns-block h2.center img { max-width:528px; }

/* リスト */
ul.sns-list { gap:64px; padding:0; max-width:528px; }
ul.sns-list li img { width:80px; }

}

/* ==================================================================================================== */
/* フッター */
/* ==================================================================================================== */

/* フッター全体 */
footer { border-top:1px solid var(--gl); box-sizing:border-box; padding:26px 0; position:relative; width:100%; }

/* フッター見出し */
h2.footer-title { margin-bottom:24px; }
h2.footer-title img { max-width:auto; width:235px; }

/* フッターコンテンツ */
div.footer-content { flex-direction:column; gap:8px; margin:auto; margin-bottom:40px; width:240px; }
.contact-info { margin-bottom:8px; }
.contact-info p { text-indent:-4ch; padding-left:4ch; margin:0.3em 0; }
.contact-info p.tel::before, .contact-info p.fax::before { margin-right:1.5em; }
.contact-info p.tel::before { content:'TEL'; }
.contact-info p.fax::before { content:'FAX'; }
.contact-info p.mail::before { content:'MAIL'; margin-right:1em; }

/* 過去ページボタン */
p.old-link a { align-items:center; background-color:var(--dg); box-sizing:border-box; color:var(--wh); border-radius:40px; gap:10px; justify-content:center; height:32px; width:140px; }

/* コピーライト */
p.copy { font-size:12px; font-weight:100; line-height:150%; margin-bottom:15px; }

@container( min-width:960px ) {

/* 過去ページボタン */
p.old-link { top:40px; right:50%; transform:translateX(calc( 50% + 240px )); position:absolute; }

}


















