@charset "UTF-8";
/* Scss Document */
/*---------------------------------------------*/
/* SCSS Load                                   */
/*---------------------------------------------*/
/*basic*/
/*スペース*/
.bt-sp10 {
  margin-bottom: 10px !important; }

.bt-sp20 {
  margin-bottom: 20px !important; }

.bt-sp30 {
  margin-bottom: 30px !important; }

.bt-sp40 {
  margin-bottom: 40px !important; }

.bt-sp80 {
  margin-bottom: 80px !important; }

/*グリッドシステムのガター調整*/
.row-0 {
  margin-left: 0px;
  margin-right: 0px; }
  .row-0 > div {
    padding-right: 0px;
    padding-left: 0px;
    padding-bottom: 0px; }

.row-10 {
  margin-left: -5px;
  margin-right: -5px; }
  .row-10 > div {
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 5px; }

.row-20 {
  margin-left: -10px;
  margin-right: -10px; }
  .row-20 > div {
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 20px; }

.row-30 {
  margin-left: -15px;
  margin-right: -15px; }
  .row-30 > div {
    padding-right: 15px;
    padding-left: 15px;
    padding-bottom: 30px; }

/*比率を保って拡大・縮小処理*/
.ratio-1_1:before {
  content: "";
  display: block;
  padding-top: 100%;
  /* 1:1 */ }

.ratio-7_3:before {
  content: "";
  display: block;
  padding-top: 30%;
  /* 7:3 */ }

.ratio-8_2:before {
  content: "";
  display: block;
  padding-top: 20%;
  /* 8:2 */ }

.ratio-1_2:before {
  content: "";
  display: block;
  padding-top: 200%;
  /* 1:2 */ }

.ratio-4_3:before {
  content: "";
  display: block;
  padding-top: 75%;
  /* 4:3 */ }

.ratio-16_9:before {
  content: "";
  display: block;
  padding-top: 56.25%;
  /* 16:9 */ }

.ratio-8_5:before {
  content: "";
  display: block;
  padding-top: 62.5%;
  /* 8:5 ≒ 黄金比 */ }

.ratio-1_1,
.ratio-7_3,
.ratio-8_2,
.ratio-1_2,
.ratio-4_3,
.ratio-16_9,
.ratio-8_5 {
  position: relative;
  overflow: hidden; }

.ratio-1_1 > img,
.ratio-7_3 > img,
.ratio-8_2 > img,
.ratio-1_2 > img,
.ratio-4_3 > img,
.ratio-16_9 > img,
.ratio-8_5 > img {
  position: absolute;
  top: 0;
  left: 0; }

/*---------------------------------------------*/
/*追加グリッド                                 */
/*---------------------------------------------*/
.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
  position: relative;
  min-height: 1px; }

.col-xs-15 {
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%; }

@media (min-width: 768px) {
  .col-sm-15 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; } }
@media (min-width: 992px) {
  .col-md-15 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; } }
@media (min-width: 1200px) {
  .col-lg-15 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%; } }
/*---------------------------------------------*/
/* ULリストテーブル化                          */
/*---------------------------------------------*/
.table-ul {
  padding-left: 0px;
  list-style: none;
  width: 100%; }
  .table-ul > li {
    display: table;
    width: 100%; }
    .table-ul > li > div:first-child {
      display: table-cell; }
    .table-ul > li > div:last-child {
      display: table-cell; }

.table-md-ul {
  padding-left: 0px;
  list-style: none; }

@media (min-width: 768px) {
  .table-md-ul {
    width: 100%; }
    .table-md-ul > li {
      display: table;
      width: 100%; }
      .table-md-ul > li > div:first-child {
        display: table-cell; }
      .table-md-ul > li > div:last-child {
        display: table-cell; } }
/*---------------------------------------------*/
/* br無効化                                    */
/*---------------------------------------------*/
@media (max-width: 767px) {
  .no-br br {
    display: none; } }
/* AOS */
body[data-aos-duration='50'] [data-aos], [data-aos][data-aos][data-aos-duration='50'] {
  transition-duration: 50ms; }
body[data-aos-delay='50'] [data-aos], [data-aos][data-aos][data-aos-delay='50'] {
  transition-delay: 0s; }
  body[data-aos-delay='50'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='50'].aos-animate {
    transition-delay: 50ms; }
body[data-aos-duration='100'] [data-aos], [data-aos][data-aos][data-aos-duration='100'] {
  transition-duration: 100ms; }
body[data-aos-delay='100'] [data-aos], [data-aos][data-aos][data-aos-delay='100'] {
  transition-delay: 0s; }
  body[data-aos-delay='100'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='100'].aos-animate {
    transition-delay: 100ms; }
body[data-aos-duration='150'] [data-aos], [data-aos][data-aos][data-aos-duration='150'] {
  transition-duration: 150ms; }
body[data-aos-delay='150'] [data-aos], [data-aos][data-aos][data-aos-delay='150'] {
  transition-delay: 0s; }
  body[data-aos-delay='150'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='150'].aos-animate {
    transition-delay: 150ms; }
body[data-aos-duration='200'] [data-aos], [data-aos][data-aos][data-aos-duration='200'] {
  transition-duration: 200ms; }
body[data-aos-delay='200'] [data-aos], [data-aos][data-aos][data-aos-delay='200'] {
  transition-delay: 0s; }
  body[data-aos-delay='200'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='200'].aos-animate {
    transition-delay: 200ms; }
body[data-aos-duration='250'] [data-aos], [data-aos][data-aos][data-aos-duration='250'] {
  transition-duration: 250ms; }
body[data-aos-delay='250'] [data-aos], [data-aos][data-aos][data-aos-delay='250'] {
  transition-delay: 0s; }
  body[data-aos-delay='250'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='250'].aos-animate {
    transition-delay: 250ms; }
body[data-aos-duration='300'] [data-aos], [data-aos][data-aos][data-aos-duration='300'] {
  transition-duration: 300ms; }
body[data-aos-delay='300'] [data-aos], [data-aos][data-aos][data-aos-delay='300'] {
  transition-delay: 0s; }
  body[data-aos-delay='300'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='300'].aos-animate {
    transition-delay: 300ms; }
body[data-aos-duration='350'] [data-aos], [data-aos][data-aos][data-aos-duration='350'] {
  transition-duration: 350ms; }
body[data-aos-delay='350'] [data-aos], [data-aos][data-aos][data-aos-delay='350'] {
  transition-delay: 0s; }
  body[data-aos-delay='350'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='350'].aos-animate {
    transition-delay: 350ms; }
body[data-aos-duration='400'] [data-aos], [data-aos][data-aos][data-aos-duration='400'] {
  transition-duration: 400ms; }
body[data-aos-delay='400'] [data-aos], [data-aos][data-aos][data-aos-delay='400'] {
  transition-delay: 0s; }
  body[data-aos-delay='400'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='400'].aos-animate {
    transition-delay: 400ms; }
body[data-aos-duration='450'] [data-aos], [data-aos][data-aos][data-aos-duration='450'] {
  transition-duration: 450ms; }
body[data-aos-delay='450'] [data-aos], [data-aos][data-aos][data-aos-delay='450'] {
  transition-delay: 0s; }
  body[data-aos-delay='450'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='450'].aos-animate {
    transition-delay: 450ms; }
body[data-aos-duration='500'] [data-aos], [data-aos][data-aos][data-aos-duration='500'] {
  transition-duration: 500ms; }
body[data-aos-delay='500'] [data-aos], [data-aos][data-aos][data-aos-delay='500'] {
  transition-delay: 0s; }
  body[data-aos-delay='500'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='500'].aos-animate {
    transition-delay: 500ms; }
body[data-aos-duration='550'] [data-aos], [data-aos][data-aos][data-aos-duration='550'] {
  transition-duration: 550ms; }
body[data-aos-delay='550'] [data-aos], [data-aos][data-aos][data-aos-delay='550'] {
  transition-delay: 0s; }
  body[data-aos-delay='550'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='550'].aos-animate {
    transition-delay: 550ms; }
body[data-aos-duration='600'] [data-aos], [data-aos][data-aos][data-aos-duration='600'] {
  transition-duration: 600ms; }
body[data-aos-delay='600'] [data-aos], [data-aos][data-aos][data-aos-delay='600'] {
  transition-delay: 0s; }
  body[data-aos-delay='600'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='600'].aos-animate {
    transition-delay: 600ms; }
body[data-aos-duration='650'] [data-aos], [data-aos][data-aos][data-aos-duration='650'] {
  transition-duration: 650ms; }
body[data-aos-delay='650'] [data-aos], [data-aos][data-aos][data-aos-delay='650'] {
  transition-delay: 0s; }
  body[data-aos-delay='650'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='650'].aos-animate {
    transition-delay: 650ms; }
body[data-aos-duration='700'] [data-aos], [data-aos][data-aos][data-aos-duration='700'] {
  transition-duration: 700ms; }
body[data-aos-delay='700'] [data-aos], [data-aos][data-aos][data-aos-delay='700'] {
  transition-delay: 0s; }
  body[data-aos-delay='700'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='700'].aos-animate {
    transition-delay: 700ms; }
body[data-aos-duration='750'] [data-aos], [data-aos][data-aos][data-aos-duration='750'] {
  transition-duration: 750ms; }
body[data-aos-delay='750'] [data-aos], [data-aos][data-aos][data-aos-delay='750'] {
  transition-delay: 0s; }
  body[data-aos-delay='750'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='750'].aos-animate {
    transition-delay: 750ms; }
body[data-aos-duration='800'] [data-aos], [data-aos][data-aos][data-aos-duration='800'] {
  transition-duration: 800ms; }
body[data-aos-delay='800'] [data-aos], [data-aos][data-aos][data-aos-delay='800'] {
  transition-delay: 0s; }
  body[data-aos-delay='800'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='800'].aos-animate {
    transition-delay: 800ms; }
body[data-aos-duration='850'] [data-aos], [data-aos][data-aos][data-aos-duration='850'] {
  transition-duration: 850ms; }
body[data-aos-delay='850'] [data-aos], [data-aos][data-aos][data-aos-delay='850'] {
  transition-delay: 0s; }
  body[data-aos-delay='850'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='850'].aos-animate {
    transition-delay: 850ms; }
body[data-aos-duration='900'] [data-aos], [data-aos][data-aos][data-aos-duration='900'] {
  transition-duration: 900ms; }
body[data-aos-delay='900'] [data-aos], [data-aos][data-aos][data-aos-delay='900'] {
  transition-delay: 0s; }
  body[data-aos-delay='900'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='900'].aos-animate {
    transition-delay: 900ms; }
body[data-aos-duration='950'] [data-aos], [data-aos][data-aos][data-aos-duration='950'] {
  transition-duration: 950ms; }
body[data-aos-delay='950'] [data-aos], [data-aos][data-aos][data-aos-delay='950'] {
  transition-delay: 0s; }
  body[data-aos-delay='950'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='950'].aos-animate {
    transition-delay: 950ms; }
body[data-aos-duration='1000'] [data-aos], [data-aos][data-aos][data-aos-duration='1000'] {
  transition-duration: 1000ms; }
