@charset "utf-8";
/* CSS Document */
img, video{vertical-align: bottom;}
@media screen and (max-width:999px){img, iframe{max-width: 100%;}}
html{font-size: 62.5%;font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
/* color */
:root{
  --color-primary: #f82d61;
  --color-secondary: #ffacba;
  --color-tertiary: #fde1e4;
  --color-text: #1a1a1a;
  --color-text-white: #fff;
  --color-border: #000;
  --color-sapporo: #51d3ef;
  --color-sapporo-light: #b8f7f2;
  --color-yokohama: #f22828;
  --color-yokohama-light: #febab5;
  --color-tsuchiura: #ff9b2f;
  --color-tsuchiura-light: #feddad;
}
/* font-size */
body{font-size: 1.6em;line-height: 2;color: var(--color-text);}
@media screen and (max-width:999px){body{line-height: 1.5;}}
a{color: var(--color-text);}
@media screen and (max-width:999px){
  h2, .h2{font-size: 2.6rem;line-height: 1.3;font-weight: normal;}
  h3, .h3{font-size: 2.2rem;line-height: 1.3;}
  h4, .h4{}
}
@media screen and (min-width:1000px){
  h2{font-size: calc(2.25rem + ((1vw - .1rem) * 1.3043));line-height: 1.3;font-weight: normal;}/* 36-48 */
  h3{font-size: calc(2rem + ((1vw - .64rem) * 0.7143));line-height: 1.3;}/* 24-36 */
  h4{}
  .h2{font-size: calc(2.25rem + ((1vw - .1rem) * 1.3043));line-height: 1.3;font-weight: normal;}/* 36-48 */
  .h3{font-size: calc(2rem + ((1vw - .64rem) * 0.7143));line-height: 1.3;}/* 24-36 */
  .h4{}
  section p{
    font-size:125%;
  }
}
h4 {
}
h5 {
  line-height: normal !important;
  margin-bottom: 1em;
}
h5:before {
  content: '';
  border: solid .2rem var(--color-primary);
  border-radius: .2rem;
  margin-right: 1rem;
}
.bracket{margin-bottom:3em;}
.bracket span{
  padding: .6em 1em;
  color: var(--color-primary);
  position: relative;
  display: inline-block;
}
.bracket span:before{
  width: 1.2em;height: 1.8em;
  position: absolute;left: 0;top: 0;
  content: '';
  border-top: 2px solid var(--color-primary);border-left: 2px solid var(--color-primary);
}
.bracket span:after{
  width: 1.2em;height: 1.8em;
  content: '';
  position: absolute;right: 0;bottom: 0;
  border-bottom: 2px solid var(--color-primary);border-right: 2px solid var(--color-primary);
}
/* titles */
@media screen and (max-width:999px){
  .titles .bracket {
    margin-bottom: 0;padding: 10vw 0;
  }
}
@media screen and (min-width:1000px){
  .titles .bracket {
    margin-bottom: 0;padding: 10rem 0;
  }
}
.area-top .top-about .hero-title > div {
  background: url(../data/titles/tit-wwcd.svg) center bottom no-repeat;background-size: cover;
}
#about .titles {
  background: url(../data/titles/tit-wwcd.svg) center bottom no-repeat;background-size: contain;
}
.area-top #feature .titles {
  background: url(../data/titles/tit-feature.svg) center bottom no-repeat;background-size: contain;
}
.area-top #feature .titles {
  background: url(../data/titles/tit-feature.svg) center bottom no-repeat;background-size: contain;
}
.area-top .top-interview .titles,
#interview .titles {
  background: url(../data/titles/tit-interview.svg) center bottom no-repeat;background-size: contain;
}
.area-top .wages .titles {
  background: url(../data/titles/tit-wages.svg) center bottom no-repeat;background-size: contain;
}
.area-top .top-locations .titles {
  background: url(../data/titles/tit-locations.svg) center bottom no-repeat;background-size: contain;
}
.area-top .top-faq .titles,
#faq .titles {
  background: url(../data/titles/tit-qa.svg) center bottom no-repeat;background-size: contain;
}
.beginners .titles {
  background: url(../data/titles/tit-beginners.svg) center bottom no-repeat;background-size: contain;
}
.indentification .titles {
  background: url(../data/titles/tit-indentification.svg) center bottom no-repeat;background-size: contain;
}
.comic .titles {
  background: url(../data/titles/tit-comic.svg) center bottom no-repeat;background-size: contain;
}
.return .titles {
  background: url(../data/titles/tit-wel-back.svg) center bottom no-repeat;background-size: contain;
}
.migrant .titles {
  background: url(../data/titles/tit-migrant.svg) center bottom no-repeat;background-size: contain;
}
#contact .titles {
  background: url(../data/titles/tit-contact.svg) center bottom no-repeat;background-size: contain;
}
#line .titles {
  background: url(../data/titles/tit-contact.svg) center bottom no-repeat;background-size: contain;
}
#contact.thanks .titles {
  background: url(../data/titles/tit-thanks.svg) center bottom no-repeat;background-size: contain;
}
.girlsstaff .titles {
  background: url(../data/titles/tit-recruit.svg) center bottom no-repeat;background-size: contain;
}
/* bg */
.bg-gradation{background: linear-gradient(135deg, rgba(255, 117, 140,1) 0%,rgba(255, 126, 179,1) 100%);}
.bg-gradation-s{background: linear-gradient(135deg, rgba(105, 184, 251,1) 0%,rgba(91, 212, 247,1) 100%);}
.bg-gradation-y{background: linear-gradient(135deg, rgba(252, 57, 76,1) 0%,rgba(253, 100, 69,1) 100%);}
.bg-gradation-t{background: linear-gradient(135deg, rgba(254, 150, 39,1) 0%,rgba(242, 192, 56,1) 100%);}

