@charset "UTF-8";

@font-face {
  font-family: 'Noto Sans JP';
  font-display: swap;
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/NotoSansJP-Regular.otf') format('opentype');
}
@font-face {
  font-family: 'Noto Sans JP';
  font-display: swap;
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/NotoSansJP-Medium.otf') format('opentype');
}

/* NOTE: 共通 */
body, html { min-width: 1200px; height: 100%; color: #444; background: #f9f0e7;}
html { font-size: 62.5%;}
body { font-size: 1.6em;}

body { font-family: 'Noto Sans JP', sans-serif; font-weight: 400;}
h1, h2, h3, h4 { font-weight: 500;}
b, strong { font-weight: 500;}
#wrapper { position: relative; height: 100%;}
.contents { position: relative; width: 100%;}
a { color: #444;}
.mobile { display: none;}
#pageTop { background: #ccc; color: #fff; border-radius: 50%; text-align: center; line-height: 50px; position: fixed; bottom: 10px; right: 10px; cursor: pointer; width: 50px; z-index: 90;}

/* NOTE: header */
header { width: 100%; position: fixed; top: 0; z-index: 100; background: #fff; box-shadow: 0 0 5px #999;}
header #upper { width: 100%; padding: 10px 0 7px 0; text-align: center;}
header #upper:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
header #upper img { height: 50px;}
header .shoulder { display: block; font-size: 1.2rem; line-height: 1.0; color: #000; letter-spacing: 1px; margin-top: 3px;}

header #shoulder { display: none;}
header #under { width: 100%; text-align: center; margin: 0; background: #60c8d4;}
header #under ul { display: inline-block;}
header #under ul > li { float: left; font-size: 1.5rem; line-height: 1.0; letter-spacing: 1px; position: relative;}
header #under ul > li a { display: block; padding-bottom: 5px; text-align: center; color: #fff; padding: 10px 20px; font-size: 1.5rem; background: #60c8d4;}
header #under ul > li a i { font-size: 1.3rem;}
header #under ul > li a:hover { opacity: 0.8;}

/* NOTE: hamburger */
#hamburger { display: none;}

/* NOTE: nav */
nav.gnavi { display: none;}

/* header-search */
#header-search-btn { display: none;}
#header-search { display: none;}

/* NOTE: footer */
footer { width: 100%; background: #60c8d4;}
footer small { display: block; padding: 50px 10px; font-size: 1.3rem; color: #fff; letter-spacing: 1px; text-align: center;}

/* NOTE: breadcrumb */
#breadCrumbs { min-width:1060px; background: #fff; margin: 0 auto 10px auto; }
#breadCrumbs-inner { padding: 10px;}
#breadCrumbs { color: #444; font-size: 1.3rem; line-height: 1.2;}
#breadCrumbs a { color: #444; font-weight: normal;}
#breadCrumbs span { margin: 0 5px;}
#breadCrumbs span:first-child { margin: 0 2px 0 0;}
#breadCrumbs a:hover { opacity: 0.8;}

/* NOTE: spacer */
.spacer70 { width: 100%; height: 70px;}
.spacer120 { width: 100%; height: 120px;}

/* NOTE: pageHome */
/* loading */
#loading { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #fff; z-index: 9999; display: flex; justify-content: center; align-items: center;}

/* NOTE: hole left right */
.contents .layout-hole { width: 1060px; margin: 10px auto 30px auto; display: flex; flex-wrap: wrap;}
.contents .layout-hole:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.contents .layout-left { float: left; width: 690px; margin-right: 30px; padding: 20px; background: #fff;}
.contents .layout-right { float: right; width: 340px; padding: 20px; background: #fff;}
#pageHome .contents .layout-left { background: none; padding: 0;}

/* NOTE: top-slider */
ul.slider li.slides { margin: 0 5px; border-radius: 5px; padding: 5px;}
ul.slider li div.slides-img { border-radius: 5px; margin-bottom: 10px; position: relative;}
ul.slider li div.slides-img img { width: 100%;}
ul.slider li div.slides-img:hover { opacity: 0.8;}
ul.slider li h4 { font-size: 1.5rem; font-weight: 400; line-height: 1.2;}
#dots { margin-top: -5px;}

/* span.new スライダー*/
span.new { position: absolute; display: inline-block; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; top: 0; left: 0; font-size: 1.2rem; color: #fff; z-index: 1;}
span.new:after { content: ""; position: absolute; top: 0; left: 0; z-index: -1; display: inline-block; border-color: #d93175  transparent transparent #d93175; border-style: solid; border-width: 30px;}

.hole2 .left span.new { width: 30px; height: 30px;}
.hole2 .left span.new:after { border-width: 25px;}

/* NOTE: h2 カテゴリータイトル */
#pageHome h2.category-title { padding: 0 10px 30px 10px; margin-bottom: 5px; text-align: center;  }
#pageHome h2.category-title a { font-size: 2.0rem; display: inline-block; background: #444; letter-spacing: 3px; padding: 10px 50px; border-radius: 20px; color: #fff; font-weight: 400;}

/* block */
#pageHome .block { margin-bottom: 50px;}

/* NOTE: ul.col1 */
ul.col1 { display: flex; flex-wrap: wrap; background: #fff; padding: 20px; border-radius: 5px;}
ul.col1 li .hole1:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
ul.col1 li .hole1 .right { width: 220px; float: left; position: relative;}
ul.col1 li .hole1 .right img { width: 100%;}
ul.col1 li .hole1 .right:hover { opacity: 0.8;}
ul.col1 li .hole1 .left { width: 430px; float: right; padding: 10px 0 10px 20px; position: relative;}
ul.col1 li .hole1 .left h3 { display: block; width: 100%; font-size: 2.0rem; margin: 5px 0 10px 0;}
ul.col1 li .hole1 .left h3 a:hover { text-decoration: underline;}
ul.col1 li .hole1 .left p.excerpt { display: block; width: 100%; font-size: 1.3rem; line-height: 1.6; color: #666;}
ul.col1 li .hole1 .left span.date { font-size: 1.3rem; color: #999;}
ul.col1 li .hole1 .left span.pr { display: block; font-size: 1.4rem; text-align: right; color: #888;}

/* NOTE: ul.col3 */
ul.col3 { display: flex; flex-wrap: wrap; margin-top: 10px;}
ul.col3:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
ul.col3 li .hole2:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
ul.col3 li { float: left; width: 32%; margin-right: 2%; margin-bottom: 20px;}
ul.col3 li:nth-child(3n) { margin-right: 0;}
ul.col3 li .hole2 .left { width: 100%; position: relative;}
ul.col3 li .hole2 .left img { width: 100%;}
ul.col3 li .hole2 .left:hover { opacity: 0.8;}
ul.col3 li .hole2 .right { width: 100%; text-align: left; margin-top: 10px;}
ul.col3 li .hole2 .right h3 { display: block; width: 100%; font-size: 1.5rem; line-height: 1.2; margin: 5px 0 0 0;}
ul.col3 li .hole2 .right h3 a:hover { text-decoration: underline;}
ul.col3 li .hole2 .right span.date { display: inline-block; padding: 3px 5px; font-size: 1.3rem; line-height: 1.0; background: #60c8d4; color: #fff; letter-spacing: 1px; border-radius: 3px;}

ul.col3 li.line img { width: 100%;}

/* NOTE: layout-right */
.contents .layout-right .rcl-bnr { width: 100%; margin-bottom: 20px; text-align: center;}
.contents .layout-right .rcl-bnr img { width: 300px;}
.contents .layout-right .rcl-bnr img:hover { opacity: 0.8;}
.contents .layout-right .ads { width: 100%; text-align: center;}

.contents .layout-right h3 { padding: 10px 0; text-align: center; font-size: 1.4rem; margin-bottom: 5px; background: #ccc; color: #fff; border-radius: 5px;}
.contents .layout-right .welcom { padding: 30px 0;}
.contents .layout-right .welcom a { color: #0066ff;}
.contents .layout-right .welcom p { font-size: 1.3rem; line-height: 1.8;}
.contents .layout-right .welcom p span { display: block; text-align: right;}
.contents .layout-right .offical-sns { text-align: center; padding: 30px 0;}
.contents .layout-right .offical-sns img { width: 50px;}
.contents .layout-right .offical-sns a:hover img { opacity: 0.8;}
.contents .layout-right .management { padding: 20px 0;}
.contents .layout-right .management ul { padding-left: 20px; line-height: 1.8;}
.contents .layout-right .management ul li a { font-size: 1.4rem; display: block; position: relative; padding-left: 20px;}
.contents .layout-right .management ul li a:before { position: absolute; content:"\f054"; font-family: 'Font Awesome 5 Free'; font-weight: 900; left: 0; top: 50%; transform: translateY(-50%); font-size: 1.0rem;}

/* NOTE: Popular Posts 済み*/
ul.wpp-list { margin: 20px 0 20px 0; counter-reset:my-counter;}
ul.wpp-list li { width: 100%; margin-bottom: 20px; position: relative;}
ul.wpp-list li:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
ul.wpp-list li:before { content:counter(my-counter); counter-increment:my-counter; background-color:#444; color:#fff; position: absolute; top: 0; left: 0; display:block; line-height:18px; text-align:center; font-size:10px; height:18px; width:18px;}
ul.wpp-list li a { display: block; font-size: 1.5rem; min-height: 50px; display: flex; align-items: center;}
ul.wpp-list li a div.img { width: 50px; height: 50px; float: left; margin-right: 10px;}
ul.wpp-list li a div.img img { width: 50px; height: 50px;}
ul.wpp-list li a div.txt {}
ul.wpp-list li:hover { background: #eee;}
ul.wpp-list li span { display: block; font-size: 1.2rem;}

/* NOTE: h1 h2*/
body.page .layout-left h1 { font-size: 2.8rem; line-height: 1.2; margin-bottom: 20px;}
body.page .layout-left h2 { font-size: 2.0rem; line-height: 1.2; margin: 30px 0;}
body.single .layout-left h1 { font-size: 3.4rem; line-height: 1.2; }
body.archive .layout-left h1 { font-size: 2.8rem; line-height: 1.2; margin-bottom: 30px;}

/* NOTE: btn-all */
.layout-left .btn-all { text-align: center; margin: 10px 0 0 0;}
#pageHome .layout-left .btn-all { margin: 10px 0 0 0;}
.layout-left .btn-all a { display: inline-block; background: #60c8d4; color: #fff; padding: 10px 70px; line-height: 1; font-size: 1.5rem; border-radius: 3px; letter-spacing: 1px; position: relative;}
.layout-left .btn-all a:before { position: absolute; content:"\f054"; font-family: 'Font Awesome 5 Free'; font-weight: 900; right: 10px; top: 50%; transform: translateY(-50%); font-size: 1.4rem;}
.layout-left .btn-all a:hover { opacity: 0.8;}

/* NOTE: pageSingle */

/* NOTE: article-category タイトル下 */
.article-category { line-height: 1.1; margin-top: 5px;}
.article-category a { display: inline-block; font-size: 1.3rem; color: #fff; background: #999; padding: 2px 5px; letter-spacing: 0; border-radius: 3px; line-height: 1; margin-right: 5px;}
#pageHome ul.slider .article-category a { font-size: 1.3rem; padding: 4px 7px; letter-spacing: 1px;}

#pageSingle .contents .layout-left { padding: 45px 20px 20px 20px;position: relative;}
#pageSingle .contents .category-header { position: absolute; top: 0; left: 0; right: 0; text-align: center; z-index: 10; background: #ccc; color: #fff; padding: 7px 3px; font-size: 14px; letter-spacing: 1px; line-height: 1.0;}

#pageSingle .contents span.header-pr { display: inline-block; font-size: 1.3rem; color: #666; margin-bottom: 5px;}
#pageSingle .contents span.header-date { display: inline-block; padding: 3px 5px; font-size: 1.3rem; line-height: 1.0; background: #60c8d4; color: #fff; letter-spacing: 1px; border-radius: 3px;}
#pageSingle .contents .article-category { margin-bottom: 30px;}

/* NOTE: relatinal */
#pageSingle .relatinal { margin-top: 30px;}
#pageSingle .relatinal .title { font-size: 1.5rem; text-align: center; padding: 10px; background: #ccc; color: #fff; border-radius: 5px;}

/* NOTE: new-post */
.new-post { margin-top: 30px;}
.new-post .title { font-size: 1.5rem; text-align: center; padding: 10px; background: #ccc; color: #fff; border-radius: 5px;}
.new-post span.date { font-size: 1.3rem; color: #666; letter-spacing: 0;}

/* NOTE: ネイティブCSS */
.native-block p { display: block; margin: 30px 0; line-height: 1.8; font-size: 1.5rem;}
.native-block p a { color: #0066ff !important; text-decoration: underline;}
.native-block a { color: #0066ff; text-decoration: underline;}
.native-block strong { font-weight: bold; }
.native-block em { font-style: italic; }
.native-block h1 { font-size: 2.8rem; }
.native-block h2 { font-size: 2.4rem;  margin: 40px 0 30px 0; line-height: 1.2;}
.native-block h3 { font-size: 1.8rem; margin: 40px 0; line-height: 1.2;}
.native-block h4 { font-size: 1.6rem; margin: 20px 0; line-height: 1.2;}
.native-block h5 { font-size: 0.75rem; }
.native-block h6 { font-size: 0.625rem; }
.native-block ul { padding-left: 25px; font-size: 1.5rem; line-height: 1.8; margin-bottom: 20px;}
.native-block ul li { list-style: disc;}
.native-block ol { padding-left: 25px; font-size: 1.5rem; line-height: 1.8; margin-bottom: 20px;}
.native-block ol li { list-style: decimal;}
.native-block blockquote { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 40px; -webkit-margin-end: 40px;}
.native-block .aligncenter { display: block; width: 100%; margin: 0 auto; text-align: center;}
.native-block .alignright { float: right; margin: 0 0 10px 20px;}
.native-block .alignleft { float: left; margin: 0 20px 10px 0;}
.native-block img { height: auto; max-width: 100%;}
.native-block .wp-caption { border: 1px solid #ddd; text-align: left; background-color: #f3f3f3; padding: 5px; border-radius: 3px;}
.native-block .wp-caption img { margin: 0; padding: 0; border: 0 none;}
.native-block .wp-caption p.wp-caption-text { font-size: 14px; line-height: 1.5; margin: 0; padding: 0;}

/* イラスト枠 */
.native-block figure.waku { border: 2px solid #444;}

/* キャプション */
.native-block .wp-block-image { }
.native-block figure { }
.native-block figure figcaption { display: block; width: 100%; text-align: center; font-size: 1.4rem; color: #666;}

/* テーブル */
.native-block table td { border-collapse: collapse; border:1px solid #444; padding: 20px; line-height: 1.2; vertical-align: middle;}
.native-block table tr:first-of-type { background: #eee;}
.native-block table tr td:first-of-type { background: #eee;}
.native-block ul.point { background: #eee; border-radius: 5px; padding: 30px;}

/* フェイスナビ */
.native-block .face-navi { text-align: center; position: relative;}
.native-block .face-navi ul { padding-left: 0; display: inline-block; width: 80%;}
.native-block .face-navi ul:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.native-block .face-navi ul li { float: left; margin-right: 10px; width: 100px; list-style: none; line-height: 1.2; font-size: 1.3rem; opacity: 0.4; position: relative;}
.native-block .face-navi ul li.current { opacity: 1;}
.native-block .face-navi ul li:last-child { margin-right: 0;}
.native-block .face-navi ul li a { color: #444;}
.native-block .face-navi ul li a img { width: 100px;}
.native-block .face-navi ul li:hover { opacity: 1.0;}

.native-block .prev.slick-arrow { position: absolute; top: 50%; left: -40px; z-index: 10; transform: translateY(-30px);}
.native-block .next.slick-arrow { position: absolute; top: 50%; right: -30px; z-index: 10; transform: translateY(-30px);}
.native-block .prev { display: inline-block; color: #444; padding: 5px; font-size: 2.8rem; cursor: pointer;}
.native-block .next { position: absolute; right: 0; display: inline-block; color: #444; padding: 5px; font-size: 2.8rem; cursor: pointer;}

/* line-block */
.line-block .title { text-align: center;}
.line-block ul:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.line-block ul li { float: left; width: 32%; margin-right: 2%; margin-bottom: 10px;}
.line-block ul li:nth-child(3n) { margin-right: 0;}
.line-block ul li a img { width: 100%;}
.line-block ul li a:hover img { opacity: 0.8;}

/* credit */
.credit { line-height: 1.4;}
.credit a { color: #0066ff; }

/* NOTE: social */
#social { position: fixed; left: 0; top: 50%; transform: translateY(-50%); background: #fff; padding: 10px; box-shadow: 0 0 5px #ccc; border-top-right-radius: 5px; border-bottom-right-radius: 5px;}
#social ul li { width: 40px; margin-bottom: 5px;}
#social ul li:hover { opacity: 0.8;}
#social ul li a img { width: 100%;}

/* col2-bnr */
.col2-bnr { margin-top: 30px; background: #eee; padding: 20px;}
.col2-bnr ul:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.col2-bnr ul li { width: 300px; float: left; margin-right: 10px;}
.col2-bnr ul li:nth-child(2n) { margin-right: 0;}
.col2-bnr ul li a img { width: 100%;}
.col2-bnr ul li a:hover { opacity: 0.8;}

/* NOTE: pageAffair */
#pageAffair .contents h1 { display: none;}
#pageAffair .header-img { margin-top: 20px;}
#pageAffair .header-img h2 { margin: 0;}
#pageAffair .header-img.first { margin-top: 0;}
#pageAffair .header-img img { width: 100%;}
#pageAffair .header-txt .title { font-size: 2.0rem; line-height: 1.2; font-weight: 500; margin-bottom: 10px;}
#pageAffair .header-txt { font-size: 1.4rem; line-height: 1.8; padding: 20px;}
#pageAffair .header-txt span { font-size: 1.3rem; line-height: 1.5; color: #888;}
#pageAffair .contents .layout-left { padding: 0;}
#pageAffair .contents .layout-left-inner { padding: 0 20px 20px 20px;}

#pageAffair h2.txt { padding: 0 10px 30px 10px; margin-bottom: 5px; text-align: center;  }
#pageAffair h2.txt span { font-size: 2.0rem; display: inline-block; background: #444; letter-spacing: 3px; padding: 10px 50px; border-radius: 20px; color: #fff; font-weight: 400;}

/* NOTE: pageTaxonomy */
#pageTaxonomy .contents h1 { margin: 0;}
#pageTaxonomy .contents h1.h1-txt { font-size: 2.8rem; line-height: 1.2; padding: 20px 20px 0 20px;}
#pageTaxonomy .contents .layout-left { padding: 0;}
#pageTaxonomy .contents .layout-left-inner { padding: 10px 20px 20px 20px;}
#pageTaxonomy .header-img img { width: 100%;}
#pageTaxonomy .header-txt h2 { font-size: 1.8rem; line-height: 1.2; margin-bottom: 10px;}
#pageTaxonomy .header-txt { font-size: 1.4rem; line-height: 1.8; padding: 20px;}
#pageTaxonomy .header-txt span { font-size: 1.3rem; line-height: 1.5; color: #888;}

/* NOTE: featured-block */
.featured-block { background: #eee; padding: 20px; margin: 30px 0;}
.featured-block .hole1 { border-bottom: none; border-top: none; padding: 5px 0;}
.featured-block .hole1:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.featured-block .hole1 .right { width: 220px; float: right;}
.featured-block .hole1 .right img { width: 100%;}
.featured-block .hole1 .right:hover { opacity: 0.8;}
.featured-block .hole1 .left { width: 390px; float: left; padding: 10px 20px;}
.featured-block .hole1 .left h3 { display: block; width: 100%; font-size: 2.0rem; margin: 5px 0 10px 0;}
.featured-block .hole1 .left h3 a:hover { text-decoration: underline;}
.featured-block .hole1 .left p.excerpt { display: block; width: 100%; font-size: 1.3rem; line-height: 1.6; color: #666;}
.featured-block .hole1 .left span.featured { display: inline-block; font-size: 1.3rem; padding: 3px 13px; color: #fff; background: #990000;}
.featured-block .hole1 .left span.pr { display: block; font-size: 1.4rem; text-align: right; color: #888;}

/* NOTE: pageAuthor */
#pageAuthor .prof { font-size: 1.5rem; line-height: 1.8; margin-bottom: 30px; padding: 10px; border: 1px dashed #444; border-radius: 3px; background: #f6f6f6;}

/* NOTE: アーカイブページング */
#pager-block { text-align: center; padding: 30px 0;}
#pager-block .wp-pagenavi a, .wp-pagenavi span { color: #fff; display: inline-block; font-size: 18px; line-height: 35px; border:none !important; background: #ccc; width: 40px; height: 40px;}
#pager-block .wp-pagenavi span.current { font-weight: normal; background: #60c8d4;}
#pager-block .wp-pagenavi span.pages,
#pager-block .wp-pagenavi a.nextpostslink,
#pager-block .wp-pagenavi a.previouspostslink,
#pager-block .wp-pagenavi a.last,
#pager-block .wp-pagenavi a.first { display: none;}

/* NOTE: pageContact */
#pageContact .contents .layout-left .comment ul { padding-left: 20px;}
#pageContact .contents .layout-left .comment ul li { font-size: 1.4rem; line-height: 1.5; margin: 10px 0; list-style: disc;}
#pageContact .contents .layout-left .comment p { font-size: 1.4rem; line-height: 1.5; margin: 10px 0;}

/* formリセット */
input[type="text"], input[type="email"], button, select, textarea { margin: 0; padding: 0; background: none; border: none; border-radius: 0; outline: none; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
select::-ms-expand { display:none;}
input[type="text"], input[type="email"] { background: #fff; text-indent: 8px; height: 50px; width: 100%;}
textarea { background: #fff; padding: 10px; height: 300px; width: 100%;}

/* formデザイン*/
.contact-form { margin: 30px 0;}
.formblockhole { }
.formblockhole:after { content:","; display:block; height:0; clear:both; visibility:hidden; }
.formblockleft { width: 100%; font-size: 1.4rem; padding: 15px 25px; display: flex; align-items: center; background: #ccc; line-height: 1;}
.formblockright { width: 100%; padding: 20px 25px; line-height: 1.8; background: #f6f6f6;}
span.required { background: #d0111b; padding: 1px 7px; color: #fff; margin-right: 8px; font-size: 1.2rem;}
span.any { background: #e0e0e0; padding: 1px 7px; color: #555; margin-right: 8px; font-size: 1.2rem;}
.formbt { text-align: center; padding: 30px 0;}
form button { background: #60c8d4; color: #fff; text-align: center; width: 300px; border-radius: 5px; padding: 15px 0; cursor: pointer; letter-spacing: 5px; }
form button.back { background: #ccc;}
form button:hover { opacity: 0.8; }
span.error { display: inline-block !important;}

/* input[type="radio"],input[type="checkbox"] */
input[type="checkbox"], input[type="radio"] { display: none;}
span.mwform-checkbox-field-text, span.mwform-radio-field-text { position: relative; display: inline-block; padding-left: 30px;}
span.mwform-checkbox-field-text::before, span.mwform-radio-field-text::before { content: ""; position: absolute; top: 6px; left: 0; width: 20px; height: 20px; border-radius: 50%; background: #ccc;}
input[type="checkbox"]:checked + span.mwform-checkbox-field-text::after { content: ""; position: absolute; top: 11px; left: 5px; width: 10px; height: 10px; border-radius: 50%; background: #000;}
input[type="radio"]:checked + span.mwform-radio-field-text::after { content: ""; position: absolute; top: 11px; left: 5px; width: 10px; height: 10px; border-radius: 50%; background: #000;}

/* NOTE: 検索フォーム */
.side-search { margin-bottom: 20px;}
.side-search form { width: 100%; margin-bottom: 5px; position: relative;}
.side-search input { height: 38px; border-radius: 3px; border: 1px solid #ccc; background: #f6f6f6; width: 100%; padding: 0 50px 0 20px;}
.side-search button { position: absolute; top: 0; right: 0; height: 38px; width: 38px; border-radius: 0 3px 3px 0; background: #ccc; color: #fff; cursor: pointer; display: flex; justify-content: center; align-items: center;}
.side-search button i { font-size: 1.4rem; margin-left: 5px;}

.side-search h4 { padding: 10px 0; text-align: center; font-size: 1.4rem; margin: 20px 0 5px 0; background: #ccc; color: #fff; border-radius: 5px;}
.side-search .list-series ul li { width: 100%; border: 1px solid #fff; border-bottom: 0;}
.side-search .list-series ul li a { display: block; font-size: 1.5rem; line-height: 1.2; padding: 10px 20px 10px 10px; background: #fff; position: relative; font-feature-settings: "palt";}
.side-search .list-series ul li a:before { position: absolute; content:"\f054"; font-family: 'Font Awesome 5 Free'; font-weight: 900; right: 10px; top: 50%; transform: translateY(-50%); font-size: 1.0rem;}
.side-search .list-series ul li a i { margin-right: 10px;}
.side-search .list-series ul li a:hover { background: #eee;}

.side-search .list-keyword ul:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
.side-search .list-keyword ul li { float: left; width: 50%; border: 1px solid #fff; border-top: 0;}
.side-search .list-keyword ul li:nth-of-type(1), .side-search .list-keyword ul li:nth-of-type(2) { border-top: 1px solid #fff;}
.side-search .list-keyword ul li:nth-child(odd) { border-right: 0;}
.side-search .list-keyword ul li a { display: block; font-size: 1.4rem; line-height: 1.2; padding: 10px 20px 10px 10px; background: #fff; position: relative;}
.side-search .list-keyword ul li a:before { position: absolute; content:"\f054"; font-family: 'Font Awesome 5 Free'; font-weight: 900; right: 10px; top: 50%; transform: translateY(-50%); font-size: 1.0rem;}
.side-search .list-keyword ul li a:hover { background: #eee;}

/* NOTE: サンクスページ */
#thanks { text-align: center; padding: 50px 0;}
#thanks p { font-size: 1.6rem; line-height: 1.8;}
#thanks a { display: inline-block; background: #60c8d4; font-size: 1.8rem; color: #fff; padding: 10px 50px; margin-top: 50px; letter-spacing: 1px;}
#thanks a:hover { opacity: 0.8;}

/* NOTE: pageManage */
#pageManage .contents .layout-left .hole1 { width: 100%; padding: 30px; background: #eee; margin-bottom: 5px;}
#pageManage .contents .layout-left .hole1 p { font-size: 1.5rem; line-height: 2.0;}
#pageManage .contents .layout-left .hole1 .logo img { width: 180px; margin: 10px 0;}
#pageManage .contents .layout-left .btn { margin: 10px 0 0 0;}
#pageManage .contents .layout-left .btn a { display: inline-block; background: #60c8d4; color: #fff; padding: 10px 50px; line-height: 1; font-size: 1.5rem; border-radius: 3px; letter-spacing: 1px; position: relative;}
#pageManage .contents .layout-left .btn a:before { position: absolute; content:"\f054"; font-family: 'Font Awesome 5 Free'; font-weight: 900; right: 10px; top: 50%; transform: translateY(-50%); font-size: 1.4rem;}
#pageManage .contents .layout-left .btn a:hover { opacity: 0.8;}

#pageManage .contents .layout-left .hole2 { display: flex; flex-wrap: wrap;}
#pageManage .contents .layout-left .hole2:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
#pageManage .contents .layout-left .hole2 > .left { float: left; width: 25%; display: flex; justify-content: center; align-items: center; background: #eee; margin-right: 1%; padding: 20px; font-size: 1.6rem;}
#pageManage .contents .layout-left .hole2 > .right { float: right; width: 74%; background: #eee; padding: 10px;}

#pageManage .contents .layout-left .hole2 > .right .hole:after { content: ","; display: block; height: 0; clear: both; visibility: hidden;}
#pageManage .contents .layout-left .hole2 > .right .hole .left  { float: left; width: 40%; padding: 10px; font-size: 1.5rem; text-align: left; line-height: 2.0; font-feature-settings: "palt";}
#pageManage .contents .layout-left .hole2 > .right .hole .right { float: right; width: 60%; padding: 10px; font-size: 1.5rem; line-height: 2.0;}

#pageManage .contents .layout-left .hole3  { background: #ccc; padding: 5px; margin-top: 5px;}
#pageManage .contents .layout-left .hole3 h3 { background: #ccc; padding: 10px;}
#pageManage .contents .layout-left .hole3 .inner { padding: 20px; background: #eee; line-height: 2.0;}

/* NOTE: pageAbout */
#pageAbout .layout-left p { font-size: 1.4rem; line-height: 1.8; margin: 30px 0;}

/* NOTE: pageSitepolicy */
#pageSitepolicy .layout-left h3 { font-size: 1.8rem;}
#pageSitepolicy .layout-left p { font-size: 1.4rem; line-height: 1.8; margin: 30px 0;}
#pageSitepolicy .layout-left ul { padding-left: 20px; margin-bottom: 30px;}
#pageSitepolicy .layout-left ul li { list-style: disc; font-size: 1.4rem; margin-bottom: 10px;}
#pageSitepolicy .layout-left p a { color: #0066ff;}

/* NOTE: pageNotfound */
#pageNotfound #breadCrumbs { display: none;}
#pageNotfound .layout-left { text-align: center;}
#pageNotfound .layout-left span { font-size: 4.8rem; color: #ccc; letter-spacing: 2px;}
#pageNotfound .layout-left h2 { font-size: 1.8rem; }
#pageNotfound .layout-left p { margin: 50px 0; line-height: 1.5;}
#pageNotfound .layout-left a { background: #60c8d4; font-size: 1.8rem; color: #fff; padding: 10px 50px; letter-spacing: 1px;}