body[data-aos-delay='1000'] [data-aos], [data-aos][data-aos][data-aos-delay='1000'] {
  transition-delay: 0s; }
  body[data-aos-delay='1000'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1000'].aos-animate {
    transition-delay: 1000ms; }
body[data-aos-duration='1050'] [data-aos], [data-aos][data-aos][data-aos-duration='1050'] {
  transition-duration: 1050ms; }
body[data-aos-delay='1050'] [data-aos], [data-aos][data-aos][data-aos-delay='1050'] {
  transition-delay: 0s; }
  body[data-aos-delay='1050'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1050'].aos-animate {
    transition-delay: 1050ms; }
body[data-aos-duration='1100'] [data-aos], [data-aos][data-aos][data-aos-duration='1100'] {
  transition-duration: 1100ms; }
body[data-aos-delay='1100'] [data-aos], [data-aos][data-aos][data-aos-delay='1100'] {
  transition-delay: 0s; }
  body[data-aos-delay='1100'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1100'].aos-animate {
    transition-delay: 1100ms; }
body[data-aos-duration='1150'] [data-aos], [data-aos][data-aos][data-aos-duration='1150'] {
  transition-duration: 1150ms; }
body[data-aos-delay='1150'] [data-aos], [data-aos][data-aos][data-aos-delay='1150'] {
  transition-delay: 0s; }
  body[data-aos-delay='1150'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1150'].aos-animate {
    transition-delay: 1150ms; }
body[data-aos-duration='1200'] [data-aos], [data-aos][data-aos][data-aos-duration='1200'] {
  transition-duration: 1200ms; }
body[data-aos-delay='1200'] [data-aos], [data-aos][data-aos][data-aos-delay='1200'] {
  transition-delay: 0s; }
  body[data-aos-delay='1200'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1200'].aos-animate {
    transition-delay: 1200ms; }
body[data-aos-duration='1250'] [data-aos], [data-aos][data-aos][data-aos-duration='1250'] {
  transition-duration: 1250ms; }
body[data-aos-delay='1250'] [data-aos], [data-aos][data-aos][data-aos-delay='1250'] {
  transition-delay: 0s; }
  body[data-aos-delay='1250'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1250'].aos-animate {
    transition-delay: 1250ms; }
body[data-aos-duration='1300'] [data-aos], [data-aos][data-aos][data-aos-duration='1300'] {
  transition-duration: 1300ms; }
body[data-aos-delay='1300'] [data-aos], [data-aos][data-aos][data-aos-delay='1300'] {
  transition-delay: 0s; }
  body[data-aos-delay='1300'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1300'].aos-animate {
    transition-delay: 1300ms; }
body[data-aos-duration='1350'] [data-aos], [data-aos][data-aos][data-aos-duration='1350'] {
  transition-duration: 1350ms; }
body[data-aos-delay='1350'] [data-aos], [data-aos][data-aos][data-aos-delay='1350'] {
  transition-delay: 0s; }
  body[data-aos-delay='1350'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1350'].aos-animate {
    transition-delay: 1350ms; }
body[data-aos-duration='1400'] [data-aos], [data-aos][data-aos][data-aos-duration='1400'] {
  transition-duration: 1400ms; }
body[data-aos-delay='1400'] [data-aos], [data-aos][data-aos][data-aos-delay='1400'] {
  transition-delay: 0s; }
  body[data-aos-delay='1400'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1400'].aos-animate {
    transition-delay: 1400ms; }
body[data-aos-duration='1450'] [data-aos], [data-aos][data-aos][data-aos-duration='1450'] {
  transition-duration: 1450ms; }
body[data-aos-delay='1450'] [data-aos], [data-aos][data-aos][data-aos-delay='1450'] {
  transition-delay: 0s; }
  body[data-aos-delay='1450'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1450'].aos-animate {
    transition-delay: 1450ms; }
body[data-aos-duration='1500'] [data-aos], [data-aos][data-aos][data-aos-duration='1500'] {
  transition-duration: 1500ms; }
body[data-aos-delay='1500'] [data-aos], [data-aos][data-aos][data-aos-delay='1500'] {
  transition-delay: 0s; }
  body[data-aos-delay='1500'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1500'].aos-animate {
    transition-delay: 1500ms; }
body[data-aos-duration='1550'] [data-aos], [data-aos][data-aos][data-aos-duration='1550'] {
  transition-duration: 1550ms; }
body[data-aos-delay='1550'] [data-aos], [data-aos][data-aos][data-aos-delay='1550'] {
  transition-delay: 0s; }
  body[data-aos-delay='1550'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1550'].aos-animate {
    transition-delay: 1550ms; }
body[data-aos-duration='1600'] [data-aos], [data-aos][data-aos][data-aos-duration='1600'] {
  transition-duration: 1600ms; }
body[data-aos-delay='1600'] [data-aos], [data-aos][data-aos][data-aos-delay='1600'] {
  transition-delay: 0s; }
  body[data-aos-delay='1600'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1600'].aos-animate {
    transition-delay: 1600ms; }
body[data-aos-duration='1650'] [data-aos], [data-aos][data-aos][data-aos-duration='1650'] {
  transition-duration: 1650ms; }
body[data-aos-delay='1650'] [data-aos], [data-aos][data-aos][data-aos-delay='1650'] {
  transition-delay: 0s; }
  body[data-aos-delay='1650'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1650'].aos-animate {
    transition-delay: 1650ms; }
body[data-aos-duration='1700'] [data-aos], [data-aos][data-aos][data-aos-duration='1700'] {
  transition-duration: 1700ms; }
body[data-aos-delay='1700'] [data-aos], [data-aos][data-aos][data-aos-delay='1700'] {
  transition-delay: 0s; }
  body[data-aos-delay='1700'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1700'].aos-animate {
    transition-delay: 1700ms; }
body[data-aos-duration='1750'] [data-aos], [data-aos][data-aos][data-aos-duration='1750'] {
  transition-duration: 1750ms; }
body[data-aos-delay='1750'] [data-aos], [data-aos][data-aos][data-aos-delay='1750'] {
  transition-delay: 0s; }
  body[data-aos-delay='1750'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1750'].aos-animate {
    transition-delay: 1750ms; }
body[data-aos-duration='1800'] [data-aos], [data-aos][data-aos][data-aos-duration='1800'] {
  transition-duration: 1800ms; }
body[data-aos-delay='1800'] [data-aos], [data-aos][data-aos][data-aos-delay='1800'] {
  transition-delay: 0s; }
  body[data-aos-delay='1800'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1800'].aos-animate {
    transition-delay: 1800ms; }
body[data-aos-duration='1850'] [data-aos], [data-aos][data-aos][data-aos-duration='1850'] {
  transition-duration: 1850ms; }
body[data-aos-delay='1850'] [data-aos], [data-aos][data-aos][data-aos-delay='1850'] {
  transition-delay: 0s; }
  body[data-aos-delay='1850'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1850'].aos-animate {
    transition-delay: 1850ms; }
body[data-aos-duration='1900'] [data-aos], [data-aos][data-aos][data-aos-duration='1900'] {
  transition-duration: 1900ms; }
body[data-aos-delay='1900'] [data-aos], [data-aos][data-aos][data-aos-delay='1900'] {
  transition-delay: 0s; }
  body[data-aos-delay='1900'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1900'].aos-animate {
    transition-delay: 1900ms; }
body[data-aos-duration='1950'] [data-aos], [data-aos][data-aos][data-aos-duration='1950'] {
  transition-duration: 1950ms; }
body[data-aos-delay='1950'] [data-aos], [data-aos][data-aos][data-aos-delay='1950'] {
  transition-delay: 0s; }
  body[data-aos-delay='1950'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='1950'].aos-animate {
    transition-delay: 1950ms; }
body[data-aos-duration='2000'] [data-aos], [data-aos][data-aos][data-aos-duration='2000'] {
  transition-duration: 2000ms; }
body[data-aos-delay='2000'] [data-aos], [data-aos][data-aos][data-aos-delay='2000'] {
  transition-delay: 0s; }
  body[data-aos-delay='2000'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2000'].aos-animate {
    transition-delay: 2000ms; }
body[data-aos-duration='2050'] [data-aos], [data-aos][data-aos][data-aos-duration='2050'] {
  transition-duration: 2050ms; }
body[data-aos-delay='2050'] [data-aos], [data-aos][data-aos][data-aos-delay='2050'] {
  transition-delay: 0s; }
  body[data-aos-delay='2050'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2050'].aos-animate {
    transition-delay: 2050ms; }
body[data-aos-duration='2100'] [data-aos], [data-aos][data-aos][data-aos-duration='2100'] {
  transition-duration: 2100ms; }
body[data-aos-delay='2100'] [data-aos], [data-aos][data-aos][data-aos-delay='2100'] {
  transition-delay: 0s; }
  body[data-aos-delay='2100'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2100'].aos-animate {
    transition-delay: 2100ms; }
body[data-aos-duration='2150'] [data-aos], [data-aos][data-aos][data-aos-duration='2150'] {
  transition-duration: 2150ms; }
body[data-aos-delay='2150'] [data-aos], [data-aos][data-aos][data-aos-delay='2150'] {
  transition-delay: 0s; }
  body[data-aos-delay='2150'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2150'].aos-animate {
    transition-delay: 2150ms; }
body[data-aos-duration='2200'] [data-aos], [data-aos][data-aos][data-aos-duration='2200'] {
  transition-duration: 2200ms; }
body[data-aos-delay='2200'] [data-aos], [data-aos][data-aos][data-aos-delay='2200'] {
  transition-delay: 0s; }
  body[data-aos-delay='2200'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2200'].aos-animate {
    transition-delay: 2200ms; }
body[data-aos-duration='2250'] [data-aos], [data-aos][data-aos][data-aos-duration='2250'] {
  transition-duration: 2250ms; }
body[data-aos-delay='2250'] [data-aos], [data-aos][data-aos][data-aos-delay='2250'] {
  transition-delay: 0s; }
  body[data-aos-delay='2250'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2250'].aos-animate {
    transition-delay: 2250ms; }
body[data-aos-duration='2300'] [data-aos], [data-aos][data-aos][data-aos-duration='2300'] {
  transition-duration: 2300ms; }
body[data-aos-delay='2300'] [data-aos], [data-aos][data-aos][data-aos-delay='2300'] {
  transition-delay: 0s; }
  body[data-aos-delay='2300'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2300'].aos-animate {
    transition-delay: 2300ms; }
body[data-aos-duration='2350'] [data-aos], [data-aos][data-aos][data-aos-duration='2350'] {
  transition-duration: 2350ms; }
body[data-aos-delay='2350'] [data-aos], [data-aos][data-aos][data-aos-delay='2350'] {
  transition-delay: 0s; }
  body[data-aos-delay='2350'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2350'].aos-animate {
    transition-delay: 2350ms; }
body[data-aos-duration='2400'] [data-aos], [data-aos][data-aos][data-aos-duration='2400'] {
  transition-duration: 2400ms; }
