@charset "utf-8";
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■
■ layout
■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ layout
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
#page{ width: 100%; min-width: 800px; overflow: hidden; /*background-color: #ffff;*/ }
#header{ position: fixed; width: 100%; height: 54px; z-index: 10; }
#contents{ margin-top: 54px; }
#contents-right{ position: relative; /*background-color: #ffffff;*/ }
/* ========================================
= #page.radonsparesort
=========================================== */
#sidebar .title{ background-color: #1A1E23; color: #F9D8AE; }
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ #sidebar
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
/* pc */
#sidebar .inner{ border-right: 1px solid #DFDFDF; }
#sidebar .title.pc a{ height: 60px; line-height: 60px; color: #594736; border-bottom: 0.6px solid #DFDFDF; }
#sidebar .title.pc h1{ font-size: 1.0rem; font-family: serif; font-weight: normal; text-align: center; }
/* sp */
#sidebar .title.sp{ display: none; }
#sidebar .title.sp h1{ height: 60px; line-height: 60px; color: #594736; border-bottom: 0.6px solid #DFDFDF; font-size: 1.0rem; font-family: serif; font-weight: normal; text-align: center; }
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ #header
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
#header{ background-color: #ffff; background-color: #FAF7F1; border-bottom: 1px solid #E1E0E1; }
/* ========================================
= logo
=========================================== */
#header .menu{  }
#header .menu ul.first{ padding-left: 20px; }
#header .menu li{ display: inline-block; float: left; /*height: 60px; line-height: 60px; vertical-align: bottom; color: #ffffff; font-size: 0.875rem; margin-right: 10px;*/ }
/**/
#header h1{ text-align: center; font-size: 1.0rem; font-weight: normal; font-family: serif; letter-spacing: 0.21rem; letter-spacing: 0.1rem; text-transform: uppercase; }
#header .logo{ position: absolute; top: 2px; left: 6px; } 
#header .logo img{ width: 100px; height: auto; } 
#header .menu li.button{ display: none; }
#header .menu li.contact{ display: inline-block; /*line-height: 20px; height: 20px; margin: 10px 0; vertical-align: top;*/ }
#header a{ color: #ffffff; }

#header .home a{ color: #000000; line-height: 54px; /*padding: 12px 0 0;*/ display: inline-block; /*margin-top: 10px;*/ }

#header .home a:hover{ color: #594736; text-decoration: none; }
#header .menu li.contact a{ display: inline-block; border: 1px solid #fff; padding: 10px 30px 10px 10px; }
#header .menu li.contact a .style-awesome-link{ color: #fff; }
#header .menu .contact a:hover{ text-decoration: none; background-color: #fff; color: #30373F; }
#header .menu li.contact a:hover .style-awesome-link{ color: #30373F; }
#header .menu .second{  }
#header .menu .second li{ display: inline-block; margin-right: 20px; }
#header .menu .second li a{ display: inline-block; position: relative; vertical-align: top; margin-top: 10px; }

#header .menu li.contact a{ border: 1px solid #594736; color: #594736; padding: 10px 30px 10px 10px; height: 18px; }
#header .menu li.contact a .style-awesome-link{ right: 10px; color: #fff; }

#header .menu li.facebook a{ height: 18px; border-radius: 50%; width: 40px; height: 40px; }
#header .menu li.facebook a .style-awesome-link{ right: 15px; color: #fff; top: 9px; }
#header .menu li.facebook a{ background-color: #50575F; border: 1px solid #60676F; }
#header .menu li.facebook a .style-awesome-link{ color: #fff; }
#header .menu li.facebook a:hover{ background-color: #fff; border: 1px solid #60676F; }
#header .menu li.facebook a:hover .style-awesome-link{ color: #30373F; }
/* --------------------------------------------------
- menu
CSS3アニメーションを使ったトグルのメニューボタン
http://sterfield.co.jp/designer/最近見かけるcss3アニメーションを使ったトグルの.html
-------------------------------------------------- */
#menuButton{ display: block; width: 42px; height:42px; position: relative; top: 4px; left: 10px; z-index: 3; }
#menuButton span { display: block; width: 24px; height: 2px; position: absolute; /*left: 9px;*/ transition: all 0.4s; -webkit-transition: all 0.4s; -moz-transition: all 0.4s; }
#menuButton span:first-child { top: 12px; }
#menuButton span:nth-child(2) { margin-top: -1px; top: 50%; }
#menuButton span:last-child { bottom: 12px; }
#menuButton.active span:first-child {
-webkit-transform: translateY(8px) rotate(45deg);
-moz-transform: translateY(8px) rotate(45deg);
-ms-transform: translateY(8px) rotate(45deg);
transform: translateY(8px) rotate(45deg);
}
#menuButton.active span:nth-child(2) { opacity: 0; }
#menuButton.active span:last-child {
-webkit-transform: translateY(-8px) rotate(-45deg);
-moz-transform: translateY(-8px) rotate(-45deg);
-ms-transform: translateY(-8px) rotate(-45deg);
transform: translateY(-8px) rotate(-45deg);
}
/* radonsparesort */
#page.radonsparesort #menuButton span{ background: #000; }
/* shigarakinosato */
#page.shigarakinosato #menuButton span{ background: #000; }

