@charset "UTF-8";

/* ==========================================================================
BUTTON
========================================================================== */
.qa01 {

width: 180px;
height: 80px;
  font-size: 28px;
background: #e96900;
  left: 10px;
  bottom: 10%;
  color: #FFF;
  text-align: center;
  border-radius: 150px;
  font-weight: 800;
  line-height: 80px;
}


.qa02 {
font-size: 30px;
  color: #000;
  padding: 10px;
  text-align: left;
  font-weight: 600;
  margin-top: -120px;
  margin-left: 200px;
  line-height: 1.2;
}

.qa03 {
font-size: 30px;
  color: #000;
  padding: 10px;
  text-align: left;
  font-weight: 600;
  margin-top: 0px;
  line-height: 1.2;
}
/* ==========================================================================
BUTTON
========================================================================== */
.c-btn {
  padding-bottom: 8px;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.c-btn::before {
  content: '';
  display: block;
  width: 100%;
  position: absolute;
  bottom: 0;
  top: 50%;
  background: repeating-linear-gradient(
    45deg,
    #dfceba,
    #dfceba 2.5px,
    #4267B2 2.5px,
    #4267B2 5px
  );
  transition: transform 200ms ease;
}
.c-btn a {
  position: relative;
  font-family: "微軟正黑體" ,"Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif;
  text-align: center;
  cursor: pointer;
  width: 100%;
  margin: 0 auto;
  background-color: #4267B2;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1.125rem;
  line-height: 1.315789474;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-pack: center;
  justify-content:center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  border-radius: 10px;
  border-bottom: 2px solid #FFFFFF;
  transition: transform 200ms ease-out!important;
}
.c-btn .c-btn__link {
  display: block;
  position: relative;
  font-family:"微軟正黑體" ,"Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "BIZ UDPGothic", Meiryo, sans-serif ;
  text-align: center;
  width: 100%;
  margin: 0 auto;
  background-color: #ff637e;
  color: #FFFFFF;
  font-weight: bold;
  font-size: 1.125rem;
  line-height: 1.315789474;
  display:-ms-flexbox;
  display:flex;
  -ms-flex-pack: center;
  justify-content:center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  border-radius: 10px;
  border-bottom: 2px solid #FFFFFF;
  transition: all 200ms ease-out!important;
}
.btn-small-txt {
  font-size: .8em;
}
/* color */
.c-btn.-orange:before {
  background: repeating-linear-gradient(
    45deg,
    #dfceba,
    #dfceba 2.5px,
    #ffa302 2.5px,
    #ffa302 5px
  );
}
.c-btn.c-btn--disabled:before {
  background: repeating-linear-gradient(
    45deg,
    #fff,
    #fff 2.5px,
    #adadad 2.5px,
    #adadad 5px
  );
}
.c-btn.-orange a {
  background-color: #ffa302;
}
.c-btn.-orange .c-btn__link {
  background-color: #ffa302;
}
.c-btn.-orange .c-btn__link--disabled {
  background-color: #adadad;
}
.c-btn--disabled a {
  background-color: #adadad;
  pointer-events: none;
}
.c-btn.-blue::before {
  background: repeating-linear-gradient(
    45deg,
    #fff,
    #fff 2.5px,
    #38b9f2 2.5px,
    #38b9f2 5px
  );
}
.c-btn.-blue a {
  background-color: #3ebcef;
}
.c-btn.-violet::before {
  background: repeating-linear-gradient(
    45deg,
    #fff,
    #fff 2.5px,
    #cbbcac 2.5px,
    #cbbcac 5px
  );
}
.c-btn.-violet a {
  background-color: #ff4e6b;
}
.c-btn.-green::before {
  background: repeating-linear-gradient(
    45deg,
    #fff,
    #fff 2.5px,
    #2dc976 2.5px,
    #2dc976 5px
  );
}
.c-btn.-green a {
  background-color: #2dc976;
}
.c-btn.-sblue::before {
  background: repeating-linear-gradient(
    45deg,
    #fff,
    #fff 2.5px,
    #e8f7fd 2.5px,
    #e8f7fd 5px
  );
}
.c-btn.-sblue a {
  background-color: #e8f7fd;
  color: #3ebbef;
}
.c-btn.-sblue .ico-svg svg {
  fill: #3ebbef;
}
.c-btn.-comingsoon {
  position: relative;
  overflow: hidden;
}
.c-btn.-comingsoon a {
  pointer-events: none;
  transform: 0!important;
}
.c-btn.c-btn--disabled:hover a,
.c-btn.c-btn--disabled:hover::before,
.c-btn.-comingsoon:hover a,
.c-btn.-comingsoon:hover::before
 {
  transform: none;
}
.c-btn.-comingsoon::after {
  content: '近日公開予定';
  display:-ms-flexbox;
  display:flex;
  -ms-flex-pack: center;
  justify-content:center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 100%;
  bottom: 100%;
  background-color: rgba(0,0,0,0.7);
  color: #FFF;
  font-weight: bold;
  font-size: 1.375rem;
  width: 100%;
  height: 100%;
  z-index: 50;
  text-align: center;
}

@media print, screen and (min-width: 769px) {
  /* size */
  .c-btn a {
    height: 5rem;
    opacity: 1!important;
  }
  .c-btn .c-btn__link {
    height: 5rem;
    opacity: 1!important;
  }
  .c-btn.-large {
    border-radius: 20px;
  }
  .c-btn.-large a {
    height: 7.625rem;
    border-radius: 20px;
  }
  .c-btn.-small a {
    height: 4.0625rem;
  }
  .c-btn.-small a > span {
    font-size: 1.125rem;
  }
  /* icon */
  .c-btn .ico-svg {
    position: absolute;
    top: 50%;
    right: 8.888888889%;
  }
  .c-btn.-large .ico-svg {
    right: 11.111111111%;
  }
  .c-btn .ico-arrow-right {
    transform: translateY(-50%) scale(.7);
  }
  .c-btn .ico-arrow-bottom {
    transform: translateY(-50%) scale(1.8);
  }
  .c-btn .ico-download {
    transform: translateY(-50%) scale(2);
  }
  .c-btn .ico-blank {
    transform: translateY(-50%) scale(2);
  }
  .c-btn .ico-pdf {
    transform: translate(45%,-50%) scale(3.5)
  }
  .c-btn .ico-excel {
    transform: translate(45%,-50%) scale(3.5)
  }
  .c-btn .ico-word {
    transform: translate(45%,-50%) scale(3.5)
  }
  .c-btn .ico-search {
    transform: translate(45%,-50%) scale(1.5)
  }
  /* hover */
  .c-btn:hover {
    background: none;
  }
  .c-btn:hover::before {
    transform: translateY(-10px);
  }
  .c-btn.c-btn--disabled:hover::before {
    transform: translateY(0);
  }
  .c-btn:hover a {
    transform: translateY(10px);
  }
  .content-container a {
    transition: opacity 250ms ease-out;
  }
  .content-container  a:hover {
    opacity: .7;
  }
}

[data-browser="ie"] .content-container {
  overflow: hidden;
  margin-top: -80px;
}

@media print, screen and (max-width: 768px) {
  .c-btn {
    
    padding-bottom: 4px;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
  }
  .c-btn.--txt-small span {
    font-size: 0.9em;
  }
  .c-btn a {
    height: 3.571428571rem;
  }
  .c-btn a span {
    margin-right: 0;
  }
  /* size */
  .c-btn a {
    height: 3.571428571rem;
    opacity: 1!important;
  }
  .c-btn .c-btn__link {
    height: 3.571428571rem;
    opacity: 1!important;
  }
  .c-btn.-large a {
    height: 5.785714286rem;
  }
  .c-btn.-small a {
    height: 3.571428571rem;
  }
  .c-btn.-small a > span {
    font-size: 1.125rem;
  }
  /* icon */
  .c-btn a .ico-svg {
    position: absolute;
    top: 50%;
    right: 3%;
  }
  .c-btn .c-btn__link .ico-svg {
    position: absolute;
    top: 50%;
    right: 3%;
  }
  .c-btn .ico-arrow-right {
    transform: translateY(-50%) scale(.7);
  }
  .c-btn .ico-arrow-bottom {
    transform: translateY(-50%) scale(1.8);
  }
  .c-btn .ico-download {
    transform: translateY(-50%) scale(2);
    right: 6%;
  }
  .c-btn .ico-blank {
    transform: translateY(-50%) scale(2);
  }
  .c-btn .ico-pdf {
    transform: translate(-100%,-50%) scale(3.5)
  }
  .c-btn .ico-excel {
    transform: translate(-100%,-50%) scale(3.5)
 }
  .c-btn .ico-word {
    transform: translate(-100%,-50%) scale(3.5)
 }
  .c-btn .ico-search {
    transform: translate(-100%,-50%) scale(2)
  }
}


@media print, screen and (max-width: 767px) {
  .about-corporate-service-btn {
    max-width: 22.5rem;
    margin: 2.857142857rem auto 0;
  }
  .about-corporate-service-btn a {
    height: 6.07rem;
  }
}
@media print, screen and (min-width: 768px) {
  .about-corporate-service-btn {
    max-width: 25rem;
    margin: 3.5rem auto 0;
  }
  .about-corporate-service-btn a {
    height: 6.25rem;
  }
}


/* ==========================================================================
  txt link
========================================================================== */


======================================================================
Fillter
====================================================================== */
.fillter-alert {
  width: 39.994286rem;
  margin: 0.875rem auto 0;
  padding: 1rem 1rem;
  font-size: 1em;
  color: #ff637d;
  background-color: #fff3de;
  text-align: center;
}
.fillter-alert p {
  display: inline-block;
  text-align: left;
  line-height: 1.6;
  font-weight: bold;
  font-feature-settings: "palt";
}
/* .fillter-alert p a {
  display:-ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-pack: center;
  justify-content:center;
  -ms-flex-align: center;
  align-items: center;
}
.fillter-alert p a .ico-svg {
  width: .5rem;
  margin-left: 0.5rem;
} */
.fillter-alert p a {
  display: inline;
}
.fillter-alert p a .ico-svg svg {
  fill: rgb(62, 187, 239);
}
.fillter-box  .fillter-alert,
.selector-alert .fillter-alert {
  width: 100%;
  margin: 0 auto 2.5rem;
  padding: 1.5rem 1rem;
}
.fillter-box  .fillter-alert {
  margin: 1rem auto 0;
}
.fillter-box .fillter-alert > p,
.selector-alert .fillter-alert > p {
  font-size: 1.125rem;
  text-align: center;
}
.fillter-box .fillter-alert p a,
.selector-alert .fillter-alert p a {
  color: #3ebbef;
  text-decoration: underline;
  margin-top: .5rem;
}
.fillter-box .fillter-alert > p {
  font-size: 1rem;
}
.fillter-box .fillter-alert > p {
  font-size: 1rem;
}

@media all and (max-width: 767px) {
  .fillter-box  .fillter-alert > p,
  .selector-alert .fillter-alert > p {
    text-align: left;
    display: block;
    padding-left: 1rem;
    text-indent: -1rem;
  }
}

@media all and (min-width: 768px) {
  .fillter {
    margin-top: 4rem;
  }
  .section-ttl {
    color: #ff637d;
    text-align: center;
    font-size: 1.125rem;
  }
  .fillter-list {
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack: center;
    justify-content:center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 2.25rem;
  }
  .fitter-list__item input[type=checkbox] {
    display: none;
  }
  .fitter-list__checkbox {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 0.125rem 2.5rem;
    position: relative;
    width: auto;
  }
  .fitter-list__item:last-child .fitter-list__checkbox {
    padding-right: 0;
  }
  .fitter-list__checkbox::before {
    background: #fff;
    border: 1px solid #ff637d;
    content: '';
    display: block;
    left: 5px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-radius: 3px;
    width: 1.428571429rem;
    height: 1.428571429rem;
  }
  .fitter-list__checkbox::after {
    border-right: 3px solid #ff637d;
    border-bottom: 3px solid #ff637d;
    content: '';
    display: block;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 0.3525rem;
    transform: translateY(-60%) rotate(45deg);
    width: 0.714285714rem;
    height: 1.151428571rem;
  }
  .fitter-list__item input[type=checkbox]:checked + .fitter-list__checkbox::after {
    opacity: 1;
  }
}

@media all and (max-width: 767px) {
  .fillter {
    margin-top: 2.285714286rem;
  }
  .c-section__inner {
  }
  .c-section__body {
  }
    .section-ttl {
      color: #ff637d;
      text-align: center;
      font-size: 1.125rem;
    }
  .fillter-list {
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 2.142857143rem;
    padding: 0 0 0 1.071428571rem;
  }
  .fitter-list__item {
    margin-left: 1rem;
    width: 6.785714286rem;
  }
  .fitter-list__item:nth-child(2) {
    width: calc(100% - 8.785714286rem);
  }
  .fitter-list__item:nth-child(n+3) {
    margin-top: 1rem;
  }
  .fitter-list__item input[type=checkbox] {
    display: none;
  }
  .fitter-list__checkbox {
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    padding: 0 0 0 2.142857143rem;
    position: relative;
    width: auto;
  }
  .fitter-list__checkbox:nth-child(n+3) {
    margin-top: 1rem;
  }
  .fitter-list__checkbox::before {
    background: #fff;
    border: 1px solid #ff637d;
    content: '';
    display: block;
    left: 5px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    border-radius: 3px;
    width: 1.428571429rem;
    height: 1.428571429rem;
  }
  .fitter-list__checkbox::after {
    border-right: 3px solid #ff637d;
    border-bottom: 3px solid #ff637d;
    content: '';
    display: block;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 0.3525rem;
    transform: translateY(-60%) rotate(45deg);
    width: 0.714285714rem;
    height: 1.151428571rem;
  }
  .fitter-list__item input[type=checkbox]:checked + .fitter-list__checkbox::after {
    opacity: 1;
  }
  .fillter-alert {
    width: 100%;
    padding: 1rem 1.5rem;
  }
  .fillter-alert p {
    text-align: justify;
    text-justify: inter-ideograph;
  }
}

/*
======================================================================
irregulararealist Link
====================================================================== */
.irregulararealist {
  color: #ff637d;
  border: #ff637d solid 4px;
  padding: 1rem;
  text-align: center;
  font-weight: bold;
  position: relative;
}
.irregulararealist i {
  content: "";
  width: 1.428571429rem;
  height: 1.428571429rem;
  border-radius: 20px;
  background-color: #fff;
  border: #ff637d solid 2px;
  border-radius: 20px;
  position: absolute;
  top: 50%;
  right: 1.5rem;
  transform: translateY(-50%);
}
.irregulararealist i::before{
  content: "";
  display: block;
  width: 12px;
  height: 2px;
  background: #ff637d;
  position: absolute;
  left: 2.5px;
  top: 8px;
}
.irregulararealist i::after{
  content: "";
  display: block;
  width: 2px;
  height: 12px;
  background: #ff637d;
  position: absolute;
  left: 8px;
  top: 3px;
}
@media (max-width: 768px)  {
  .irregulararealist {
    margin-top: 30px;
    margin-bottom: 40px;
  }
  .irregulararealist i {
    border: #ff637d solid 2px;
  }
  .irregulararealist i::before {
    content: "";
    display: block;
    width: 12px;
    height: 1px;
    background: #ff637d;
    position: absolute;
    left: 3px;
    top: 8.5px;
  }
  .irregulararealist i::after {
    content: "";
    display: block;
    width: 1px;
    height: 12px;
    background: #ff637d;
    position: absolute;
    left: 8.5px;
    top: 3px;
  }
}

@media (max-width: 767px)  {
body:not(#top) .main-vidual__body::before {
    padding-top: 41.041666667%;
}

}
/*
======================================================================
sticky
====================================================================== */
.sticky__inner {
  width: 100%;
}
#sticky{
  display: none !important;
}
@media (min-width: 768px)  {
  #sticky.sticky {
    padding-top: 1.5rem;
    padding-bottom: 1.5em;
    background:rgba(0, 0, 0, 0.5)!important;
    width: 100%;
    z-index: 998;
    display: block;
    position: fixed;
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
  }
  #sticky.sticky .sticky__body {
    max-width: 61.25rem;
    margin: 0 auto;
    position: relative;
    background-color: #fff5e3;
    border-radius: 30px;
    padding: 24px 2.5rem;
    display: block;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0;
  }
  #sticky.sticky.is-close .sticky__body {
    padding: 0 2.5rem;
    background-color: transparent;
  }
  .sticky__ttl {
    text-align: center;
    color: #FFFFFF;
    font-weight: bold;
    background-color: #ffa303;
    padding: 1rem;
    width: 44.48%;
    border-radius: 10px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50px;
    margin: 0 auto;
  }
  .sticky__ttl > span {
    width: auto;
    margin-right: 1.5rem;
    display: block;
  }
  .is-close .sticky__list {
    display: none;
  }
  .sticky__list {
    width: 100%;
  }
  .sticky__list a {
    /*color: #ffa303;*/
    text-decoration: underline;
    display: inline;
  }
  .sticky__list a:hover{
    text-decoration: none;
  }
  .sticky__list-item:last-child {
    padding-bottom: 24px;
  }
  .sticky__list-item {
    padding-top: 24px;
  }
  .sticky__list-item dl {
    display: -ms-flexbox;
    display: flex;
  }
  .sticky__list-item dt {
    width: 14.4144144%;
    font-size: 1rem;
    font-weight: bold;
    position: relative;
    padding-left: 1.25rem;
    line-height: 1.625;
  }
  .sticky__list-item dt::before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-color: #ffa303;
    position: absolute;
    top: 10%;
    border-radius: 10px;
    left: 0;
  }
  .sticky__list-item dd {
    width: calc(100% - 14.4144144%);
    padding-left: 1rem;
    line-height: 1.625;
    transition: opacity 750ms ease-out;
  }
  .sticky__list-item:not(.news__list-item--disable) dd {
    text-decoration: none;
  }
  .sticky__link {
    border-top: solid 1px#ffc868;
    text-align: center;
    padding: 24px 0;
  }
  .sticky__link a{
    color: #3ebbef;
  }
  .sticky__close_body {
    text-align: center;
    display: block;
  }
  .sticky__close {
    display: inline-block;
    cursor: pointer;
    color: #ffa303;
  }
  .sticky .close_icon,
  .sticky_se .close_icon{
    position: absolute;
    color: #fff;
    top: 10px;
    right: 1.5rem;
    margin: auto;
    cursor: pointer;
  }
  .sticky .close_icon i,
  .sticky_se .close_icon i{
    font-size: 40px;
    line-height: 1;
    font-style: normal;
    display: block;
  }
  .sticky_se {
    padding-top: 1.5rem;
    padding-bottom: 1.5em;
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
    position: relative;
    /* z-index: 100; */
    display: block;
    /* position: fixed;
    bottom: 0; */
    margin: 2.285714286rem 0 0;
    /* overflow-y: scroll;
    height: 70%; */
  }
}
@media all and (min-width: 768px) and (max-width: 980px) {
  #sticky.sticky .sticky__body {
    max-width: 92.5%;
  }
  .sticky .close_icon, .sticky_se .close_icon {
    top: 0;
    right: 10px;
  }
}
@media all and (max-width: 767px) {
  #sticky {
    /* display: none; */
  }
  #sticky.sticky {
    padding: 1.5rem 2rem!important;
    background:rgba(0, 0, 0, 0.5);
    width: 100%;
    z-index: 998;
    display: block;
    position: fixed;
    bottom: 0;
    margin: 2.285714286rem 0 0;
    overflow-y: scroll;
  }
  .is-close.sticky {
    height: auto;
  }
  #sticky.sticky .sticky__body {
    background-color: #fff5e3;
    border-radius: 20px;
    padding: 1.25rem 1.035714286rem;
    display: block;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 0;
  }
  #sticky.sticky.is-close .sticky__body {
    background-color: transparent;
    padding: 0rem 1.035714286rem;
  }
  .sticky__ttl {
    text-align: center;
    color: #FFFFFF;
    font-weight: bold;
    background-color: #ffa303;
    padding: .85rem 1.5rem;
    width: auto;
    border-radius: 10px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 50px;
    margin: 0 auto;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
  }
  .sticky__ttl > span {
    width: auto;
    margin-right: 0.5rem;
    display: block;
  }
  .is-close .sticky__list {
    display: none;
  }
  .sticky__list {
    width: 100%;
  }
  .sticky__list a {
    /*color: #ffa303;*/
    text-decoration: underline;
    display: inline;
  }
  .sticky__list a:hover{
    text-decoration: none;
  }
  .sticky__list-item:last-child {
    padding-bottom: 1.5rem;
  }
  .sticky__list-item {
    padding-top: 1.5rem;
  }
  .sticky__list-item dl {
    margin-top: .75rem;
  }
  .sticky__list-item dl:first-child {
    margin-top: 0;
  }
  .sticky__list-item dt {
    font-size: 1rem;
    font-weight: bold;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    padding-left: 1.25rem;
  }
  .sticky__list-item dt::before {
    content: "";
    width: 1rem;
    height: 1rem;
    background-color: #ffa303;
    position: absolute;
    top: 10%;
    border-radius: 10px;
    left: 0;
  }
  .sticky__list-item dd {
    font-size: 0.9375rem;
    line-height: 1.6;
    padding-top:.25rem;
  }
  .sticky__list-item:not(.news__list-item--disable) dd {
    text-decoration: none;
  }
  .sticky__link {
    border-top: solid 1px#ffc868;
    text-align: center;
    padding: 40px 0;
    font-size: 1.142857143rem;
    line-height: 1.6;
  }
  .sticky__link a{
    color: #3ebbef;
  }
  .sticky__close_body {
    text-align: center;
    display: block;
  }
  .sticky__close {
    display: inline-block;
    cursor: pointer;
    color: #ffa303;
    font-size: 1.142857143rem;
    font-weight: bold;
  }
  .sticky .close_icon,
  .sticky_se .close_icon {
    position: absolute;
    color: #fff;
    top: 0;
    right: 0.5rem;
    margin: auto;
    cursor: pointer;
  }
  .sticky .close_icon i,
  .sticky_se .close_icon i{
    font-size: 30px;
    line-height: 1;
    font-style: normal;
    display: block;
  }
  .sticky_se {
    padding-top: 1.5rem;
    padding-bottom: 1.5em;
    background:rgba(0, 0, 0, 0.5);
    width: 100%;
    z-index: 100;
    display: block;
    position: fixed;
    bottom: 0;
    margin: 2.285714286rem 0 0;
  }
}
/*  */
@media (min-width: 768px)  {
  .irregulararealist_link {
    margin-top: 1.785714286rem;
  }
}
@media all and (max-width: 767px) {
  .irregulararealist_link {
    margin-top: 3.5rem
  }
}