body[data-aos-delay='2400'] [data-aos], [data-aos][data-aos][data-aos-delay='2400'] {
  transition-delay: 0s; }
  body[data-aos-delay='2400'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2400'].aos-animate {
    transition-delay: 2400ms; }
body[data-aos-duration='2450'] [data-aos], [data-aos][data-aos][data-aos-duration='2450'] {
  transition-duration: 2450ms; }
body[data-aos-delay='2450'] [data-aos], [data-aos][data-aos][data-aos-delay='2450'] {
  transition-delay: 0s; }
  body[data-aos-delay='2450'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2450'].aos-animate {
    transition-delay: 2450ms; }
body[data-aos-duration='2500'] [data-aos], [data-aos][data-aos][data-aos-duration='2500'] {
  transition-duration: 2500ms; }
body[data-aos-delay='2500'] [data-aos], [data-aos][data-aos][data-aos-delay='2500'] {
  transition-delay: 0s; }
  body[data-aos-delay='2500'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2500'].aos-animate {
    transition-delay: 2500ms; }
body[data-aos-duration='2550'] [data-aos], [data-aos][data-aos][data-aos-duration='2550'] {
  transition-duration: 2550ms; }
body[data-aos-delay='2550'] [data-aos], [data-aos][data-aos][data-aos-delay='2550'] {
  transition-delay: 0s; }
  body[data-aos-delay='2550'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2550'].aos-animate {
    transition-delay: 2550ms; }
body[data-aos-duration='2600'] [data-aos], [data-aos][data-aos][data-aos-duration='2600'] {
  transition-duration: 2600ms; }
body[data-aos-delay='2600'] [data-aos], [data-aos][data-aos][data-aos-delay='2600'] {
  transition-delay: 0s; }
  body[data-aos-delay='2600'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2600'].aos-animate {
    transition-delay: 2600ms; }
body[data-aos-duration='2650'] [data-aos], [data-aos][data-aos][data-aos-duration='2650'] {
  transition-duration: 2650ms; }
body[data-aos-delay='2650'] [data-aos], [data-aos][data-aos][data-aos-delay='2650'] {
  transition-delay: 0s; }
  body[data-aos-delay='2650'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2650'].aos-animate {
    transition-delay: 2650ms; }
body[data-aos-duration='2700'] [data-aos], [data-aos][data-aos][data-aos-duration='2700'] {
  transition-duration: 2700ms; }
body[data-aos-delay='2700'] [data-aos], [data-aos][data-aos][data-aos-delay='2700'] {
  transition-delay: 0s; }
  body[data-aos-delay='2700'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2700'].aos-animate {
    transition-delay: 2700ms; }
body[data-aos-duration='2750'] [data-aos], [data-aos][data-aos][data-aos-duration='2750'] {
  transition-duration: 2750ms; }
body[data-aos-delay='2750'] [data-aos], [data-aos][data-aos][data-aos-delay='2750'] {
  transition-delay: 0s; }
  body[data-aos-delay='2750'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2750'].aos-animate {
    transition-delay: 2750ms; }
body[data-aos-duration='2800'] [data-aos], [data-aos][data-aos][data-aos-duration='2800'] {
  transition-duration: 2800ms; }
body[data-aos-delay='2800'] [data-aos], [data-aos][data-aos][data-aos-delay='2800'] {
  transition-delay: 0s; }
  body[data-aos-delay='2800'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2800'].aos-animate {
    transition-delay: 2800ms; }
body[data-aos-duration='2850'] [data-aos], [data-aos][data-aos][data-aos-duration='2850'] {
  transition-duration: 2850ms; }
body[data-aos-delay='2850'] [data-aos], [data-aos][data-aos][data-aos-delay='2850'] {
  transition-delay: 0s; }
  body[data-aos-delay='2850'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2850'].aos-animate {
    transition-delay: 2850ms; }
body[data-aos-duration='2900'] [data-aos], [data-aos][data-aos][data-aos-duration='2900'] {
  transition-duration: 2900ms; }
body[data-aos-delay='2900'] [data-aos], [data-aos][data-aos][data-aos-delay='2900'] {
  transition-delay: 0s; }
  body[data-aos-delay='2900'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2900'].aos-animate {
    transition-delay: 2900ms; }
body[data-aos-duration='2950'] [data-aos], [data-aos][data-aos][data-aos-duration='2950'] {
  transition-duration: 2950ms; }
body[data-aos-delay='2950'] [data-aos], [data-aos][data-aos][data-aos-delay='2950'] {
  transition-delay: 0s; }
  body[data-aos-delay='2950'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='2950'].aos-animate {
    transition-delay: 2950ms; }
body[data-aos-duration='3000'] [data-aos], [data-aos][data-aos][data-aos-duration='3000'] {
  transition-duration: 3000ms; }
body[data-aos-delay='3000'] [data-aos], [data-aos][data-aos][data-aos-delay='3000'] {
  transition-delay: 0s; }
  body[data-aos-delay='3000'] [data-aos].aos-animate, [data-aos][data-aos][data-aos-delay='3000'].aos-animate {
    transition-delay: 3000ms; }

[data-aos] {
  pointer-events: none; }
  [data-aos].aos-animate {
    pointer-events: auto; }

body[data-aos-easing="linear"] [data-aos], [data-aos][data-aos][data-aos-easing="linear"] {
  transition-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75); }
body[data-aos-easing="ease"] [data-aos], [data-aos][data-aos][data-aos-easing="ease"] {
  transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1); }
body[data-aos-easing="ease-in"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in"] {
  transition-timing-function: cubic-bezier(0.42, 0, 1, 1); }
body[data-aos-easing="ease-out"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out"] {
  transition-timing-function: cubic-bezier(0, 0, 0.58, 1); }
body[data-aos-easing="ease-in-out"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out"] {
  transition-timing-function: cubic-bezier(0.42, 0, 0.58, 1); }
body[data-aos-easing="ease-in-back"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-back"] {
  transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045); }
body[data-aos-easing="ease-out-back"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out-back"] {
  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275); }
body[data-aos-easing="ease-in-out-back"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out-back"] {
  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55); }
body[data-aos-easing="ease-in-sine"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-sine"] {
  transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); }
body[data-aos-easing="ease-out-sine"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out-sine"] {
  transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); }
body[data-aos-easing="ease-in-out-sine"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out-sine"] {
  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95); }