.bg-stripe{
  padding: 10rem 0;
  background-size: auto auto;background-color: transparent;background-image: repeating-linear-gradient(135deg, transparent, transparent 1rem, rgba(255, 124, 146, 1) 1rem, rgba(255, 124, 146, 1) 2rem);}
/* header */
header{
  padding: .8rem;
}
header h1{
  font-size: 1.4rem;font-weight: bold;line-height: 1;
}
header h1 span{
  font-size: 90%;font-weight: normal;
}
/* main */
main{overflow-x: hidden;}
/* section */
.inner{margin: 0 auto;}
@media screen and (max-width:999px){
  section{padding:10vw 8vw;}
  .inner{width: 100%;}
}
@media screen and (min-width:1000px){
  section{padding:10rem 0;}
  .inner{width:100rem;}
}

@media screen and (max-width: 999px){
  .top-migrant .inner {
    padding: 6rem 4rem;
  }
}
@media screen and (min-width: 1000px){
  .top-migrant .inner {
    padding: 10rem;
  }
}
.pt0 {padding-top: 0;}

/* text */
.primary {
  color: var(--color-primary);
}
.marker {
  background: linear-gradient(transparent 70%, var(--color-secondary) 0);
}
.underline {
  text-decoration: underline;
}
.inversion {
  background: var(--color-primary);
  color: var(--color-text-white);
}
.indent {
  text-indent: 1em;
}
/* more-btn */
.more-btn{margin-top: 6rem;}
.more-btn a{
  padding: 1em 1.6em;
  font-size: 1.6rem;font-weight: bold;
  border: solid 2px var(--color-border);border-radius: 8px;
  background-color: rgba(255, 255, 255, 1);background-image: repeating-linear-gradient(135deg, transparent, transparent .6rem, rgba(245, 245, 245, 1) .6rem, rgba(245, 245, 245, 1) 1.2rem );
  -webkit-transition: all .5s ease-out;transition: all .5s ease-out;
  position: relative;
}
.more-btn a:after{
  content: "";
  width: 0;height: 0;
  position: absolute;bottom: .6rem;right: .6rem;
  border-bottom: 1.4rem solid var(--color-primary);border-left: 1.4rem solid transparent;
}
.more-btn a:hover{}
.more-btn a:hover:before{}
.more-btn a:hover:after{}

/* accordion */

/* col-3 */
@media screen and (max-width:999px){
  .col-3 {
    max-width: 30rem; width: 80%;
    margin: 0 auto 3vw;
  }
  .col-3:last-of-type{margin-bottom: 0;}
}
@media screen and (min-width:1000px){
  .col-3 {
    width: calc(calc(100% - 3vw) / 3);
    margin-right: 1.5vw;
  }
  .col-3:last-of-type{margin-right: 0;}
}
/* hero-title */
.hero-title {
  position: relative;
}
.hero-title:before {
  position: relative;
}
.hero-title:after,section:not(.top-about) .hero-title:before {
  content: "";
  width: 100%;height: .8rem;
  position: absolute;left: 0;
  background-size: auto auto;
  background-image: repeating-linear-gradient(135deg, rgba(248, 45, 97, 1) , rgba(248, 45, 97, 1) .5rem, rgba(255, 255, 255, 1) .5rem, rgba(255, 255, 255, 1) 1rem);
}
.hero-title:before {
  top: 0;
}
.hero-title:after {
  bottom: 0;
}

