@charset "utf-8";

/* --- BASE --- */
body {
 margin: 0;
 padding: 0;
 overflow: visible;
}
/* LIGHT BOX */
html {box-sizing: border-box;}*,:after,:before{box-sizing: inherit;}
img {height:auto;max-width:100%}
/* End LIGHT BOX */
/* HEADING FONT */
.entry-content h1,h1 {
 color: #000; 
 font-size: 112em;
 line-height: 1.2;
}
.entry-content h2,h2 {
 color: #000; 
 font-size: 1.7em;
 line-height: 1.3;
}
.entry-content h3,h3 {
 color: #000; 
 font-size: 30px;
 line-height: 300%;
}
.entry-content h4,h4 {
 color: #000; 
 line-height: 1.5;
 font-size: 1.3em;
}
.entry-content h5,h5 {
 color: #000; 
 line-height: 1.6;
 font-size: 1.2em;
}
.entry-content h6,h6 {
 color: #000; 
 line-height: 1.7;
 font-size: 1.1em;
}
/* End HEADING FONT */
/* End --- BASE --- */

/* HEADER */
.header {
 z-index: 777;
 width: 100%;
 height: 100vh;
 display: flex;  /* フレックスボックスにする */
 flex-wrap: wrap;  /* 子要素　折り返す */
 /*
 justify-content: center;
 子要素　横並び　右揃え・中央揃え・均等に配置など　横方向の配置位置 */
 flex-direction: row;  /* 子要素　上下左右　並ぶ方向を指定 */
}
/* End HEADER */

/* LOGO */
.flex_logo-item {
 z-index: 777;
 position: fixed;
 top: 28px;
 left: 50%;
 margin: -30px 0 0 -30px; /* 完全に中央に配置するため、上・左の margin を負の数に設定 */
 padding: 0px 0% 0% 0%;
 width: 60px;
 height: 60px;
 display: block;
 background: no-repeat url("../image/logo.svg");
 background-position: center;
 background-size: 66%;
}
.logo-link {
text-align: center;
justify-content: center;
align-items: center;
margin: 0px 0% 0% 0%;
padding: 0px 0% 0% 0%;
}
/* EndLOGO */

/* NAV CONTAINER */
.navtext-container {
 z-index: 777;
 width: 100%;
 height: 60px;
 position: fixed;
 box-sizing: border-box;  /* 子要素　width・heightにpaddingやborderのサイズを含む */   
 justify-content: center;
 align-items: center;  /* 子要素　上揃え・真ん中揃えなど　縦位置 */   
 align-content: center;  /* 子要素　align-itemsの複数行バージョン　縦方向についても、位置やバランスを調整 */   
}
/* End NAV CONTAINER */

/* NAV TEXT */
.navtext {
 position: fixed;
 top: 16px;
 text-transform: uppercase;
 color: #000;
 right: 10%;
 letter-spacing: 2px;
 font-size: 14px;
 font-weight: normal;
 font-family: Allrounder Monument,"ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
}
/* End NAV TEXT */