body[data-aos-easing="ease-in-quad"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-quad"] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); }
body[data-aos-easing="ease-out-quad"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out-quad"] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); }
body[data-aos-easing="ease-in-out-quad"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out-quad"] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); }
body[data-aos-easing="ease-in-cubic"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-cubic"] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); }
body[data-aos-easing="ease-out-cubic"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out-cubic"] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); }
body[data-aos-easing="ease-in-out-cubic"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out-cubic"] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); }
body[data-aos-easing="ease-in-quart"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-quart"] {
  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); }
body[data-aos-easing="ease-out-quart"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-out-quart"] {
  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); }
body[data-aos-easing="ease-in-out-quart"] [data-aos], [data-aos][data-aos][data-aos-easing="ease-in-out-quart"] {
  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955); }

@media screen {
  html:not(.no-js) {
    /**
    * Fade animations:
    * fade
    * fade-up, fade-down, fade-left, fade-right
    * fade-up-right, fade-up-left, fade-down-right, fade-down-left
    */
    /**
    * Zoom animations:
    * zoom-in, zoom-in-up, zoom-in-down, zoom-in-left, zoom-in-right
    * zoom-out, zoom-out-up, zoom-out-down, zoom-out-left, zoom-out-right
    */
    /**
    * Slide animations
    */
    /**
    * Flip animations:
    * flip-left, flip-right, flip-up, flip-down
    */
    /*------------------------------------------------------*/
    /* AOSに独自実装したアニメーション                      */
    /*------------------------------------------------------*/
    /*緩やかにズームする画像*/
    /*見出し下のラインアニメ*/
    /*囲み枠線アニメ　2重のDIVで囲むこと*/ }
    html:not(.no-js) [data-aos^='fade'][data-aos^='fade'] {
      opacity: 0;
      transition-property: opacity, transform; }
      html:not(.no-js) [data-aos^='fade'][data-aos^='fade'].aos-animate {
        opacity: 1;
        transform: none; }
    html:not(.no-js) [data-aos='fade-up'] {
      transform: translate3d(0, 100px, 0); }
    html:not(.no-js) [data-aos='fade-down'] {
      transform: translate3d(0, -100px, 0); }
    html:not(.no-js) [data-aos='fade-right'] {
      transform: translate3d(-100px, 0, 0); }
    html:not(.no-js) [data-aos='fade-left'] {
      transform: translate3d(100px, 0, 0); }
    html:not(.no-js) [data-aos='fade-up-right'] {
      transform: translate3d(-100px, 100px, 0); }
    html:not(.no-js) [data-aos='fade-up-left'] {
      transform: translate3d(100px, 100px, 0); }
    html:not(.no-js) [data-aos='fade-down-right'] {
      transform: translate3d(-100px, -100px, 0); }
    html:not(.no-js) [data-aos='fade-down-left'] {
      transform: translate3d(100px, -100px, 0); }
    html:not(.no-js) [data-aos^='zoom'][data-aos^='zoom'] {
      opacity: 0;
      transition-property: opacity, transform; }
      html:not(.no-js) [data-aos^='zoom'][data-aos^='zoom'].aos-animate {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1); }
    html:not(.no-js) [data-aos='zoom-in'] {
      transform: scale(0.6); }
    html:not(.no-js) [data-aos='zoom-in-up'] {
      transform: translate3d(0, 100px, 0) scale(0.6); }
    html:not(.no-js) [data-aos='zoom-in-down'] {
      transform: translate3d(0, -100px, 0) scale(0.6); }
    html:not(.no-js) [data-aos='zoom-in-right'] {
      transform: translate3d(-100px, 0, 0) scale(0.6); }
    html:not(.no-js) [data-aos='zoom-in-left'] {
      transform: translate3d(100px, 0, 0) scale(0.6); }
    html:not(.no-js) [data-aos='zoom-out'] {
      transform: scale(1.2); }
    html:not(.no-js) [data-aos='zoom-out-up'] {
      transform: translate3d(0, 100px, 0) scale(1.2); }
    html:not(.no-js) [data-aos='zoom-out-down'] {
      transform: translate3d(0, -100px, 0) scale(1.2); }
    html:not(.no-js) [data-aos='zoom-out-right'] {
      transform: translate3d(-100px, 0, 0) scale(1.2); }
    html:not(.no-js) [data-aos='zoom-out-left'] {
      transform: translate3d(100px, 0, 0) scale(1.2); }
    html:not(.no-js) [data-aos^='slide'][data-aos^='slide'] {
      transition-property: transform;
      visibility: hidden; }
      html:not(.no-js) [data-aos^='slide'][data-aos^='slide'].aos-animate {
        visibility: visible;
        transform: translate3d(0, 0, 0); }
    html:not(.no-js) [data-aos='slide-up'] {
      transform: translate3d(0, 100%, 0); }
    html:not(.no-js) [data-aos='slide-down'] {
      transform: translate3d(0, -100%, 0); }
    html:not(.no-js) [data-aos='slide-right'] {
      transform: translate3d(-100%, 0, 0); }
    html:not(.no-js) [data-aos='slide-left'] {
      transform: translate3d(100%, 0, 0); }
    html:not(.no-js) [data-aos^='flip'][data-aos^='flip'] {
      backface-visibility: hidden;
      transition-property: transform; }
    html:not(.no-js) [data-aos='flip-left'] {
      transform: perspective(2500px) rotateY(-100deg); }
      html:not(.no-js) [data-aos='flip-left'].aos-animate {
        transform: perspective(2500px) rotateY(0); }
    html:not(.no-js) [data-aos='flip-right'] {
      transform: perspective(2500px) rotateY(100deg); }
      html:not(.no-js) [data-aos='flip-right'].aos-animate {
        transform: perspective(2500px) rotateY(0); }
    html:not(.no-js) [data-aos='flip-up'] {
      transform: perspective(2500px) rotateX(-100deg); }
      html:not(.no-js) [data-aos='flip-up'].aos-animate {
        transform: perspective(2500px) rotateX(0); }
    html:not(.no-js) [data-aos='flip-down'] {
      transform: perspective(2500px) rotateX(100deg); }
      html:not(.no-js) [data-aos='flip-down'].aos-animate {
        transform: perspective(2500px) rotateX(0); }
    html:not(.no-js) [data-aos="mask_cover"] {
      position: relative; }
    html:not(.no-js) [data-aos="mask_cover"]::before {
      background: #FFF;
      z-index: 2;
      top: 0;
      width: 100%;
      -webkit-transition: all .6s ease;
      transition: all .6s ease;
      content: "";
      position: absolute;
      left: 0;
      height: 100%; }
    html:not(.no-js) [data-aos="mask_cover"].aos-animate::before {
      left: 100%;
      width: 0; }
    html:not(.no-js) [data-aos="zoom_img"] {
      overflow: hidden;
      position: relative; }
    html:not(.no-js) [data-aos="zoom_img"].aos-animate img {
      transform: scale(1.2);
      /*画像の拡大率*/
      transition-duration: 10s;
      /*変化に掛かる時間*/ }
    html:not(.no-js) [data-aos="bottom-line"] {
      overflow: hidden;
      position: relative; }
    html:not(.no-js) [data-aos="bottom-line"]:after {
      content: "";
      width: 200%;
      height: 1px;
      background-color: #323232;
      position: absolute;
      bottom: 0;
      left: 0;
      -webkit-transition: all 0.5s ease-in-out;
      -moz-transition: all 0.5s ease-in-out;
      -ms-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out; }
    html:not(.no-js) [data-aos="bottom-line"].aos-animate:after {
      width: 200%;
      -webkit-transition-delay: 0.5s;
      -o-transition-delay: 0.5s;
      transition-delay: 0.5s; }
    html:not(.no-js) [data-aos="kakomi"] {
      position: relative;
      padding: 10px;
      display: block; }
    html:not(.no-js) [data-aos="kakomi"]::before,
    html:not(.no-js) [data-aos="kakomi"]::after {
      position: absolute;
      content: "";
      left: 0;
      top: 0;
      background: #c0dfdf;
      -webkit-transition: 0.5s;
      -moz-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    html:not(.no-js) [data-aos="kakomi"] > div::before,
    html:not(.no-js) [data-aos="kakomi"] > div::after {
      position: absolute;
      content: "";
      right: 0;
      bottom: 0;
      background: #c0dfdf;
      -webkit-transition: 0.5s;
      -moz-transition: 0.5s;
      -o-transition: 0.5s;
      transition: 0.5s; }
    html:not(.no-js) [data-aos="kakomi"]::before,
    html:not(.no-js) [data-aos="kakomi"] > div::before {
      height: 0%;
      width: 4px; }
    html:not(.no-js) [data-aos="kakomi"]::after,
    html:not(.no-js) [data-aos="kakomi"] > div::after {
      height: 4px;
      width: 0%; }
    html:not(.no-js) [data-aos="kakomi"].aos-animate::before,
    html:not(.no-js) [data-aos="kakomi"].aos-animate > div::before {
      height: 100%; }
    html:not(.no-js) [data-aos="kakomi"].aos-animate::after,
    html:not(.no-js) [data-aos="kakomi"].aos-animate > div::after {
      width: 100%; } }
/* Color */
/* Scss Document */
/* Menu */
/*---------------------------------------------*/
/* PC・スマホ共通用                            */
/*---------------------------------------------*/
#header-wrap {
  /*position: fixed;*/
  top: 0;
  left: auto;
  right: auto;
  width: 100%;
  z-index: 3;
  background-color: transparent; }

.menu a[target="_blank"]:before {
  content: "\f24d";
  font-family: 'fontawesome-s';
  margin-right: 10px;
  display: inline-block; }

/*---------------------------------------------*/
/* PC用                                        */
/*---------------------------------------------*/
@media (min-width: 992px) {
  /*上に隠れるナビ版で使うクラス*/
  #header-wrap {
    transition: .5s; }

  #header-wrap.hide {
    transform: translateY(-100%); }

  /*ここまで*/
  .menu > ul {
    display: table;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0; }
    .menu > ul > li {
      position: relative;
      display: table-cell;
      text-align: center;
      list-style: none;
      width: 20%; }
      .menu > ul > li:hover {
        background-color: red; }
      .menu > ul > li:hover > span > a {
        background-color: transparent; }

  .menu > ul > li > ul li:hover {
    background-color: red; }

  .menu > ul > li > ul {
    display: none;
    z-index: 2; }

  .menu > ul > li > ul,
  .menu > ul > li > ul li ul {
    background-color: transparent; }

  .menu a {
    display: block;
    text-decoration: none; }

  /*親要素のボタン制御*/
  .menu ul > li > span > a {
    display: block;
    padding-bottom: 15px;
    padding-top: 15px;
    padding-left: 5px;
    padding-right: 5px; }

  /*子要素設定*/
  .menu > ul > li:hover > ul {
    width: 100%;
    opacity: 1;
    transition: 0s ease 0s;
    display: block;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.7);
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.7); }

  .menu > ul > li > ul,
  .menu > ul > li > ul li ul {
    width: 100%;
    opacity: 0;
    position: absolute;
    margin: 0;
    padding: 0;
    transition: 0s ease 0s;
    box-sizing: border-box;
    list-style: none; }

  .menu > ul > li > ul > li {
    position: relative; }

  .menu > ul > li > ul > li:hover ul {
    width: 100%;
    opacity: 1;
    transition: 0s ease 0s;
    left: 100%;
    top: 0;
    position: absolute;
    -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.7);
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.7); }

  /*子要素のボタン制御*/
  .menu ul > li > span > ul > li > a {
    overflow: hidden; } }
/*-------------------------------------*/
/* スマホ用メニュー                         */
/*-------------------------------------*/
.menu-mobile {
  display: none; }