@media all and (min-width: 481px) and (max-width: 767px) {

#top .main-vidual__inner::before {
    width: 2060px;
  }

.main-vidual__logo {
    width: 50%;
left: 30%;
top: 35%;
}
 }
@media all and (min-width: 768px) and (max-width: 1399px) {
.main-vidual__logo {
    width: 30rem;
position: absolute;
top: 55%;
left: 25%;
transform: translate(-50%, -50%);
z-index: 20;
}
#top .main-vidual__body::before {
    padding-top: 36.5625rem;
}
#faq .main-vidual__logo {
    width: 23rem;
position: absolute;
top: 58%;
left: 30%;
transform: translate(-50%, -50%);
z-index: 20;
}
}
@media all and (max-width: 480px) {
  .main-vidual {
    width: 100%;
    background-color: #61d3fd;
    position: relative;
    overflow: hidden;
  }
  .main-vidual__body {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    position: relative;
  }
  .main-vidual__body::before {
    content: '';
    display: block;
    width: 100%;
    height: auto;
  }
  #top .main-vidual__body::before {
    padding-top: 61.979166667%;
  }
  body#top .main-vidual__body::before {
    
    display: block;
    width: 100%;
    padding-top: 66.66666667%;
    background-image: url(../img/top/mv_bg_sp.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 10;
  }
  body:not(#top) .main-vidual__body::before {
    content: '';
    display: block;
    width: 100%;
    height: auto;
    padding-top: 64%;
    background-image: url(../img/common/mv_bg_sp.jpg);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 10;
  }
  /* top logo */
  .main-vidual__logo {
    width: 50%;
    position: absolute;
    top: 20%;
    left: 5%;
   
    z-index: 20;
  }
  .main-vidual__logo .logo-pc {
    display: none;
  }
  .main-vidual__logo svg {
    fill: #FFFFFF;
  }
  .main-vidual__txt {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 20;
    margin: 0 auto;
  }
  .main-vidual__txt::before {
    content: '';
    display: block;
    width: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
  }
