/*Theme Name: Ushigome Version: 1.0*/
/**************************************************** standard elements */
html,body {min-width: 100%; min-height: 100%; padding: 0; margin: 0; word-wrap: break-word;overflow: auto; box-sizing: border-box;
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-size: 14px; color: #000; line-height: 1.7em; 
-webkit-font-smoothing: antialiased;}

li {list-style: none;}
a {text-decoration: none; color: #3b3b3b; overflow: hidden; outline: none; word-wrap: break-word; word-break: break-all;}
a img {border: 0; vertical-align: top; opacity: 0; animation: 1s fadeIn forwards;}
@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
a:hover img {opacity: 0.6; transition: opacity 0.3s ease;}
img {vertical-align: top; opacity: 0; animation: 1s fadeIn forwards;}
@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
p {line-height: 1.8em; word-wrap: break-word;}
.br:before {content: "\A"; white-space: pre;}

/* hide */
.toggle_down, .menu_info {display: none;}

/* cancel hamburger */
#menu__toggle {display: none!important;}

/********* header */
header {width: 100%; height: 100px; position: fixed; z-index: 100;}
#head_top {background-color: rgb(255 255 255 / 0.95);}
#head_other {background-color: rgb(255 255 255 / 0.95);}
.head_box {padding-top: 50px; margin: 0 2%;}

.menu__box {float: right;}
.menu__box > li {float: left;}
.menu__box > li:last-of-type {display: none;}

/********* nav_current=slash ＋avoid menu shift */
.menu__box a span {position: relative; padding: 0 0.8em; display: inline-block; transition: color 0.3s cubic-bezier(.4,0,.2,1); }
.menu__box a span::before,
.menu__box a span::after {
  content: '/'; color: transparent; position: absolute;
  top: 0; font-size: 1em; line-height: inherit;}
.menu__box a span::before {left: 0;}
.menu__box a span::after {right: 0;}

.menu__box li.nav_current > a > span::before,
.menu__box li.nav_current > a > span::after {color: #3b3b3b;}

.menu__box li:not(.nav_current) > a:hover > span {color: #ccc;}
.menu__box li:not(.nav_current) > a:hover > span::after {opacity: 0 !important;}
/********* nav_currentt=slash ＋avoid menu shift */

.works_etc {display: none;}

.logo {vertical-align: middle; float: left;}
.logo a {font-size: 14px;}

/**************************************************** structure width: 1000px*/
#outer {display: flex; flex-direction: column; min-height: 100vh;}
#inner_top {padding: 100px 0 0 0; flex: 1; display: flex; flex-direction: column;}
#inner_full {width: 100%; padding: 120px 0 0;}
#inner_etc {width: 1000px; margin: 0 auto; padding: 180px 10px 80px 10px; box-sizing: border-box;}
#content_wrapper {max-width: 1000px; padding: 100px 10px 0; margin: 0 auto; box-sizing: border-box; display: table;}

#content_left {width: 20%;}
#content_right {width: 80%;}

.sub_menu {margin-bottom: 40px;}

/*************** footer (only for top page) */
.foot_top {width: 100%; height: auto; margin-top: auto; padding: 1% 0;
display: flex; align-items: center; background-color: #fff; z-index: 100;}

/********　news rewrite */
.if_news {padding: 5px 0 20px;}

/********　news archive */
.top_news {width: 70%; box-sizing: border-box; padding: 0 3%;}
.top_news a:hover {text-decoration: underline;}
.top_news dt {width: 100px; float:left; clear:both;}
.top_news dd {margin-left: 100px;}

/********　footer logo */
.top_logo {width: 30%; padding-right: 3%; box-sizing: border-box; display: flex; justify-content: flex-end; align-items: center;}

.top_logo img {width: 200px; height: auto; display: block; object-fit: contain;}

/*************** footer (all the other pages besides top page) */
.foot_other {width: 100%; height: 60px; margin-top: auto; display: block;}

.footer-flex {display: flex; align-items: center; justify-content: space-between;
width: 100%; height: 100%; list-style: none; margin: 0; padding: 0;}

.footer-text-logo {width: 340px; min-width: 340px; max-width: 340px;
padding-left: 2%; display: flex; flex-direction: column; justify-content: center;}
.footer-text-logo p {line-height: 1.2em;}
.footer-text-logo p:first-of-type {font-size: 13px; margin: 0;}
.footer-text-logo p:nth-child(2) {font-size: 11px; margin: 0; color: #666;}

.footer-hr {flex: 1 1 auto; position: relative; height: 100%; display: flex; align-items: flex-start;}
.footer-hr hr {position: absolute; top: 25px; left: 0; width: 100%; border: none; border-top: 1px solid #302928; margin: 0;}

.footer-img-logo {width: 200px; min-width: 200px; max-width: 200px; display: flex; align-items: center; justify-content: flex-end; padding-right: 2%;}
.footer-img-logo img {width: 200px; height: auto; display: block; object-fit: contain;}

/****** wp-navi */
.wp-pagenavi {width: 100%; display: flex; flex-wrap: wrap; justify-content: left; align-items: center; margin: 0; padding: 40px 0 40px 2%; box-sizing: border-box;}
.pages {display: none;}

.wp-pagenavi a,.wp-pagenavi a:hover, .wp-pagenavi span.current {width: 20px; height: 20px; line-height: 20px; padding: 5px!important; border: 0!important;}

.wp-pagenavi a {background-color: #dfdfdf; color: #fff; display: block; text-align: center; transition: background-color 0.2s ease-in; -webkit-transition: background-color 0.2s ease-in; float: left;}
.wp-pagenavi span.current {float: left;}
.wp-pagenavi a, .wp-pagenavi span {border: 0;}

.wp-pagenavi a:hover, .wp-pagenavi span.current {background-color: #b3b3b3; color: #fff; display: block; text-align: center;
transition: 0.2s ease-in; -webkit-transition: 0.2s ease-in;}