@media only screen and (max-width: 991px) {
  /*フェード表現*/
  /*html .menu > ul {
  	opacity: 0;
  	visibility: hidden;
  	transition: opacity 1s, visibility 0s ease 1s;
  }
  html.nav-active .menu > ul {
  	transition-delay: 0s;
  	opacity: 1;
  	visibility: visible;
  }*/
  /*フェードここまで*/
  /*スマホメニュー表示ボタンが押された時*/
  html.nav-active .menu {
    position: fixed;
    z-index: 98;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    overflow-x: hidden;
    overflow-y: scroll;
    background: #FFF; }

  html.nav-active body {
    overflow: hidden; }

  html.nav-active #wrapper {
    position: fixed; }

  /*スマホメニュー以外を隠すマスク*/
  html.nav-active .nav-mask {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 97;
    background-color: rgba(255, 255, 255, 0.8);
    /*ボカシ効果をつけるときはbackground-colorを透明にしてここをコメントアウト
    filter: blur(4px);
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    */ }

  /*スマホメニュー表示ボタン*/
  .menu-mobile {
    display: block;
    position: fixed;
    top: 0;
    right: 0;
    width: 70px;
    height: 70px;
    z-index: 99;
    cursor: pointer;
    background-color: red; }

  #common-nav-switch-in {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 17px;
    margin: -8px 0 0 -15px; }

  #common-nav-switch-in .bar {
    position: absolute;
    left: 0;
    width: 30px;
    height: 1px;
    transition: all 0.4s ease 0s;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    background: #FFF; }

  .nav-active #common-nav-switch {
    background: #000; }

  .nav-active #common-nav-switch .bar {
    -webkit-transform-origin: 0% 0%;
    -moz-transform-origin: 0% 0%;
    -o-transform-origin: 0% 0%;
    -ms-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    background: #FFF !important; }

  #common-nav-switch-in .bar.bar01 {
    top: 0; }

  #common-nav-switch-in .bar.bar02 {
    top: 8px; }

  #common-nav-switch-in .bar.bar03 {
    top: 16px; }

  /* スマホメニューcloes ボタン化　*/
  .nav-active #common-nav-switch-in .bar.bar01 {
    -webkit-transform: rotate(45deg) translate(0px, -7px);
    -moz-transform: rotate(45deg) translate(0px, -7px);
    -o-transform: rotate(45deg) translate(0px, -7px);
    -ms-transform: rotate(45deg) translate(0px, -7px);
    transform: rotate(45deg) translate(0px, -7px); }

  .nav-active #common-nav-switch-in .bar.bar02 {
    display: none; }

  .nav-active #common-nav-switch-in .bar.bar03 {
    -webkit-transform: rotate(-45deg) translate(3px, 3px);
    -moz-transform: rotate(-45deg) translate(3px, 3px);
    -o-transform: rotate(-45deg) translate(3px, 3px);
    -ms-transform: rotate(-45deg) translate(3px, 3px);
    transform: rotate(-45deg) translate(3px, 3px); }

  /*スマホメニューの見た目設定*/
  .menu-container {
    width: 100%;
    position: fixed;
    top: 0;
    right: 0;
    z-index: 99; }

  .menu > ul {
    margin-top: 0;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 20px;
    width: 100%;
    list-style: none;
    padding: 0;
    padding-top: 70px;
    position: relative;
    box-sizing: border-box;
    /*height: 100%;*/
    /*overflow-x: hidden;
    overflow-y: scroll;*/ }

  .menu > ul > li {
    float: left;
    padding: 0;
    margin: 0;
    background: #FFF;
    border-top: 1px solid #DDD; }

  .menu > ul > li:last-child {
    border-bottom: 1px solid #DDD; }

  .menu > ul > li a {
    text-decoration: none;
    padding: 1.5em 3em;
    display: block;
    color: #000; }

  .menu > ul > li:hover {
    background: #666; }

  .menu > ul > li > ul,
  .menu > ul > li > ul > li ul {
    display: none;
    width: 100%;
    position: absolute;
    z-index: 99;
    left: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
    background: #f1ede4; }

  .menu > ul > li > ul li {
    border-top: 1px solid #DDD; }

  .menu-container {
    width: 100%; }

  .menu-dropdown-icon:before {
    display: block; }

  .menu > ul {
    display: none;
    /*フェードさせたい時はここを無効化*/ }

  .menu > ul li {
    width: 100%;
    float: none;
    display: block; }

  .menu > ul li > span {
    position: relative;
    display: table;
    width: 100%; }

  .sp-gnav-layer-btn {
    display: table-cell;
    width: 40px;
    cursor: pointer;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    transition: background-color .2s linear;
    border-left: solid 1px #DDD;
    border-bottom: solid 1px #DDD;
    background-color: red; }

  .sp-gnav-layer-btn:before {
    content: "";
    position: absolute;
    display: block;
    width: 16px;
    height: 2px;
    top: 50%;
    right: 12px;
    margin: -1px 0 0;
    background-color: #FFF; }

  .sp-gnav-layer-btn:after {
    content: "";
    position: absolute;
    display: block;
    width: 2px;
    height: 16px;
    top: 50%;
    right: 19px;
    margin: -8px 0 0;
    -moz-transition: -moz-transform .2s linear;
    -webkit-transition: -webkit-transform .2s linear;
    -o-transition: -o-transform .2s linear;
    -ms-transition: -ms-transform .2s linear;
    transition: transform .2s linear;
    background-color: #FFF; }

  .sp-gnav-layer-btn.current:after {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg); }

  .menu > ul li a {
    padding: 1.5em;
    width: 100%;
    display: block; }

  .menu > ul li ul {
    position: relative; }

  .menu > ul li ul.normal-sub {
    width: 100%; }

  .menu > ul li ul li {
    float: none;
    width: 100%; }

  .menu > ul li ul li:first-child {
    margin: 0; }

  .menu > ul li ul li ul {
    position: relative; }

  .menu > ul li ul li ul li {
    float: none; }

  .menu .show-on-mobile {
    display: block; } }
/*---------------------------------------------*/
/* mixin                                       */
/*---------------------------------------------*/
/* 天地左右中央合わせ */
/* 天地中央合わせ */
/*---------------------------------------------*/
/* 基本		                                 */
/*---------------------------------------------*/
html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
  color: #000 !important;
  font-feature-settings: "palt" 1; }

body {
  width: 100%;
  height: 100%;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 175%;
  color: #000;
  font-family: a-otf-gothic-bbb-pr6n, sans-serif;
  font-weight: 400;
  font-style: normal; }

/*-----------------------------------*/
/* iphone対策                        */
/*-----------------------------------*/
body {
  height: 100vh; }

/* Safari用のハックは、Chromeに適用されないようにする */
@supports (-webkit-touch-callout: none) {
  body {
    /* Safari用のハック */
    height: -webkit-fill-available; } }
/*------------------------------------*/
a {
  text-decoration: none;
  color: #000000;
  transition: all 0.5s; }

a:hover {
  text-decoration: none;
  color: red;
  transition: all 0.5s; }

.photo-mask {
  overflow: hidden;
  position: relative;
  padding: 0px !important; }
  .photo-mask::before {
    content: "";
    padding-top: 75%;
    width: 100%;
    display: block; }
  .photo-mask img {
    display: inline-block;
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 1s;
    transform: scale(1.1); }
  .photo-mask .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    transition: all 1s; }
  .photo-mask .photo-text {
    opacity: 1;
    transition: all 1s; }
    .photo-mask .photo-text ul {
      font-size: 22px;
      list-style-type: none;
      padding-left: 0px;
      display: table;
      border-collapse: separate;
      border-spacing: 15px 0px;
      margin-bottom: 0px; }
      .photo-mask .photo-text ul li {
        display: table-cell; }
  @media (min-width: 992px) {
    .photo-mask .photo-text {
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); } }
  @media (max-width: 991px) {
    .photo-mask .overlay {
      display: none; }
    .photo-mask .photo-text {
      position: absolute;
      right: 0;
      bottom: 15px; }
      .photo-mask .photo-text ul {
        width: 100%;
        background-color: rgba(0, 0, 0, 0.35);
        padding: 5px 15px; } }

.photo-mask50 {
  overflow: hidden;
  position: relative;
  padding: 0px !important; }
  .photo-mask50::before {
    content: "";
    padding-top: 50%;
    width: 100%;
    display: block; }
  .photo-mask50 img {
    display: inline-block;
    width: 100%;
    height: auto;
    transition: all 1s;
    transform: scale(1.1);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }

.photo-mask40 {
  overflow: hidden;
  position: relative;
  padding: 0px !important; }
  .photo-mask40::before {
    content: "";
    padding-top: 40%;
    width: 100%;
    display: block; }
  .photo-mask40 img {
    display: inline-block;
    width: 100%;
    height: auto;
    transition: all 1s;
    transform: scale(1.1);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }

@media (min-width: 992px) {
  .pc-hide {
    display: none; } }
@media (min-width: 1200px) {
  .container {
    max-width: 1200px; } }
@media (min-width: 992px) {
  .mt-50 {
    margin-top: -50px !important; }

  .pt-70 {
    padding-top: 70px !important; } }
/*---------------------------------------------*/
/* webfont load                                */
/*---------------------------------------------*/
@font-face {
  font-family: 'fontawesome';
  src: url("../fonts/fa-brands-400.eot");
  src: url("../fonts/fa-brands-400.eot") format("embedded-opentype"), url("../fonts/fa-brands-400.woff2") format("woff2"), url("../fonts/fa-brands-400.woff") format("woff"), url("../fonts/fa-brands-400.ttf") format("truetype"), url("../fonts/fa-brands-400.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'fontawesome-s';
  src: url("../fonts/fa-solid-900.eot");
  src: url("../fonts/fa-solid-900.eot") format("embedded-opentype"), url("../fonts/fa-solid-900.woff2") format("woff2"), url("../fonts/fa-solid-900.woff") format("woff"), url("../fonts/fa-solid-900.ttf") format("truetype"), url("../fonts/fa-solid-900.svg") format("svg");
  font-weight: normal;
  font-style: normal; }
/*---------------------------------------------*/
/* 見出し                                      */
/*---------------------------------------------*/
h1 {
  font-size: 46px;
  font-size: 4.6rem;
  line-height: 1.2; }

h2 {
  font-size: 60px;
  font-size: 6.0rem;
  line-height: 1.25;
  margin-bottom: 0px;
  font-family: a-otf-midashi-go-mb31-pr6n,sans-serif;
  font-weight: 600;
  font-style: normal; }

h3 {
  font-size: 28px;
  font-size: 2.8rem;
  line-height: 1.3;
  margin-bottom: 0px;
  font-family: a-otf-midashi-go-mb31-pr6n,sans-serif;
  font-weight: 600;
  font-style: normal; }

h4 {
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 1.35; }

h5 {
  font-size: 20px;
  font-size: 2.0rem;
  line-height: 1.4; }

h6 {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.45; }

.catch-font {
  font-family: vdl-logojrblack, sans-serif;
  font-weight: 900;
  font-style: normal; }

/*-------------------------------------------*/
/* laoding                                   */
/*-------------------------------------------*/
#loader-bg {
  display: block;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  color: #000;
  z-index: 9999;
  overflow: hidden;
  background-color: #fff; }

#loader {
  display: block;
  width: 100px;
  height: 100px;
  text-align: center;
  z-index: 10000;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  #loader:after {
    content: "Now Loading";
    font-size: 14px; }

.sk-circle {
  margin: 10px auto;
  width: 70px;
  height: 70px;
  position: relative; }
  .sk-circle .sk-child {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0; }
  .sk-circle .sk-child:before {
    content: '';
    display: block;
    margin: 0 auto;
    width: 15%;
    height: 15%;
    background-color: red;
    border-radius: 100%;
    animation: sk-circleBounceDelay 1.2s infinite ease-in-out both; }
  .sk-circle .sk-circle2 {
    transform: rotate(30deg); }
  .sk-circle .sk-circle3 {
    transform: rotate(60deg); }
  .sk-circle .sk-circle4 {
    transform: rotate(90deg); }
  .sk-circle .sk-circle5 {
    transform: rotate(120deg); }
  .sk-circle .sk-circle6 {
    transform: rotate(150deg); }
  .sk-circle .sk-circle7 {
    transform: rotate(180deg); }
  .sk-circle .sk-circle8 {
    transform: rotate(210deg); }
  .sk-circle .sk-circle9 {
    transform: rotate(240deg); }
  .sk-circle .sk-circle10 {
    transform: rotate(270deg); }
  .sk-circle .sk-circle11 {
    transform: rotate(300deg); }
  .sk-circle .sk-circle12 {
    transform: rotate(330deg); }
  .sk-circle .sk-circle2:before {
    animation-delay: -1.1s; }
  .sk-circle .sk-circle3:before {
    animation-delay: -1s; }
  .sk-circle .sk-circle4:before {
    animation-delay: -0.9s; }
  .sk-circle .sk-circle5:before {
    animation-delay: -0.8s; }
  .sk-circle .sk-circle6:before {
    animation-delay: -0.7s; }
  .sk-circle .sk-circle7:before {
    animation-delay: -0.6s; }
  .sk-circle .sk-circle8:before {
    animation-delay: -0.5s; }
  .sk-circle .sk-circle9:before {
    animation-delay: -0.4s; }
  .sk-circle .sk-circle10:before {
    animation-delay: -0.3s; }
  .sk-circle .sk-circle11:before {
    animation-delay: -0.2s; }
  .sk-circle .sk-circle12:before {
    animation-delay: -0.1s; }

@keyframes sk-circleBounceDelay {
  0%, 80%, 100% {
    transform: scale(0); }
  40% {
    transform: scale(1); } }
/*---------------------------------------------*/
/* header                                      */
/*---------------------------------------------*/
#header-wrap {
  width: 100%;
  /*position: relative;*/ }
  #header-wrap .bg-video {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -1; }
  #header-wrap .top-img {
    z-index: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }

@media (min-width: 992px) {
  .logo {
    width: 296px;
    height: 200px;
    background-color: #fff;
    position: fixed;
    top: -30px;
    left: -175px;
    transform: skewX(-50deg);
    z-index: 100; }
    .logo a {
      position: relative;
      width: 100%;
      height: 100%;
      display: block; }
      .logo a::before {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 999;
        pointer-events: auto;
        content: "";
        background-color: rgba(0, 0, 0, 0);
        cursor: pointer; }
    .logo img {
      position: absolute;
      top: 45px;
      left: 150px;
      width: 40%;
      display: block;
      transform: skewX(50deg); } }
@media (max-width: 991px) {
  .logo {
    z-index: 98;
    background-color: #fff;
    position: fixed;
    width: 100%;
    padding: 5px;
    top: 0px;
    left: 0px; }
    .logo img {
      width: auto;
      height: 60px; } }
/*---------------------------------------------*/
/* PC用                                        */
/*---------------------------------------------*/
#page-title-div {
  padding: 90px 10px 30px 10px;
  background: -moz-linear-gradient(-45deg, #cccccc 60%, #dadada 80%, rgba(221, 221, 221, 0.75) 85%, rgba(255, 255, 255, 0) 100%);
  background: -webkit-linear-gradient(-45deg, #cccccc 60%, #dadada 80%, rgba(221, 221, 221, 0.75) 85%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(135deg, #cccccc 60%, #dadada 80%, rgba(221, 221, 221, 0.75) 85%, rgba(255, 255, 255, 0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#00ffffff',GradientType=1 );
  margin-bottom: 40px; }
  @media (min-width: 992px) {
    #page-title-div h2 {
      margin-left: 175px;
      width: calc(100% - 175px);
      font-size: 40px;
      font-size: 4.0rem;
      font-size: calc(4.0rem + ((1vw - 12px) * 4.7847)); } }
  @media (min-width: 1200px) {
    #page-title-div h2 {
      font-size: 40px;
      font-size: 4.0rem; } }
  @media (max-width: 991px) {
    #page-title-div h2 {
      font-size: 30px;
      font-size: 3.0rem; } }