/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ #sidebar
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
#site-footer{ background-color: #FAF7F1; display: block; }
#site-footer .copy { font-size: 0.65rem; text-align: right; padding: 10px 10px 10px 0; color: #000; }
/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
■
■ 
■
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ 
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
/* ==================================================
= message
================================================== */
/*#message{ display: none; }*/
/* ==================================================
= trush
================================================== */
.profile{ margin-top: 20px; margin-left: 10px; margin-right: 10px; }
.profile table{ border-collapse: collapse; border-spacing: 0; width: 100%; }
.profile table .path, .profile table .create, .profile table .update{ border-bottom: dotted 0.9px rgba(89, 71, 54, 0.6); padding-right: 10px; }
.profile table .create, .profile table .update, .profile table .description{ text-align: right; padding-right: 10px; }
.profile table td.title{ /*border-bottom: dotted 0.9px rgba(89, 71, 54, 0.6);*/ }
.profile table .label { font-size: 0.6rem;; padding-left: 10px; color: rgba(89, 71, 54, 0.4); }
.profile table p{ font-size: 0.65rem; color: 333333; padding-left: 10px; }
.profile table .path p{ display: inline-block; font-size: 0.75rem; line-height: 0.8rem; padding-bottom: 2px; }
.profile table .title .label{ width: 40px; display: inline-block; vertical-align: 16px; }
.profile table .title h1 { display: inline-block; width: calc(100% - 110px); text-align: center; font-size: 1.8rem; font-family: serif; color: #2c3a44; padding-top: 10px; padding-bottom: 10px; padding-right: 50px; }
.profile table .title h1 .protected{ font-size: 0.6rem; font-weight: normal; color: #999; margin-left: 10px; display: none; }
.profile table p.contribution{ display: inline-block; color: #666; }
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ #content
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
/* ========================================
= #content : home
=========================================== */
/* ========================================
= #mainvisual
=========================================== */
/*
#content .mainvisual.fit{ overflow: hidden; width: 100%; }
#content .mainvisual.fit.pc{ height: 400px; }
#content .mainvisual.fit.pc img{ height: 100%; }
#content .mainvisual.fit.sp img{ width: 100%; }
*/
#content .mainvisual img{ width: 100%; }
/* ========================================
= #menu
=========================================== */
#content #menu{ font-family: serif; font-size: 0.875rem; }
#content #menu li{ width: 120px; height: 90px; line-height: 90px; text-align: center; float: left; }
#content #menu li.home{ color: #2F5659; }
#content #menu li.accsess{ background-color: #EDE6E2; }
#content #menu li.reserve{ background-color: #231815; color: #ffffff; }
#content #menu li.reserve a{ color: #ffffff; }
/* □□□□□□□□□□□□□□□□□□□□□□□□□□□□□□
□ article
□□□□□□□□□□□□□□□□□□□□□□□□□□□□□□ */
article{ padding: 20px 0; }
/* ========================================
= section
=========================================== */
article .section{ margin-bottom: 40px; }
article .section h4{ margin-bottom: 20px; }
article .section .image{ border-radius: 50%; width: 200px; height: 200px; overflow: hidden; margin: 0 20px 10px 0; }
article .section .image img{ width: 100%; }
/* ========================================
= lead
=========================================== */
article .lead{ margin-left: 40px; margin-right: 40px; }
article .lead h3{ line-height: 2.0rem; font-size: 1.2rem; letter-spacing: 0.10rem; border-bottom: 4px solid rgba(48, 55, 63, 0.2); margin-bottom: 0.875rem;}
article .lead p{ color: #594736; line-height: 1.6rem; font-size: 0.875rem; font-size: 1.0rem; letter-spacing: 0.06rem; }
/* ========================================
= index
=========================================== */
article .index{ text-align: center; margin-left: 40px; margin-right: 40px; }
article .index h3{ color: #666; text-align: center; margin-bottom: 16px; border-bottom: 3px solid #666; display: inline-block; }
article .index h3 { color: #111; text-align: center; margin-bottom: 16px; border-bottom: 1px solid rgba(209, 125, 116, 0.6); display: inline-block;
letter-spacing: 0.08rem; line-height: 1.1rem; font-size: 0.75rem; font-weight: normal; /* font-family: "Tw Cen W01 Light", sans-serif; */ text-transform: uppercase; }
article .index ul{ text-align: left; background-color: #f4f2f0; padding: 10px 20px 20px; border-radius: 6px; }
article .index li{ border-bottom: 1px solid #e1e0e1; padding: 10px 0; font-size: 0.875rem; }
article .index li a::before{ padding-right: 6px; }
/* ========================================
= chapter
=========================================== */
article .chapter{ position: relative; margin-left: 20px; margin-right: 20px; padding-left: 20px; padding-bottom: 40px; border-left: 0.5px solid #d4d2d2; }
article .chapter::before{ content: ''; display: block; position: absolute; top: 0; left: 0; width: 5px; height: 30px; background-color: #ff6666; background-color: #426486; }
article .chapter h3{ line-height: 2.0rem; font-size: 1.2rem; letter-spacing: 0.10rem; border-bottom: 1px solid rgba(50, 40, 50, 0.2); margin-bottom: 0.875rem;}
/*
article .chapter h3::before { content: ''; display: inline-block; width: 1rem; height: 0.875em; background-image: url(./images/rsr-mark-chapter.svg); background-position: 0 0; background-repeat: no-repeat; background-size: contain; margin-right: 4px; }
*/
article .chapter p{ color: #333; line-height: 1.8rem; font-size: 1rem; letter-spacing: 0.08rem;
/*font-family: "Noto Sans Japanese", 游ゴシック, "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;*/
font-family: 游ゴシック, "Yu Gothic", YuGothic, sans-serif ;
}
/* --------------------------------------------------
- 戻る
-------------------------------------------------- */
.references a.fa-reply{ display: none;  position: absolute; right: 2em; background-color: rgba(255, 255, 255, 0.6); width: 50px; height: 50px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; text-align: center; box-shadow: 1px 1px 3px #aaa; box-shadow: 1px 1px 5px #999; color: #333; z-index: 100; -webkit-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg); }
.references a.fa-reply::before{ vertical-align: -16px; }
.references a.fa-reply:hover{ text-decoration: none; color: #666; }