/* nav-contact */
.nav-contact{
  position: relative;
}
.nav-contact h2 img {
  max-width: 60rem;
}
.nav-contact:after, .nav-contact:before {
  content: "";
  width: 100%;height: .8rem;
  position: absolute;left: 0;
  background-size: auto auto;
  background-image: repeating-linear-gradient(135deg, rgba(77, 210, 243, 1) , transparent .5rem, rgba(255, 255, 255, 1) .5rem, rgba(255, 255, 255, 1) 1rem);
}
.nav-contact:before {
  top: 0;
}
.nav-contact:after {
  bottom: 0;
}
/* nav-area */
@media screen and (max-width:999px){
  .nav-area {padding:10vw 8vw;}
}
@media screen and (min-width:1000px){
  .nav-area {padding:10rem 0;}
}
/* footer */
@media screen and (max-width:999px){
  footer .inner {padding: 10vw 8vw 15vw;}
}
@media screen and (min-width:1000px){
  footer > div {padding:10rem 0;}
}
@media screen and (max-width:999px){
  footer h4 {
    margin-bottom: 1rem;
    font-size: 1.8rem;text-align: center;
  }
}
@media screen and (min-width:1000px){
  footer h4 {
    padding: 0;
    margin-bottom: 2rem;
    font-size: 2.2rem;text-indent: 1em;
    border-left: solid .4rem var(--color-text-white);
  }
}
footer a{
  color: var(--color-text-white);
}
/* footer-contact */
@media screen and (max-width:999px){
  .footer-contact {
    max-width: 30rem;
    margin:10vw auto 1rem;
  }
}
@media screen and (min-width:1000px){
  .footer-contact {
    width: 34%;
    margin: 8rem 0 2rem 66%;
  }
}
@media screen and (max-width:999px){
  .footer-contact li:first-of-type {
    margin-bottom: 2%;
  }
  .footer-contact li:first-of-type a {
    font-size: 1.8rem;
  }
}
@media screen and (min-width:1000px){
  .footer-contact li:first-of-type {
    width: calc(100% - calc(4.8rem * 2));
    margin-left: 2%;
  }
  .footer-contact li:first-of-type a {
    font-size: 2.4rem;line-height: 1;letter-spacing: .2em;
  }
}
.footer-contact li:first-of-type span {
  letter-spacing: initial;
  display: block;
}
@media screen and (max-width:999px){
  .footer-contact li:first-of-type span {
    font-size: 80%;
  }
}
@media screen and (min-width:1000px){
  .footer-contact li:first-of-type span {
    font-size: 60%;
  }
}
.footer-contact li:not(:first-of-type) {
  width: 4.8rem;height: 4.8rem;
  margin-left: 2%;
}
.footer-contact li:not(:first-of-type) img {
  width: 4.8rem;height: 4.8rem;
}
/* footer-nav */
.footer-nav li:first-of-type:after {
  content:"|";
}
.footer-nav a {
  margin: 0 .4em;
  font-size: 80%;
}
.copy {
  margin-top: 4rem;
  font-size: 80%;
}
@media screen and (min-width:1000px){
  .copy {
    text-align: right;
  }
  .bnr-list .col-3 {
    margin-bottom: 1.5vw;
  }
  .bnr-list .col-3:nth-of-type(3n){
    margin-right: 0;
  }
}
/* floating-menu */
.floating-menu {
  width: 100%;height: 5rem;
  position: fixed;left: 0;bottom: 0;
  z-index: 900;
  background: var(--color-sapporo);
}
.floating-menu ul {
  width: 80%;max-width: 60rem;
  margin: .2rem auto;
}
.floating-menu li {
  width: calc(100% / 5);text-align: center;
}
.floating-menu li a {
  width: 4.6rem;height: 4.6rem;
  display: inline-block;
}
.floating-menu li .fa {
  padding-top: .8rem;
  font-size: 2.4rem;color: var(--color-text-white);
}
/* drawer */
.drawer {
  position: relative;
}
.toggle {
  padding: .8rem .6rem;
  cursor: pointer;
}
.toggle span {
  width: 3.4rem;height: .3rem;
  display: block;
  position: relative;
  background: var(--color-text-white);
  -webkit-transition: ease .3s;transition: ease .3s;
}
.toggle span:nth-of-type(1){
  top: 0;
}
.toggle span:nth-of-type(2){
  margin: .9rem 0;
}
.toggle span:nth-of-type(3){
  top: 0;
}
.toggle.open span:nth-of-type(1){
  top: 1.2rem;
  -webkit-transform: rotate(45deg);transform: rotate(45deg);
}
.toggle.open span:nth-of-type(2){
  -webkit-transform: translateY(-50%);transform: translateY(-50%);
  opacity: 0;
}
.toggle.open span:nth-of-type(3){
  top: -1.2rem;
  -webkit-transform: rotate(-45deg);transform: rotate(-45deg);
}
.gnav {
  width: 90%;max-width: 60rem;height:calc(100% - 5rem);
  position:fixed;left:-100%;top:0;
  -webkit-transition:ease .5s;transition:ease .5s;
  z-index:1000;
  background: rgba(255, 172, 186, 1);
  font-size: 90%;
}
.gnav.open {
  width: 90%;max-width: 60rem;height:calc(100% - 5rem);
  left: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.gnav > ul {
}
.gnav li {
  text-indent: 1em;color: var(--color-text-white);
  border-bottom:1px solid var(--color-text-white);
}
.gnav li a {
  display: block;
  color: var(--color-text-white);line-height: 4rem;
}
.gnav .submenu li {
  text-indent: 1em;
  border-bottom: none;
  background: var(--color-tertiary);
}
.gnav .submenu li a {
  color: var(--color-text);
}
.gnav .submenu li .fa {
  padding-right: .6em;
  color: var(--color-primary);
}
.gnav .bnr {
  width: 80%;
  margin: 2rem auto;
}