@media (min-width: 992px) {
  #header-wrap {
    overflow: hidden; }

  #main-nav {
    position: fixed;
    top: 0px;
    left: auto;
    width: 100%;
    z-index: 99; }
    #main-nav .menu > ul {
      display: table;
      padding: 0px;
      margin-left: 175px;
      margin-bottom: 0px;
      width: calc(100% - 175px);
      border-collapse: separate;
      /* セルの間隔を空ける */
      border-spacing: 2px 0;
      /* 左右 上下で記述 */ }
      #main-nav .menu > ul > li {
        display: table-cell;
        width: 20%;
        transform: skewX(-50deg);
        background-color: rgba(255, 255, 255, 0.8); }
        #main-nav .menu > ul > li a {
          display: block;
          text-align: center;
          padding: 10px 0px 10px 0px;
          transform: skewX(50deg);
          color: #666 !important;
          font-size: 16px;
          font-size: 1.6rem; }
        #main-nav .menu > ul > li:hover {
          background-color: red; }
          #main-nav .menu > ul > li:hover a:hover {
            color: #FFF !important; }
      #main-nav .menu > ul > li li {
        background-color: rgba(255, 0, 0, 0.7);
        margin-bottom: 1px; }
        #main-nav .menu > ul > li li a {
          color: #FFF !important; }
        #main-nav .menu > ul > li li:hover {
          background-color: red; }
          #main-nav .menu > ul > li li:hover a:hover {
            color: #FFF !important; }
        #main-nav .menu > ul > li li li {
          background-color: rgba(204, 0, 0, 0.7); }
        #main-nav .menu > ul > li li .sp-gnav-layer-btn:before {
          content: "\f054";
          font-family: 'fontawesome-s';
          transform: skewX(40deg);
          position: absolute;
          top: 10px;
          right: 10px; }
      #main-nav .menu > ul .sp-gnav-layer-btn:before {
        content: "\f078";
        font-family: 'fontawesome-s';
        transform: skewX(40deg);
        position: absolute;
        top: 10px;
        right: 10px; } }
/*---------------------------------------------*/
/* main-wrap                                   */
/*---------------------------------------------*/
#main-wrap .content-title {
  margin-bottom: 40px; }
  #main-wrap .content-title small {
    display: block; }
#main-wrap .president {
  background: linear-gradient(180deg, #01d1c3, #3d45f3); }
  #main-wrap .president .container-fluid .president-img {
    background-image: url("../img/president.jpg");
    background-size: cover;
    background-position: left center;
    background-repeat: no-repeat; }
    @media (min-width: 992px) {
      #main-wrap .president .container-fluid .president-img:before {
        content: "";
        width: 100%;
        padding-top: 60%;
        display: block; } }
  #main-wrap .president .container-fluid .div-skew .interview {
    position: relative;
    padding: 50px 0px;
    color: #fff;
    z-index: 1; }
    #main-wrap .president .container-fluid .div-skew .interview h3:nth-child(1) {
      border-bottom: 1px solid #fff;
      margin-bottom: 10px !important;
      padding-bottom: 5px; }
    #main-wrap .president .container-fluid .div-skew .interview h3:nth-child(2) {
      text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.3); }
    #main-wrap .president .container-fluid .div-skew .interview h4 {
      font-size: 36px;
      font-size: 3.6rem;
      font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
      font-weight: 600;
      font-style: normal; }
    #main-wrap .president .container-fluid .div-skew .interview .name {
      font-size: 26px;
      letter-spacing: 15px;
      text-align: right; }
      #main-wrap .president .container-fluid .div-skew .interview .name span {
        font-size: 18px;
        letter-spacing: 0px;
        padding-right: 15px; }
@media (min-width: 992px) {
  #main-wrap .div-skew {
    background: linear-gradient(180deg, #01d1c3, #3d45f3); }
    #main-wrap .div-skew::before {
      content: "";
      width: 50%;
      height: 100%;
      background: linear-gradient(180deg, #01d1c3, #3d45f3);
      transform: skewX(5deg);
      position: absolute;
      top: 0;
      left: -60px; } }
#main-wrap .kotono {
  overflow: hidden;
  position: relative; }
  #main-wrap .kotono .right-img {
    position: absolute;
    width: 70%;
    top: 5%;
    right: -25%;
    z-index: 999; }
  #main-wrap .kotono .left-img {
    position: absolute;
    width: 20%;
    top: 49%;
    left: 0;
    z-index: 999; }
#main-wrap .company {
  z-index: 100;
  background-color: rgba(57, 76, 240, 0.4);
  background-position: left -80% bottom 0%;
  background-repeat: no-repeat;
  background-size: 65%;
  padding-top: 100px;
  padding-bottom: 350px;
  color: #fff; }
  #main-wrap .company #kotono {
    background-image: url(../img/hokusei_cotono.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center left;
    position: absolute;
    z-index: 5;
    top: 7%;
    right: -16%;
    width: 100%;
    max-width: 50%;
    padding-top: 100%; }
  #main-wrap .company #hokuseioh {
    background-image: url(../img/hokuseioh.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center right;
    position: absolute;
    z-index: 0;
    top: 0%;
    left: 0%;
    width: 100%;
    max-width: 45%;
    padding-top: 100%; }
  #main-wrap .company .top-message {
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.8);
    position: relative;
    z-index: 9; }
    #main-wrap .company .top-message h4 {
      font-size: 26px; }
    #main-wrap .company .top-message h1 {
      font-size: 60px;
      margin-bottom: 0px; }
  #main-wrap .company #hitorihitori {
    text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.8);
    position: relative;
    z-index: 9; }
    #main-wrap .company #hitorihitori::before, #main-wrap .company #hitorihitori::after {
      content: "";
      display: inline-block;
      background-image: url("../img/star.png");
      background-size: contain;
      background-repeat: no-repeat;
      vertical-align: middle;
      width: 20%;
      padding-top: 100%;
      position: absolute;
      top: 0; }
    #main-wrap .company #hitorihitori::before {
      left: 0; }
    #main-wrap .company #hitorihitori::after {
      right: 0;
      transform: scale(-1, 1); }
  #main-wrap .company .slide-div {
    /*width: 60%;
    margin: 50px auto 0;*/ }
    #main-wrap .company .slide-div .swiper-container {
      z-index: 9; }
    #main-wrap .company .slide-div .slide-text {
      padding: 15px;
      background-color: rgba(0, 0, 0, 0.5); }
      #main-wrap .company .slide-div .slide-text h5 {
        text-align: center;
        font-size: 28px;
        margin-bottom: 15px; }
      #main-wrap .company .slide-div .slide-text p {
        line-height: 30px; }
#main-wrap .tape {
  background-color: rgba(0, 0, 0, 0.4);
  padding: 5px;
  line-height: 220%; }
@media (max-width: 991px) {
  #main-wrap .president-img {
    width: 100%;
    padding-top: 69%;
    background-size: 100% !important;
    background-position: right center !important; } }
@media (max-width: 767px) {
  #main-wrap .kotono .company {
    padding-top: 0px;
    padding-bottom: 0px; }
  #main-wrap .kotono .container {
    position: static; }
  #main-wrap .kotono .top-message {
    position: static; }
    #main-wrap .kotono .top-message #hitorihitori {
      position: static; }
  #main-wrap .company #kotono {
    position: static !important;
    display: flex;
    background-size: contain;
    margin: auto; }
  #main-wrap .company #hokuseioh {
    position: static !important;
    display: flex;
    background-position: center center;
    background-size: contain;
    max-width: 100%; } }
@media (min-width: 992px) {
  #main-wrap .color01 .container {
    position: relative; }
    #main-wrap .color01 .container #kotono2 {
      bottom: -15%;
      left: -10%;
      width: 100%;
      height: 100%;
      max-width: 300px;
      max-height: 300px;
      z-index: 2;
      position: absolute;
      transform: skewY(5deg); }
      #main-wrap .color01 .container #kotono2 #kotoimg {
        z-index: 4;
        width: 80%;
        height: auto;
        display: block;
        content: "";
        position: absolute;
        padding-top: 100%;
        background-image: url("../img/hokusei_cotono02.png");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain;
        left: 10%; }
      #main-wrap .color01 .container #kotono2 #kotobg {
        z-index: 3;
        display: block;
        width: 100%;
        height: auto;
        animation: rotate-anime 10s linear infinite;
        content: "";
        position: absolute;
        padding-top: 100%;
        background-image: url("../img/bg-gold.svg");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: contain; } }
@keyframes rotate-anime {
  0% {
    transform: rotate(0); }
  100% {
    transform: rotate(360deg); } }
#main-wrap .voice {
  transform: skewY(-5deg);
  margin-top: -150px;
  color: #3B48F1;
  position: relative; }
  #main-wrap .voice .negative-skew {
    transform: skewY(5deg); }
    #main-wrap .voice .negative-skew .interview-title {
      position: absolute;
      top: -60px;
      width: 100%; }
      #main-wrap .voice .negative-skew .interview-title h2 {
        font-size: 50px !important;
        transform: rotateZ(-5deg);
        color: #fff;
        text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.8);
        position: relative; }
        #main-wrap .voice .negative-skew .interview-title h2::before {
          content: "";
          display: inline-block;
          background-image: url("../img/star02.png");
          background-size: contain;
          background-repeat: no-repeat;
          vertical-align: middle;
          width: 205px;
          height: 180px;
          position: absolute;
          top: -175px; }
    #main-wrap .voice .negative-skew .voice-data {
      padding-top: 100px;
      position: relative; }
      #main-wrap .voice .negative-skew .voice-data .voice-text p {
        margin-top: 15px; }
      #main-wrap .voice .negative-skew .voice-data .voice-text .row {
        margin-top: 25px; }
        #main-wrap .voice .negative-skew .voice-data .voice-text .row .photo {
          text-align: center;
          position: relative; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .photo img {
            width: 75%; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .photo .cover {
            position: relative;
            left: 0;
            bottom: -70px; }
        #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile {
          position: relative; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile h2 {
            font-size: 40px !important; }
            #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile h2 span {
              font-size: 20px;
              font-weight: normal;
              letter-spacing: 2.5px; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile p {
            font-size: 20px; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile img {
            width: 100%;
            margin-top: 15px; }
          #main-wrap .voice .negative-skew .voice-data .voice-text .row .profile .cover {
            position: absolute; }
      #main-wrap .voice .negative-skew .voice-data .work-photo img {
        width: 100%; }
      #main-wrap .voice .negative-skew .voice-data .work-photo .cover {
        position: absolute;
        bottom: -50px;
        width: 105%; }
