@font-face {
    font-family: 'OneMobilePop';
    font-weight: normal;
    font-style: normal;
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/onestore/OneMobilePop.eot');
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/onestore/OneMobilePop.eot?#iefix') format('embedded-opentype'),
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/onestore/OneMobilePop.woff2') format('woff2'),
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/onestore/OneMobilePop.woff') format('woff'),
    src: url('https://cdn.jsdelivr.net/gh/webfontworld/onestore/OneMobilePop.ttf') format("truetype");
    font-display: swap;
}


a,article,aside,audio,blockquote,body,button,canvas,code,div,em,embed,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,input,label,li,main,nav,ol,output,p,pre,section,small,span,strong,table,tbody,td,textarea,time,ul,video
{background:0;border:0;color:inherit;font:inherit;margin:0;outline:0;padding:0;vertical-align:baseline}

:root{--header-height:400px;}



.main-header{position:relative;}
.main-header,body.home.main-header__container{align-items:flex-end;display:flex;flex-direction:row;justify-content:center;text-align:center}body.error404 
.main-header{display:none}
.main-header,.main-header__figure{height:var(--header-height);width:100%;}
.main-header__figure{background:#000;left:0;object-fit:cover;pointer-events:none;position:fixed;top:0;user-select:none;z-index:-1}
.main-header__banner{opacity:.3}
.main-header__banner>img{display:block;height:100%;left:0;object-fit:cover;position:absolute;top:0;transition:opacity .25s var(--ease-in-out-cubic);width:100%}
.main-header__banner>img.fade-out{opacity:0}
.main-header__container{color:#fff;display:flex;flex-direction:column;justify-content:center;padding:50px 0 240px;transition:transform .25s var(--ease-in-out-cubic),opacity .25s var(--ease-in-out-cubic);width:100%}html.loading 
.main-header__container{opacity:0;transform:translate3d(0,10px,0)}
.main-header__content{margin:0 auto;padding:0 10px;width:clamp(1px,100%,1120px)}:is(body.single,body.page) 
.main-header__content{width:clamp(1px,100%,880px)}
.main-header__article>a{display:block;text-align:left;width:100%}
.main-header__article>a>div:not(:last-child){margin-bottom:10px}
.main-header__article>a>div:last-child{font-size:.8rem;line-height:1.5rem;max-height:4.5rem;overflow:hidden}.article-info{font-size:.8rem;line-height:1.7;text-align:center}.article-category{color:#fff;display:inline-block;font-weight:700;line-height:1.7}.article-category.web,.article-category.web:hover{color:#66b3ff}.article-category.work,.article-category.work:hover{color:#b37700}.article-category.chat,.article-category.chat:hover{color:#ffdb4d}.article-category.gallery,.article-category.gallery:hover{color:#ff4d4d}.article-category.others,.article-category.others:hover{color:#999}
.main-header__content,.main-header__content a:not(.article-category){color:#c1c1c1}
.main-header__title{-webkit-line-clamp:4;-webkit-box-orient:vertical;color:#f1f1f1;display:-webkit-box;font-size:36px;line-height:1.5;margin:20px 0;max-height:316px;overflow:hidden}.article-info__dot{font-weight:800;margin:0 5px}.curve{fill:var(--bg-color);display:block}.curve--top{bottom:0;left:0;pointer-events:none;position:absolute;transition:opacity .25s ease-in-out}body[data-category=guestbook] .curve--top{opacity:0}
.main-header__title{font-family: 'OneMobilePop'};
.main-for-bg{background-color: #ffffff !important;}


.hidden {
  opacity:0;
}
.hidden2 {
  opacity:0;
}
.console-container {
  font-family:OneMobilePop;
  font-weight:300;
  font-size:30px;
  text-align:center;
  height:120px;
  width:100%;
  display:block;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  padding: 0 0px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.console-title{
  font-family:OneMobilePop
  font-weight:400;
  font-size:70px;
  color: #F2F2F2;
  margin:10px;
  letter-spacing: 1px;
}
.console-underscore {
   display:inline-block;
  position:relative;
  top:-0.05em;
  left:0px;
}
#text{
  font-size: 30px;
  font-weight: 400;
  color: #d2f7fc;
  background-image: linear-gradient(-90deg, #d2f7fc, #FFFF);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
}
.console-underscore{
  color: #d2f7fc;
}

.console-container2 {
  font-family:OneMobilePop;
  font-weight:300;
  font-size:20px;
  text-align:center;
  height:120px;
  width:100%;
  display:block;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  margin:auto;
  padding: 0 0px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.console-title2{
  font-family:OneMobilePop;
  font-weight:400;
  font-size:40px;
  color: #F2F2F2;
  margin:10px;
  letter-spacing: 1px;
}
.console-underscore2 {
   display:inline-block;
  position:relative;
  top:-0.05em;
  left:0px;
}
#text2{
  font-size: 20px;
  font-weight: 400;
  color: #d2f7fc;
  background-image: linear-gradient(-90deg, #d2f7fc, #FFFF);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
}
.console-underscore2{
  color: #d2f7fc;
}

    div.scroll_icon {
      position:absolute;
      z-index:2;
      margin:0 auto;
      text-align:center;
      width:100%;
      top:145%;
    }
    p.scroll_down {
       position: relative;
       animation-name: scroll_down;
       animation-duration: 2s;
       animation-iteration-count: infinite;
     }

     @keyframes scroll_down {
      0%   {top:0px;}
      50%  {top:15px;}
      100% {top:0px;}
    }

/*
    sns
*/

.sns-ic {
	height: 15px;
	width: auto;
}
.sns-ic:hover {
	height: 17px;
	width: auto;
}

a svg:hover #sns-cc {
	fill: #fd6528;
}


.chatbig-ic {
  width: 30px; 
  height: 30px;
  margin-top:15px;
}

a svg:hover #chatbig-cc {
	fill: #faf68f;
}

.chatbig-point {
   position:absolute;
   z-index:9999;
   width: 60px;
   height: 60px;
   background: #9999;
   margin-top:320px;
   margin-left:78%;
   border-radius: 50%;
}
.chatbig-point:hover {
   background: #0C5AB0;
   border-radius: 50%; 
}


/*
    menu
*/


#navigation-sticky {
	display: inline-block;
	align-content: center;
	justify-content: space-between;
	height: 60px;
	background: #e4e4e4;
	width: 100%;
	opacity : 0.85;
	box-shadow: 0px 0px 4px #444;
}
.console-title3{
  font-family:OneMobilePop;
  font-weight:400;
  font-size:20px;
  color: #333333;
  margin-left: 28%;
  letter-spacing: 1px;
}

.chat-ic {
	margin-right: 15px;
	margin-top: -42px;
	height: 25px;
	width: auto;
}
.chat-ic:hover {
	height: 30px;
	width: auto;
}

a svg:hover #chat-cc {
	fill: #fd6528;
}