#faq .main-vidual__logo {
   width: 50%;
    position: absolute;
    top: 20%;
    left: 5%;
    z-index: 20;
}
.c-btn {
    max-width: 100%;
}

}
.lightbox-target {
  /* 設定好背景層的樣式以及位置 */
  position: fixed;
  top: -100%;
  width: 100%;
  background: rgba(0,0,0,.7);

  /* 預設透明度為 0，觸發 :target 後，利用動畫效果調整透明度 */
  opacity: 0;
  @include transition(opacity .5s ease-in-out);
  overflow: hidden;
  .content {
    /* 設定內容的樣式及位置(白底區塊) */
	width: 90%;
	height: 90%;
	background: #fff;
	color: #333;
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 3px solid #fff;
	@include box-shadow(0 0 8px rgba(0,0,0,.3));
	box-sizing: border-box;

	/* 預設寬高為 0，觸發 :target 後，利用動畫效果展開寬與高 */
	max-height: 0%;
	max-width: 0%;
	@include transition(.5s ease-in-out);
	}
  img {
	/* 設定圖片的樣式及位置，利用 */
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 3px solid #fff;
	@include box-shadow(0 0 8px rgba(0,0,0,.3));
	box-sizing: border-box;

	/* 預設寬高為 0，觸發 :target 後，利用動畫效果展開寬與高 */
	max-height: 0%;
	max-width: 0%;
	@include transition(.5s ease-in-out);
  }

  /* 當 :target 觸發後，index-target 的透明度為 1；content & img 的寬高為 100% */
  &:target {
    opacity: 1;
	top: 0;
	bottom: 0;
	.content, img {
	  max-height: 100%;
	  max-width: 100%;
	}
	.lightbox-close {
	  top: 5%;
	}
  }
}

/* 關閉 Lightbox 按鈕的位置及樣式 */
.lightbox-close {
  display: block;
  width: 50px;
  height: 50px;
  box-sizing: border-box;
  background: #139dd7;
  color: #fff;
  position: absolute;
  top: 10%;
  right: 5%;
  @include transition(.5s ease-in-out);

  /* 利用偽元素做出 \ 以及 / 的線條，合併就變成 X 囉 */
  &:before, &:after {
	content: " ";
	display: block;
	height: 30px;
	width: 1px;
	background: #fff;
	position: absolute;
	left: 26px;
	top: 10px;
	@include transform(rotate(45deg));
  }
  &:after {
	@include transform(rotate(-45deg));
  }