@media (max-width: 767px) {
  #main-wrap .voice .interview-title h2 {
    color: #000 !important;
    line-height: 100%;
    text-shadow: 0px 3px 6px rgba(255, 255, 255, 0.8) !important; }
    #main-wrap .voice .interview-title h2::before {
      display: none !important; } }
@media (max-width: 991px) {
  #main-wrap .cover {
    position: static !important; } }
#main-wrap .color01 {
  background-color: #fff;
  z-index: 3; }
@media (max-width: 992px) {
  #main-wrap .color01 {
    z-index: 9; } }
#main-wrap .color02 {
  background-color: #D8FFFA;
  z-index: 2;
  padding-top: 120px;
  padding-bottom: 25px; }
#main-wrap .footer {
  background-color: rgba(57, 76, 240, 0.4);
  position: relative;
  z-index: 1;
  padding-top: 200px;
  padding-bottom: 25%;
  background-image: url("../img/kanban.png");
  background-repeat: no-repeat;
  background-size: 60%;
  background-position: left bottom;
  margin-top: -100px; }
  #main-wrap .footer .end-message {
    text-align: center;
    color: #fff; }
    #main-wrap .footer .end-message h1 {
      font-size: 60px !important;
      text-shadow: 0px 3px 6px rgba(0, 0, 0, 0.8);
      position: relative; }
      #main-wrap .footer .end-message h1::before {
        content: "";
        display: inline-block;
        background-image: url("../img/star02.png");
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        width: 205px;
        height: 180px;
        position: absolute;
        top: -175px;
        left: 50%;
        transform: rotateZ(45deg); }

.link-btn {
  color: #000 !important;
  background-color: #fff;
  display: block;
  font-size: 20px;
  padding: 15px 0;
  border-radius: 60px;
  text-align: center;
  margin: 0 auto;
  font-weight: bold;
  border: 1px solid #fff; }
  .link-btn:hover {
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff !important;
    border: 1px solid #fff; }
  .link-btn::after {
    content: "\f0a9";
    font-family: 'fontawesome-s';
    margin-left: 5px; }

/*---------------------------------------------*/
/* footer                                      */
/*---------------------------------------------*/
footer {
  padding: 10px;
  background-color: #FFF; }
  footer small {
    display: block; }

/*---------------------------------------------*/
/* Swiper変更                                  */
/*---------------------------------------------*/
.div-slide {
  /*.button-next {
  	width: 50%;
  	height: 100%;
  	position: absolute;
  	top: 0px;
  	right: 0px;
  	z-index: 2;
  	cursor: url(../img/cursor-next.svg) 43 56,pointer;
  	display: block;
  	overflow: hidden;
  	text-indent: -9999px;
  }
  .button-prev {
  	width: 50%;
  	height: 100%;
  	position: absolute;
  	top: 0px;
  	left: 0px;
  	z-index: 2;
  	cursor: url(../img/cursor-prev.svg) 43 56,pointer;
  	display: block;
  	overflow: hidden;
  	text-indent: -9999px;
  }*/ }
  .div-slide .swiper-slide {
    transform: scale(0.7);
    transition: transform 500ms cubic-bezier(0, 1.65, 1, 1.65); }
    .div-slide .swiper-slide a {
      color: #FFF; }
  .div-slide .swiper-slide-active {
    transform: scale(1); }
  .div-slide .swiper-slide img {
    width: 100%;
    height: auto; }
  .div-slide .swiper-pagination {
    position: static; }
  .div-slide .swiper-pagination-bullet-active {
    background: red !important; }
  .div-slide .button-next {
    width: 50px;
    height: 100%;
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 2;
    display: block;
    cursor: pointer; }
    .div-slide .button-next:before {
      content: "";
      display: block;
      width: 50px;
      height: 50px;
      background-image: url(../img/cursor-next.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }
  .div-slide .button-prev {
    width: 50px;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
    display: block;
    cursor: pointer; }
    .div-slide .button-prev:before {
      content: "";
      display: block;
      width: 50px;
      height: 50px;
      background-image: url(../img/cursor-prev.svg);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center center;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%); }

.div-slide2 {
  width: 100%;
  height: 100%; }
  .div-slide2 .swiper-wrapper {
    margin-bottom: 70px; }
  .div-slide2 .swiper-slide img {
    width: auto;
    height: 100%;
    transform: scale(1);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  .div-slide2 .swiper-pagination-bullet-active {
    background: red; }
  .div-slide2 .button-next {
    width: 100px;
    height: 70px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 99;
    display: block;
    overflow: hidden;
    cursor: pointer; }
    .div-slide2 .button-next:before {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 12.5px 0 12.5px 21.7px;
      border-color: transparent transparent transparent red;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      z-index: -1; }
  .div-slide2 .button-prev {
    width: 100px;
    height: 70px;
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 99;
    display: block;
    overflow: hidden;
    cursor: pointer; }
    .div-slide2 .button-prev:before {
      content: "";
      width: 0;
      height: 0;
      border-style: solid;
      border-width: 12.5px 21.7px 12.5px 0;
      border-color: transparent red transparent transparent;
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -moz-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      -o-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      z-index: -1; }
  .div-slide2 .photo-mask {
    /*border-radius: 50%;*/ }
    .div-slide2 .photo-mask:before {
      padding-top: 100%; }
  .div-slide2 h5 {
    text-align: center; }

a[target="_blank"] h6:before {
  content: "\f24d";
  font-family: 'fontawesome-s';
  margin-right: 10px;
  display: inline-block; }

/*------------------------------------------*/
/* カテゴリーボタン                         */
/*------------------------------------------*/
.cate-menu a {
  height: 100%;
  border: 1px solid #CCC;
  display: block; }
  .cate-menu a h6 {
    padding: 10px 100px 10px 10px;
    display: block;
    margin: 0px;
    position: relative; }
    .cate-menu a h6:after {
      content: "";
      position: absolute;
      top: 0;
      right: 0px;
      width: 100px;
      height: 100%;
      background: white;
      background: -moz-linear-gradient(-45deg, white 0%, white 50%, red 50%, red 63%, red 63%, white 63%, white 67%, red 67%);
      background: -webkit-linear-gradient(-45deg, white 0%, white 50%, red 50%, red 63%, red 63%, white 63%, white 67%, red 67%);
      background: linear-gradient(135deg, white 0%, white 50%, red 50%, red 63%, red 63%, white 63%, white 67%, red 67%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ff0000',GradientType=1 ); }

/*------------------------------------------*/
/* 中ページ                                 */
/*------------------------------------------*/
/* 北星社の主な仕事 */
#job-section > section:not(:last-child) {
  margin-bottom: 80px; }

#job-section > section:nth-child(even) {
  background-color: #ffcccc;
  padding-top: 40px; }

#job-section .row > div > div {
  height: 100%;
  background-color: #FFF;
  padding: 10px; }
  #job-section .row > div > div .photo-mask50 {
    margin: -10px -10px 0px -10px; }
  #job-section .row > div > div h6 {
    border-bottom: 1px solid #000;
    padding-bottom: 10px;
    font-weight: bold; }

/* 社員紹介 */
/* Scss Document */
.pro-catch {
  transform: rotate(3deg); }
  .pro-catch h2 {
    display: inline;
    padding-top: 40px;
    background: linear-gradient(transparent 80%, rgba(255, 0, 0, 0.6) 30%);
    font-size: calc(6.25rem + ((1vw - 12px) * 9.6154)); }

#voice-div h3 {
  color: #0089ff; }
#voice-div .name:after {
  content: "さん";
  font-size: 14px;
  font-size: 1.4rem; }

.profile-data > li > div:first-child {
  padding-right: 5px;
  text-justify: inter-character;
  width: 10rem; }
  .profile-data > li > div:first-child:after {
    content: "："; }

.pro-photo {
  margin-bottom: 20px; }

.img-div {
  padding: 0px; }

.img-div.float-left {
  padding-right: 10px;
  padding-bottom: 10px; }

.timeline_item .float-left {
  padding-left: 0px;
  padding-right: 10px;
  padding-bottom: 10px; }

@media (min-width: 1200px) {
  .pro-catch h2 {
    font-size: 60px;
    font-size: 6.0rem; } }
@media (min-width: 992px) {
  .pro-catch {
    position: absolute;
    bottom: 10%;
    left: auto;
    color: #000;
    line-height: 110%;
    text-shadow: 3px 3px 3px white;
    z-index: 2; }

  .pro-div {
    position: absolute;
    right: 15px;
    bottom: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: rgba(255, 255, 255, 0.8);
    z-index: 2; }

  .pro-photo {
    position: absolute;
    right: 0px;
    top: -90%; } }
.myjob {
  border: 1px solid #0089ff;
  border-radius: 10px;
  padding: 10px;
  overflow: hidden; }
  .myjob h6 {
    margin-top: -10px;
    margin-left: -10px;
    margin-right: -10px;
    padding: 10px;
    background-color: #cce7ff; }

#pro-area {
  position: relative;
  overflow: hidden;
  margin-bottom: 40px; }
  #pro-area .photo-mask2 img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
  @media (min-width: 992px) {
    #pro-area:after {
      content: "";
      width: 100%;
      height: 20%;
      background-color: #FFF;
      position: absolute;
      bottom: -10%;
      left: auto;
      z-index: 1;
      transform: skewY(3deg); }
    #pro-area .photo-mask2 {
      position: relative; }
      #pro-area .photo-mask2:before {
        content: "";
        width: 100%;
        padding-top: 50%;
        top: 0;
        left: 0;
        display: block; }
    #pro-area .container {
      position: absolute;
      bottom: 0px;
      left: 50%;
      z-index: 2;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%); }
      #pro-area .container:before {
        content: "";
        display: block;
        width: 100%;
        padding-top: 50%; } }
  @media (max-width: 991px) {
    #pro-area .pro-catch h2 {
      font-size: 40px;
      font-size: 4.0rem; }
    #pro-area .photo-mask2 {
      overflow: hidden;
      position: relative;
      margin-bottom: 40px;
      padding: 0px !important; }
      #pro-area .photo-mask2:before {
        content: "";
        display: block;
        width: 100%;
        padding-top: 60%; } }

.bg-area {
  position: relative;
  padding-top: 40px; }
  .bg-area:after {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #DDD;
    position: absolute;
    z-index: -100;
    top: 0;
    left: auto;
    transform: skewY(3deg); }