/* FLEX-ITEM MENU SP */
.menu_sp {
 z-index: 777;
 position: fixed;
 list-style: none;
 width: 100%;
 height: auto;
 top: 0;
 text-align: right;
 margin-top: 52px;
 padding: 0 0 10px 0;
 clear: both;
 background: var(--background-navbar);
 transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
 transform: scale(1, 0);
 transform-origin: top;
}
/* Hamburger menu button */
.menu-btn_sp:checked ~ .menu_sp {
 transform: scale(1, 1);
 transform-origin: top;
 transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
/* Hamburger menbu text */
.menu_sp a {
 text-decoration: none;
 font-weight: normal;
 letter-spacing: 1px;
 font-size: 12px;
 text-transform: capitalize;
 color: #666;
 opacity: 0;
 transition: 0.5s;
 display: block;
 padding: 8px 5% 8px 0px;
 font-family: Allrounder Monument,"ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
}
.menu_sp a:hover {
 font-weight: normal;
 color: #fff;
 background-color: #000;
 display: block;
 padding: 8px 5% 8px 0px;
}
.menu_sp_visit {
 text-decoration: none;
 font-weight: normal;
 letter-spacing: 1px;
 font-size: 12px;
 text-transform: capitalize;
 color: #fff;
 background-color: #000;
 padding: 8px 5% 8px 0px;
 font-family: Allrounder Monument,"ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
}
.menu_sp li {
 border-top: 0px solid rgb(75, 75, 75);
 padding: 0;
 margin: 0;
 opacity: 0;
 transition: 0.5s;
 width: 100%;
}.menu-btn_sp:checked ~ .menu_sp a,
.menu-btn_sp:checked ~ .menu_sp li {
 opacity: 1;
 transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.2s;
}
.menu-btn_sp {
 display: none;
}
.menu-icon_sp {
 z-index:  777;
 position: fixed;
 display: inline-block;
 cursor: pointer;
 padding: 28px 14px;
 -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.navicon_sp {
 background: #666;
 display: block;
 height: 3px;
 width: 26px;
 position: relative;
 transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
.navicon_sp:before,
.navicon_sp:after {
 content: "";
 display: block;
 height: 100%;
 width: 100%;
 position: absolute;
 background: #666;
 transition: 0.3192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
.navicon_sp:before {
 top: 9px;
}
.navicon_sp:after {
 bottom: 9px;
}
/* Hamburger Menu Animation Start */
.menu-btn_sp:checked ~ .menu-icon_sp .navicon_sp:before {
 transform: rotate(-45deg);
}
.menu-btn_sp:checked ~ .menu-icon_sp .navicon_sp:after {
 transform: rotate(45deg);
}
.menu-btn_sp:checked ~ .menu-icon_sp:not(.steps) .navicon_sp:before {
 top: 0;
}
.menu-btn_sp:checked ~ .menu-icon_sp:not(.steps) .navicon_sp:after {
 bottom: 0;
}
.menu-btn_sp:checked ~ .menu-icon_sp .navicon_sp {
 background: rgba(0, 0, 0, 0);
 transition: 0.2192s cubic-bezier(0.04, 0.04, 0.12, 0.96) 0.1008s;
}
/* End FLEX-ITEM MENU PC */

/* FLEX-ITEM MENU PC */
.flex_menu_pc-item {
 position: fixed;
 z-index: 0;
 width: 200px;
 margin: 0% 0% 0% 0%;
 padding: 0% 0% 0% 0%;
 bottom: 15%;
 }
.menu_pc ul {
 list-style: none;
 margin: 0;
 padding: 0;
}
.menu_pc ul li a {
 text-decoration: none;
 display: block;
 font-weight: normal;
 letter-spacing: 1px;
 font-size: 16px;
 color: #000;
 text-align: left;
 padding: 5.5px 0px 5.5px 20px;
 text-transform: capitalize;
 transition: 0.5s;
 font-family: Allrounder Monument,"ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
}
.menu_pc ul li a:hover {
 color: #eee;
}
.menu_span {
 text-decoration: none;
 display: block;
 font-weight: normal;
 letter-spacing: 1px;
 font-size: 16px;
 color: #000;
 text-align: left;
 padding: 0px 0px 15px 20px;
 transition: 0.5s;
 white-space: nowrap;
 background: no-repeat url("../image/menu_bar_sp.svg");
 background-position: center top 10px;
}
.portfolio_span {
 text-decoration: none;
 display: block;
 font-weight: normal;
 letter-spacing: 1px;
 font-size: 28px;
 color: #000;
 text-align: left;
 padding: 0px 0px 15px 20px;
 transition: 0.5s;
 white-space: nowrap;
 font-family: Allrounder Monument,"ヒラギノ角ゴ ProN W3", HiraKakuProN-W3, 游ゴシック, "Yu Gothic", メイリオ, Meiryo, Verdana, Helvetica, Arial, sans-serif;
}
.flex_portfolio_pc-item {
 opacity: 0;
 }
/* End FLEX-ITEM MENU PC */

/* FLEX-ITEM MENU INSTAGRAM */
.flex_instagram_pc-item {
 z-index: 0;
 margin: 9px 0% 0% 0px;
 padding: 0px 0% 0% 0%;
 width: 20px;
 height: 20px;
 display: block;
 background: no-repeat url("../image/instagram_icon.svg");
 background-position: left top 4px;
 background-size: 68%;
 text-align: left;
 justify-content: left;
 align-items: left;
 }
.language_span {
 text-decoration: none;
 display: block;
 font-weight: normal;
 color: #000;
}
/* End FLEX-ITEM MENU INSTAGRAM */