:root {
    --primary: #0f4976;
    --text: #111;
    --border: #ddd;
    --white: #fff;
}

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}

html, body {
  overflow-x: hidden;
}
body {
  color: var(--text);
  font-weight: bold;
  font-size: 15px;
  line-height: 1.5;
  text-size-adjust: 100%;
  font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}

body.is-fixed {
  overflow: hidden;
  position: fixed;
  width: 100vw;
}

.font-yugothic {
  font-family: "Yu Gothic", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif !important;
}

ul {
  list-style-type: none;
}

a {
  color: currentcolor;
  text-decoration: none;
  transition:
    color 0.2s ease 0s,
    background-color 0.2s ease 0s,
    border-color 0.2s ease 0s,
    opacity 0.2s ease 0s;
}

a:hover {
  opacity: 0.5;
}

img {
  max-width: 100%;
}
h1 {
  display: none;
}

/** Efect */
.effect_box_up {
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  -webkit-transform: translateY(20px) rotate(0deg);
  -ms-transform: translateY(20px) rotate(0deg);
  transform: translateY(20px) rotate(0deg);
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}
.effect_box_up.leff {
  opacity: 1;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  -webkit-transform: translateY(0) rotate(0deg);
  -ms-transform: translateY(0) rotate(0deg);
  transform: translateY(0) rotate(0deg);
}
.effect_box_spot {
  -webkit-transition: 0.8s ease-in-out;
  -moz-transition: 0.8s ease-in-out;
  -o-transition: 0.8s ease-in-out;
  transition: 0.8s ease-in-out;
  opacity: 0;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
}
.effect_box_spot.leff {
  opacity: 1;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 120px; 
}
@media screen and (max-width: 767px) {
  html {
    scroll-padding-top: 70px;
  }
}
/*Light Hover*/
.light-hover{
  position: relative;
  overflow: hidden;
}
.light-hover:after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: -webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(rgba(255,255,255,.1019607843)),to(rgba(255,255,255,.1490196078)));
  background: -webkit-linear-gradient(left,rgba(255,255,255,0),rgba(255,255,255,.1019607843),rgba(255,255,255,.1490196078));
  background: linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,.1019607843),rgba(255,255,255,.1490196078));
  -webkit-transform: skew(-25deg);
  transform: skew(-25deg);
  z-index: 2;
}
.is-hover:hover .light-hover:after,
.is-hover:hover.light-hover::after {
  -webkit-animation: move 1s;
  animation: move 1s
}
@-webkit-keyframes move {
  to {
      left: 125%
  }
}

/*End Light Hover*/
.line-hover{
  position: relative;
  overflow: hidden;
  display: -webkit-inline-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.line-hover::before {
  position: absolute;
  content: "";
  background: #111;
  width: 0;
  height: 1px;
  bottom: 2px;
  left: 0;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.lines-hover{
  text-decoration: none;
  background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0)),
    linear-gradient(to right, rgba(17, 17, 17, 1), rgba(17, 17, 17, 1), rgba(17, 17, 17, 1));
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0px 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s;
  display: inline;
}
.is-hover:hover .line-hover::before,
.line-hover:hover::before{
  width: 100%;
}
.is-hover:hover .lines-hover,
.lines-hover:hover {

  background-size: 0 1px, 100% 1px;
}
/** End Efect*/
/** Space */
/** Space */
.mt200 { margin-top: 200px !important; }
.mt190 { margin-top: 190px !important; }
.mt180 { margin-top: 180px !important; }
.mt170 { margin-top: 170px !important; }
.mt160 { margin-top: 160px !important; }
.mt150 { margin-top: 150px !important; }
.mt140 { margin-top: 140px !important; }
.mt130 { margin-top: 130px !important; }
.mt120 { margin-top: 120px !important; }
.mt110 { margin-top: 110px !important; }
.mt100 { margin-top: 100px !important; }
.mt90  { margin-top: 90px !important; }
.mt80  { margin-top: 80px !important; }
.mt75  { margin-top: 75px !important; }
.mt70  { margin-top: 70px !important; }
.mt65  { margin-top: 65px !important; }
.mt60  { margin-top: 60px !important; }
.mt55  { margin-top: 55px !important; }
.mt50  { margin-top: 50px !important; }
.mt45  { margin-top: 45px !important; }
.mt40  { margin-top: 40px !important; }
.mt35  { margin-top: 35px !important; }
.mt30  { margin-top: 30px !important; }
.mt25  { margin-top: 25px !important; }
.mt20  { margin-top: 20px !important; }
.mt15  { margin-top: 15px !important; }
.mt10  { margin-top: 10px !important; }
.mt5   { margin-top: 5px !important; }
.mt0   { margin-top: 0 !important; }