/*スケジュール*/
.schedule-list {
  position: relative;
  width: 100%;
  padding: 1em 0;
  list-style-type: none; }
  .schedule-list:before {
    position: absolute;
    left: 40px;
    top: 0;
    content: '';
    display: block;
    width: 6px;
    height: 100%;
    margin-left: -3px;
    background: #0089ff;
    z-index: 5; }
  .schedule-list li {
    padding: 20px 0;
    position: relative; }
    .schedule-list li:after {
      content: '';
      display: block;
      height: 0;
      clear: both;
      visibility: hidden; }
    .schedule-list li .timeline_item {
      position: relative;
      margin-left: 100px;
      display: block; }
      .schedule-list li .timeline_item .desc {
        padding: 10px;
        background-color: rgba(255, 255, 255, 0.8);
        border: 3px solid #0089ff;
        border-radius: 10px;
        width: 100%; }
        .schedule-list li .timeline_item .desc h5 {
          color: #0089ff; }
      .schedule-list li .timeline_item:after {
        left: -20px;
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 20px 10px 0;
        border-color: transparent #0089ff transparent transparent;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -moz-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%); }
    .schedule-list li .flag_cont {
      background-color: #cce7ff;
      border: 5px solid #0089ff;
      border-radius: 50%;
      width: 80px;
      height: 80px;
      z-index: 5;
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      transform: translateY(-50%); }
      .schedule-list li .flag_cont .time {
        text-align: center;
        color: #0089ff;
        width: 100%;
        display: block;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }

/* 募集 */
#entry-flow h6 {
  border-bottom: 1px solid red;
  background-color: #CCC;
  padding: 10px; }

#how-to article {
  border: 1px solid #CCC;
  padding: 10px; }
  #how-to article h5 {
    font-weight: bold; }

/*youtube*/
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%; }

.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important; }

.recruit {
  margin-left: 15px;
  margin-right: 15px;
  margin-bottom: 80px; }

.recruit a {
  display: inline-block;
  border: none; }

.recruit a:before {
  content: "\f0a9";
  font-family: 'fontawesome-s';
  margin-right: 5px; }

@media (min-width: 992px) {
  .recruit {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #999;
    border-bottom: 0px; }

  .recruit dt {
    width: 15%;
    flex-shrink: 0;
    padding: 10px;
    border-bottom: 1px solid #999;
    margin: 0px;
    background-color: #DDD; }

  .recruit dd {
    width: 85%;
    padding: 10px;
    border-left: 1px solid #999;
    border-bottom: 1px solid #999;
    margin: 0px; } }
@media (max-width: 991px) {
  .recruit {
    border: 1px solid #999; }

  .recruit dt {
    padding: 5px;
    background-color: #DDD; }

  .recruit dd {
    padding: 5px;
    margin-bottom: 20px; }

  .recruit dd a {
    display: block; } }
/* メールフォーム */
/*------------------------------*/
/* お問い合わせフォーム         */
/*------------------------------*/
.need {
  color: #FFF;
  background-color: #0089ff;
  padding: 2px 5px 2px 5px;
  line-height: 100%;
  border-radius: 5px;
  font-size: 70%;
  font-weight: bold;
  margin-left: 5px;
  margin-right: 5px;
  display: inline-block; }

.need:before {
  content: "必須"; }

.contact-table {
  margin: 0px;
  padding: 0px;
  list-style: none; }

.contact-table > li {
  border-bottom: 1px solid #999; }

.contact-table > li > div {
  padding-bottom: 10px; }

.contact-table > li > div:first-child {
  font-weight: bold; }

.contact-table > li > div li {
  margin-bottom: 10px;
  list-style: square; }

.contact-table > li input[type="text"],
.contact-table > li input[type="email"] {
  width: 100%;
  max-width: 500px; }

.contact-table > li input[type="tel"] {
  width: 100%;
  max-width: 500px; }

.contact-table > li textarea {
  width: 100%;
  max-width: 500px;
  height: 100px; }

.contact-table .address-list {
  padding: 0px; }

.contact-table .address-list li {
  list-style: none; }

.contact-table .address-list input[type="text"] {
  margin-left: 5px;
  margin-right: 5px; }

.contact-table .address-list .postnumber {
  width: 8rem; }

.contact-table .address-list select {
  padding: 5px 2px 5px 2px; }

.contact-table .age {
  width: 4rem !important; }

.contact-table label {
  display: inline-block;
  margin: 5px 10px 0 0;
  cursor: pointer; }

input[type="submit"] {
  display: inline-block;
  border-radius: 10px;
  text-align: center;
  cursor: pointer;
  padding: 20px 40px;
  background: red;
  color: #FFF;
  line-height: 1em;
  border-style: none; }

@media only screen and (min-width: 768px) {
  .contact-table > li {
    display: table;
    width: 100%; }

  .contact-table > li > div {
    display: table-cell;
    vertical-align: top;
    padding: 20px 10px 20px 10px; }

  .contact-table > li > div:first-child {
    width: 25%;
    flex-shrink: 0;
    background-color: #ffe6e6; }

  .contact-table > li > div:last-child {
    width: auto; } }
@media only screen and (max-width: 767px) {
  .contact-table > li {
    margin-bottom: 20px; }

  .contact-table .address-list select {
    width: 100%; } }
/*---------------------------------------------*/
form#mail_form * {
  margin: 0;
  padding: 0; }

form#mail_form dl {
  margin: 0 auto;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between; }

form#mail_form dl dt {
  border-top: 1px solid #999;
  padding: 15px 0; }

form#mail_form dl dd {
  border-top: 1px solid #999;
  padding: 15px 0 15px 5%; }

form#mail_form dl dt:first-child,
form#mail_form dl dt:first-child + dd {
  border: none; }

form#mail_form dl dt span {
  display: block;
  font-size: 70%;
  color: #FFF;
  margin-right: 5px; }

form#mail_form dl dd .age {
  width: 4rem; }

form#mail_form dl dd #postal {
  width: 12rem; }

.samp {
  display: block;
  font-size: 70%;
  color: #FFF;
  display: inline-block;
  float: left;
  padding: 4px 10px;
  border-radius: 3px;
  background: #d9534f;
  border: 1px solid #d43f3a; }

/* -- for JavaScript ここから -------------------------------------------------------------------------------- */
form#mail_form dl dt span.required,
form#mail_form dl dt span.optional {
  display: inline-block;
  float: left;
  padding: 4px 10px;
  border-radius: 3px; }

form#mail_form dl dt span.required {
  background: #d9534f;
  border: 1px solid #d43f3a; }

form#mail_form dl dt span.optional {
  background: #337ab7;
  border: 1px solid #2e6da4; }

form#mail_form dl dd span.error_blank,
form#mail_form dl dd span.error_format,
form#mail_form dl dd span.error_match {
  display: block;
  color: #ff0000;
  margin-top: 3px; }

span.loading {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border-top: 5px solid rgba(255, 255, 255, 0.2);
  border-right: 5px solid rgba(255, 255, 255, 0.2);
  border-bottom: 5px solid rgba(255, 255, 255, 0.2);
  border-left: 5px solid #ffffff;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load-circle 1.0s linear infinite;
  animation: load-circle 1.0s linear infinite;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -30px;
  margin-left: -30px; }

@-webkit-keyframes load-circle {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
@keyframes load-circle {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg); } }
/* -- for JavaScript ここまで -------------------------------------------------------------------------------- */
form#mail_form input[type="text"],
form#mail_form input[type="email"],
form#mail_form input[type="tel"] {
  max-width: 90%;
  padding: 7px 2%;
  border: 1px solid #999;
  border-radius: 3px;
  margin-right: 10px; }

form#mail_form input[type="text"]:focus,
form#mail_form input[type="email"]:focus,
form#mail_form input[type="tel"]:focus,
form#mail_form textarea:focus {
  box-shadow: 0px 0px 5px #55ccff;
  border: 1px solid #55ccff; }

form#mail_form ul li input[type="radio"],
form#mail_form ul li input[type="checkbox"] {
  margin-right: 10px;
  margin-top: 10px; }

form#mail_form ul li:first-child input[type="radio"],
form#mail_form ul li:first-child input[type="checkbox"] {
  margin-top: 0px; }

form#mail_form select {
  font-size: 100%;
  font-family: inherit;
  margin-top: 10px; }

form#mail_form textarea {
  display: block;
  width: 90%;
  max-width: 90%;
  height: 200px;
  padding: 7px 2%;
  resize: vertical;
  border: 1px solid #999;
  border-radius: 3px;
  background: #fafafa;
  -webkit-appearance: none;
  font-size: 100%;
  font-family: inherit; }

form#mail_form ul {
  list-style-type: none; }

form#mail_form ul li label:hover {
  cursor: pointer; }

form#mail_form input#company {
  width: 60%; }

form#mail_form input#name_1,
form#mail_form input#name_2,
form#mail_form input#read_1,
form#mail_form input#read_2,
form#mail_form input#postal,
form#mail_form input#phone,
form#mail_form input#schedule {
  width: 30%; }

form#mail_form input#mail_address,
form#mail_form input#mail_address_confirm {
  width: 80%; }

form#mail_form input#postal + a {
  display: inline-block;
  padding: 5px 15px;
  border: 1px solid #000000;
  border-radius: 3px;
  background: #000000;
  color: #FFF; }

form#mail_form input#postal + a:hover {
  cursor: pointer;
  background: red;
  border: 1px solid red; }

form#mail_form input#address {
  width: 90%; }

form#mail_form p#form_submit {
  margin: 0 auto;
  padding: 15px 0;
  border-top: 1px solid  #999; }

form#mail_form input[type="button"] {
  padding: 7px 20px;
  border: 1px solid #000000;
  border-radius: 3px;
  background: #000000;
  color: #FFF;
  -webkit-appearance: none; }

form#mail_form input[type="button"]:hover {
  cursor: pointer;
  background: red;
  border: 1px solid red; }

/* -- responsive ----------------------------------------------------------------------------------------------------------------- */
@media only screen and (min-width: 768px) {
  form#mail_form dl dt {
    width: 20%; }

  form#mail_form dl dd {
    width: 80%; } }
@media only screen and (max-width: 767px) {
  form#mail_form dl {
    overflow: visible;
    flex-wrap: wrap;
    width: 100%; }

  form#mail_form dl dt {
    text-align: left;
    padding: 15px 0 5px;
    font-weight: bold;
    width: 100%; }

  form#mail_form dl dd {
    border-top: none;
    padding: 0px 0 20px 0px;
    width: 100%; }

  form#mail_form dl dt span {
    font-weight: normal; }

  /* -- for JavaScript ここから -------------------------------------------------------------------------------- */
  form#mail_form dl dt span.required,
  form#mail_form dl dt span.optional {
    margin-right: 1em;
    margin-bottom: 2em; }

  /* -- for JavaScript ここまで -------------------------------------------------------------------------------- */
  form#mail_form input[type="text"],
  form#mail_form input[type="email"],
  form#mail_form input[type="tel"] {
    margin-top: 0px; }

  form#mail_form input#postal + a {
    padding: 6px 15px 5px; }

  form#mail_form input#form_submit_button {
    margin-left: 0; }

  form#mail_form select {
    margin-top: 0; }

  form#mail_form input#phone,
  form#mail_form input#schedule {
    width: 50%; } }
/* 1000pixel end */

/*# sourceMappingURL=style.css.map */