.mb100 { margin-bottom: 100px !important; }
.mb90  { margin-bottom: 90px !important; }
.mb80  { margin-bottom: 80px !important; }
.mb70  { margin-bottom: 70px !important; }
.mb60  { margin-bottom: 60px !important; }
.mb50  { margin-bottom: 50px !important; }
.mb40  { margin-bottom: 40px !important; }
.mb30  { margin-bottom: 30px !important; }
.mb20  { margin-bottom: 20px !important; }
.mb10  { margin-bottom: 10px !important; }
.mb0   { margin-bottom: 0 !important; }

.pt200 { padding-top: 200px !important; }
.pt190 { padding-top: 190px !important; }
.pt180 { padding-top: 180px !important; }
.pt170 { padding-top: 170px !important; }
.pt160 { padding-top: 160px !important; }
.pt150 { padding-top: 150px !important; }
.pt140 { padding-top: 140px !important; }
.pt130 { padding-top: 130px !important; }
.pt120 { padding-top: 120px !important; }
.pt110 { padding-top: 110px !important; }
.pt100 { padding-top: 100px !important; }
.pt90  { padding-top: 90px !important; }
.pt80  { padding-top: 80px !important; }
.pt75  { padding-top: 75px !important; }
.pt70  { padding-top: 70px !important; }
.pt65  { padding-top: 65px !important; }
.pt60  { padding-top: 60px !important; }
.pt55  { padding-top: 55px !important; }
.pt50  { padding-top: 50px !important; }
.pt45  { padding-top: 45px !important; }
.pt40  { padding-top: 40px !important; }
.pt35  { padding-top: 35px !important; }
.pt30  { padding-top: 30px !important; }
.pt25  { padding-top: 25px !important; }
.pt20  { padding-top: 20px !important; }
.pt15  { padding-top: 15px !important; }
.pt10  { padding-top: 10px !important; }
.pt5   { padding-top: 5px !important; }
.pt0   { padding-top: 0 !important; }

.pb100 { padding-bottom: 100px !important; }
.pb90  { padding-bottom: 90px !important; }
.pb80  { padding-bottom: 80px !important; }
.pb70  { padding-bottom: 70px !important; }
.pb60  { padding-bottom: 60px !important; }
.pb50  { padding-bottom: 50px !important; }
.pb40  { padding-bottom: 40px !important; }
.pb30  { padding-bottom: 30px !important; }
.pb20  { padding-bottom: 20px !important; }
.pb10  { padding-bottom: 10px !important; }
.pb0   { padding-bottom: 0 !important; }

.pl20 { padding-left: 20px !important; }
.pl0  { padding-left: 0 !important; }

.pr20 { padding-right: 20px !important; }
.pr0  { padding-right: 0 !important; }

/* Tablet */
@media (max-width: 1024px) {
  .mt-tab80 { margin-top: 80px !important; }
  .mt-tab70 { margin-top: 70px !important; }
  .mt-tab60 { margin-top: 60px !important; }
  .mt-tab50 { margin-top: 50px !important; }

  .mb-tab80 { margin-bottom: 80px !important; }
  .mb-tab70 { margin-bottom: 70px !important; }
  .mb-tab60 { margin-bottom: 60px !important; }
  .mb-tab50 { margin-bottom: 50px !important; }

  .pt-tab80 { padding-top: 80px !important; }
  .pt-tab70 { padding-top: 70px !important; }
  .pt-tab60 { padding-top: 60px !important; }
  .pt-tab50 { padding-top: 50px !important; }

  .pb-tab80 { padding-bottom: 80px !important; }
  .pb-tab70 { padding-bottom: 70px !important; }
  .pb-tab60 { padding-bottom: 60px !important; }
  .pb-tab50 { padding-bottom: 50px !important; }
}

/* Project responsive spacing */
@media (max-width: 1199px) {
  .pt-md90 { padding-top: 90px !important; }
  .pb-md90 { padding-bottom: 90px !important; }
}

/* Smartphone */
@media (max-width: 767px) {
  .mtsp60 { margin-top: 60px !important; }
  .mtsp50 { margin-top: 50px !important; }
  .mtsp40 { margin-top: 40px !important; }
  .mtsp30 { margin-top: 30px !important; }
  .mtsp20 { margin-top: 20px !important; }
  .mtsp10 { margin-top: 10px !important; }
  .mtsp0  { margin-top: 0 !important; }

  .mbsp60 { margin-bottom: 60px !important; }
  .mbsp50 { margin-bottom: 50px !important; }
  .mbsp40 { margin-bottom: 40px !important; }
  .mbsp30 { margin-bottom: 30px !important; }
  .mbsp20 { margin-bottom: 20px !important; }
  .mbsp10 { margin-bottom: 10px !important; }
  .mbsp0  { margin-bottom: 0 !important; }

  .ptsp70 { padding-top: 70px !important; }
  .ptsp60 { padding-top: 60px !important; }
  .ptsp50 { padding-top: 50px !important; }
  .ptsp40 { padding-top: 40px !important; }
  .ptsp30 { padding-top: 30px !important; }
  .ptsp20 { padding-top: 20px !important; }
  .ptsp0  { padding-top: 0 !important; }

  .pbsp70 { padding-bottom: 70px !important; }
  .pbsp60 { padding-bottom: 60px !important; }
  .pbsp50 { padding-bottom: 50px !important; }
  .pbsp40 { padding-bottom: 40px !important; }
  .pbsp30 { padding-bottom: 30px !important; }
  .pbsp20 { padding-bottom: 20px !important; }
  .pbsp0  { padding-bottom: 0 !important; }

  .plsp0 { padding-left: 0 !important; }
  .prsp0 { padding-right: 0 !important; }
}
/** Layout */.l-container{width:100%;margin:auto;padding:0 20px}.l-container--1800{max-width:1840px}.l-container--1700{max-width:1740px}.l-container--1600{max-width:1640px}.l-container--1400{max-width:1440px}.l-container--1300{max-width:1340px}.l-container--1200{max-width:1240px}.l-container--1100{max-width:1140px}.l-container--1000{max-width:1040px}.l-container--900{max-width:940px}.l-container--800{max-width:840px}/** End Layout */
/** Position */
.u-tc{text-align: center;}.u-tl{text-align: left;}.u-tr{text-align: right;}
.u-center{margin-left: auto;margin-right: auto;}
/** End Position */
/** Display */
.u-sp,
.u-tab,
.u-tabOnly {
  display: none !important;
}
@media screen and (max-width: 1024px) {
  .u-pcOnly {
    display: none !important;
  }
  .u-tab,
  .u-tabOnly {
    display: block !important;
  }
}
@media screen and (max-width: 767px) {
  .u-pc,
  .u-tabOnly {
    display: none !important;
  }
  .u-sp {
    display: block !important;
  }
}
/** End Display */
/**Text*/
.u-fw500{
  font-weight: 500;
}
.u-lh2{
  line-height: 2;
}
.u-orange{
  color: var(--main);
}
.u-fs40{
  font-size: 40px;
}
.u-fs38{
  font-size: 38px;
}
.u-fs36{
  font-size: 36px;
}
.u-fs35{
  font-size: 35px;
}
.u-fs34{
  font-size: 34px;
}
.u-fs32{
  font-size: 32px;
}
.u-fs30{
  font-size: 30px;
}
.u-fs28{
  font-size: 28px;
}
.u-fs26{
  font-size: 26px;
}
.u-fs25{
  font-size: 25px;
}
.u-fs24{
  font-size: 24px;
}
.u-fs22{
  font-size: 22px;
}
.u-fs20{
  font-size: 20px;
}
.u-fs18{
  font-size: 18px;
}
.u-fs16{
  font-size: 16px;
}
.u-fs15{
  font-size: 15px;
}
.u-fs13{
  font-size: 13px;
}
.u-fs12{
  font-size: 12px;
}
.u-fs11{
  font-size: 11px;
}
.u-fs10{
  font-size: 10px;
}
@media(max-width: 1024px){
  .u-fs40{
    font-size: 36px;
  }
  .u-fs38{
    font-size: 34px;
  }
  .u-fs36{
    font-size: 32px;
  }
  .u-fs35{
    font-size: 30px;
  }
  .u-fs34{
    font-size: 28px;
  }
  .u-fs32{
    font-size: 26px;
  }
  .u-fs30{
    font-size: 24px;
  }
  .u-fs28{
    font-size: 22px;
  }
  .u-fs26{
    font-size: 20px;
  }
  .u-fs25{
    font-size: 20px;
  }
  .u-fs24{
    font-size: 20px;
  }
  .u-fs22{
    font-size: 19px;
  }
  .u-fs20{
    font-size: 18px;
  }
  .u-fs18{
    font-size: 17px;
  }
}
@media(max-width: 768px){
  .u-fs40{
    font-size: 30px;
  }
  .u-fs38{
    font-size: 28px;
  }
  .u-fs36{
    font-size: 26px;
  }
  .u-fs35{
    font-size: 25px;
  }
  .u-fs34{
    font-size: 24px;
  }
  .u-fs32{
    font-size: 22px;
  }
  .u-fs30{
    font-size: 22px;
  }
  .u-fs28{
    font-size: 20px;
  }
  .u-fs26{
    font-size: 20px;
  }
  .u-fs25{
    font-size: 20px;
  }
  .u-fs24{
    font-size: 18px;
  }
  .u-fs22{
    font-size: 16px;
  }
  .u-fs20{
    font-size: 17px;
  }
  .u-fs18{
    font-size: 16px;
  }
  .u-fs16{
    font-size: 14px;
  }
  .u-fs15{
    font-size: 13px;
  }
  .u-fs13{
    font-size: 12px;
  }
  .u-fs12{
    font-size: 11px;
  }
  .u-fs11{
    font-size: 10px;
  }
  .u-fs10{
    font-size: 9px;
  }
}
/**End Text*/
/* Utility extension required by the supplied design */
.u-fs54 { font-size: 54px; }
@media (max-width: 767px) { .u-fs54 { font-size: 38px; } }
