@charset "UTF-8";
/* CSS Document */

/* 基本設定 */
body {
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Helvetica, Arial, Verdana, sans-serif;
}

.text-orange-1000 {
  color: #ff6b00;
}
.text--underline {
  background: linear-gradient(transparent 52%, #ffff00 0%);
  font-weight: bold;
}
.bg-wv-orange {
  background-color: #ff6b00;
}
.bg-black-900 {
  background-color: #333333;
}
.bg-black-800 {
  background-color: #242424;
}
.phonenumber__text {
  font-family: "Oswald", sans-serif;
}

/* FY24 */
/* 漫画 */
.chosen-fy24__comic--number {
  background-color: rgba(0, 0, 0, 0.562);
  border-radius: 9999px;
  padding: 0.2rem 0.5rem;
}
/* ワールドビジョンとは */
.thousand-girls-fy24__worldvision--container {
  background-color: #ff6b00;
}
.thousand-girls-fy24__worldvision--container::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 500px;
  background-color: #f3f4f6;
}
@media screen and (min-width: 768px) {
  .thousand-girls-fy24__worldvision--container::before {
    height: 450px;
  }
}
/* 交流 */
.chosen-fy24__exchange--container::before {
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  height: 930px;
  background-color: #fff;
}
@media screen and (min-width: 768px) {
  .chosen-fy24__exchange--container::before {
    height: 450px;
  }
}
/* コンセプト */
.chosen-fy24__concept {
  position: relative;
  background: #fff0e5;
}
.chosen-fy24__concept::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 20%;
  height: 100%;
  background-color: #fff;
}
/* カウンター棒グラフ */
/*------------------------------------
  bar graph
------------------------------------*/
.chosen-fy24__bar-graph-wrap {
  position: relative;
  height: 50px;
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  background-color: #e6edf3;
  border-radius: 4px;
}
.chosen-fy24__bar-graph-wrap .graph {
  height: 50px;
  position: absolute;
  left: 0;
  border-radius: 0 4px 4px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 10px; /*
	  -webkit-animation: graphAnim 2.5s forwards;
			  animation: graphAnim 2.5s forwards;*/
}
.active {
  -webkit-animation: graphAnim 2.5s forwards;
  animation: graphAnim 2.5s forwards;
}

.chosen-fy24__bar-graph-wrap .graph span {
  font-size: 14px;
  color: #ffffff;
}
@media screen and (max-width: 750px) {
  .chosen-fy24__bar-graph-wrap .graph span {
    font-size: 12px;
  }
}
.chosen-fy24__bar-graph-wrap .graph.bar-orange {
  /*background: #ff6b00;*/
  background: rgb(255, 107, 0);
  background: linear-gradient(180deg, rgba(255, 107, 0, 1) 0%, rgba(255, 84, 0, 1) 100%);
  width: 96%; /* 数字修正箇所 */
}

@-webkit-keyframes graphAnim {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes graphAnim {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
/* 概要 */
.chosen-fy24__summary {
  background: url(../img/chosen-fy24_summary_bg_sp.jpg) no-repeat center/cover;
  padding-top: 33rem;
  padding-bottom: 33rem;
}
.chosen-fy24__summary--img-01 {
  position: absolute;
  right: 0;
  top: -60%;
  width: 48%;
}
.chosen-fy24__summary--img-02 {
  position: absolute;
  left: 0;
  top: -55%;
  width: 32%;
}
.chosen-fy24__summary--img-03 {
  position: absolute;
  right: 0;
  top: -33%;
  width: 36%;
}
.chosen-fy24__summary--img-04 {
  position: absolute;
  left: 0;
  top: -35%;
  width: 37%;
}
.chosen-fy24__summary--img-05 {
  position: absolute;
  left: 29%;
  top: -16%;
  width: 22%;
}
.chosen-fy24__summary--img-06 {
  position: absolute;
  left: 0;
  top: 106%;
  width: 34%;
}
.chosen-fy24__summary--img-07 {
  position: absolute;
  right: 0;
  top: 102%;
  width: 39%;
}
.chosen-fy24__summary--img-08 {
  position: absolute;
  left: 18%;
  top: 120%;
  width: 37%;
}
.chosen-fy24__summary--img-09 {
  position: absolute;
  right: 0;
  top: 134%;
  width: 41%;
}
.chosen-fy24__summary--img-10 {
  position: absolute;
  left: 10%;
  top: 147%;
  width: 21%;
}
@media screen and (min-width: 768px) {
  .chosen-fy24__summary {
    background: url(../img/chosen-fy24_summary_bg_pc.jpg) no-repeat center/cover;
    padding-top: 8rem;
    padding-bottom: 8rem;
  }
  .chosen-fy24__summary--img-01 {
    position: absolute;
    left: 15%;
    top: -7%;
    width: 14%;
  }
  .chosen-fy24__summary--img-02 {
    position: absolute;
    left: 2%;
    top: 10%;
    width: 10%;
  }
  .chosen-fy24__summary--img-03 {
    position: absolute;
    left: 10%;
    top: 26%;
    width: 13%;
  }
  .chosen-fy24__summary--img-04 {
    position: absolute;
    left: 5%;
    top: 72%;
    width: 11%;
  }
  .chosen-fy24__summary--img-05 {
    position: absolute;
    left: 19%;
    top: 79%;
    width: 7%;
  }
  .chosen-fy24__summary--img-06 {
    position: absolute;
    right: 19%;
    top: -10%;
    width: 10%;
    left: auto;
  }
  .chosen-fy24__summary--img-07 {
    position: absolute;
    right: 2%;
    top: 6%;
    width: 11%;
    left: auto;
  }
  .chosen-fy24__summary--img-08 {
    position: absolute;
    right: 14%;
    top: 36%;
    width: 12%;
    left: auto;
  }
  .chosen-fy24__summary--img-09 {
    position: absolute;
    right: 2%;
    top: 61%;
    width: 13%;
    left: auto;
  }
  .chosen-fy24__summary--img-10 {
    position: absolute;
    right: 20%;
    top: 89%;
    width: 7%;
    left: auto;
  }
}
/* ヒーローイメージ */
.chosen-fy24__hero-image--container {
  position: relative;
  background-color: #ff6b00;
  z-index: 0;
  height: 550px;
}
.chosen-fy24__hero-image--container::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 70%;
  background-color: #fff;
  z-index: -1;
}
.chosen-fy24__header-movie {
  width: 92%;
  height: 550px;
  background: url(../img/chosen-fy24_header-movie_bg_sp_01.jpg) no-repeat center/cover;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  overflow: hidden;
  z-index: -1;
}
.chosen-fy24__header-movie::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 550px;
  background-color: rgba(0, 0, 0, 0.2);
  background-image: radial-gradient(#111 30%, transparent 31%), radial-gradient(#111 30%, transparent 31%);
  background-size: 4px 4px;
  background-position: 0 0, 2px 2px;
  /*border-radius: 0.75rem;*/
}
.chosen-fy24__header-movie video {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%) scale(0.59);
  /*border-radius: 0.75rem;*/
}
.chosen-fy24__mv {
  position: relative;
  height: 550px;
}
.chosen-fy24__logo--container img {
  position: absolute;
  top: 3%;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.chosen-fy24__heading--container img {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: 3%;
}
.chosen-fy24__play-bottom--container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 768px) {
  .chosen-fy24__hero-image--container {
    height: 76vh;
  }
  .chosen-fy24__hero-image--container::before {
    width: 100%;
  }
  .chosen-fy24__header-movie {
    min-width: 960px;
    width: 95%;
    height: 76vh;
    background: url(../img/chosen-fy24_header-movie_bg_pc_01.jpg) no-repeat center/cover;
  }
  .chosen-fy24__header-movie::after {
    height: 76vh;
  }
  .chosen-fy24__mv {
    min-width: 960px;
    height: 76vh;
  }
  .chosen-fy24__logo--container img {
    position: absolute;
    top: 4%;
    left: 6%;
    margin: 0;
  }
  .chosen-fy24__heading--container img {
    position: absolute;
    left: 4%;
    bottom: 4%;
    margin: 0;
  }
  .chosen-fy24__play-bottom--container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .chosen-fy24__header-movie video {
    transform: translateX(-50%) translateY(-50%) scale(0.94);
    /*border-radius: 0.75rem;*/
  }
}
.pulse {
  animation: pulse 3s infinite;
  -webkit-animation: pulse 3s infinite;
}

@keyframes pulse {
  0% {
    transform: scale(0.9) translate(9px, 7px);
  }
  50% {
    transform: scale(1) translate(0px, 0px);
  }
  100% {
    transform: scale(0.9) translate(9px, 7px);
  }
}

/* FY23 */
.chosen__mv--fy23-april {
  width: 100%;
  height: 400px;
  display: block;
  right: 0;
  top: 0;
  z-index: 10;
  background-image: url(../img/chosen_mv_fy23-04_sp.jpg);
}
.chosen__heading-group--fy23-april {
  display: block;
  left: 0;
  top: 24px;
  z-index: 20;
}
.chosen__hero--fy23-april {
  z-index: 1;
  position: relative;
  padding-top: 0;
}
.chosen__hero--fy23-april::before {
  content: "";
  right: 0;
  top: 0;
  width: 100vw;
  display: block;
  position: absolute;
  z-index: -1;
  height: 640px;
  background: #fff5ec;
}
.chosen__hero-container--fy23-april {
  display: block;
  height: 640px;
}
@media screen and (min-width: 768px) {
  .chosen__mv--fy23-april {
    width: 60%;
    height: 40vw;
    display: block;
    right: 0;
    top: 0;
    z-index: 10;
    background-image: url(../img/chosen_mv_fy23-04_pc.jpg);
  }
  .chosen__heading-group--fy23-april {
    display: block;
    left: 50px;
    top: 0px;
    z-index: 20;
  }
  .chosen__hero-container--fy23-april {
    display: block;
    height: 40vw;
  }
  .chosen__hero--fy23-april {
    z-index: 1;
    position: relative;
    padding-top: 40px;
  }
  .chosen__hero--fy23-april::before {
    content: "";
    right: 40%;
    top: 0px;
    width: 100vw;
    display: block;
    position: absolute;
    z-index: -1;
    height: 40vw;
    background: #fff5ec;
  }
}
@media screen and (min-width: 1536px) {
  .chosen__hero--fy23-april::before {
    height: 38vw;
  }
}
.chosen__heading2-container--fy23-april {
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 11%, rgba(255, 245, 236, 1) 11%, rgba(255, 245, 236, 1) 100%);
}
.chosen__ico--feature {
  width: 14%;
}
@media screen and (min-width: 768px) {
  .chosen__ico--feature {
    width: 10%;
  }
}
.chosen__story-container--after {
  background: rgb(243, 244, 246);
  background: linear-gradient(180deg, rgba(243, 244, 246, 1) 0%, rgba(243, 244, 246, 1) 30%, rgba(255, 245, 236, 1) 30%, rgba(255, 245, 236, 1) 100%);
}
.chosen__story-container--before {
  background: rgb(243, 244, 246);
  background: linear-gradient(180deg, rgba(243, 244, 246, 1) 0%, rgba(243, 244, 246, 1) 30%, rgba(235, 235, 235, 1) 30%, rgba(235, 235, 235, 1) 100%);
}
@media screen and (min-width: 768px) {
  .chosen__story-container--after {
    background: rgb(243, 244, 246);
    background: linear-gradient(180deg, rgba(243, 244, 246, 1) 0%, rgba(243, 244, 246, 1) 50%, rgba(255, 245, 236, 1) 50%, rgba(255, 245, 236, 1) 100%);
  }
  .chosen__story-container--before {
    background: rgb(243, 244, 246);
    background: linear-gradient(180deg, rgba(243, 244, 246, 1) 0%, rgba(243, 244, 246, 1) 50%, rgba(235, 235, 235, 1) 50%, rgba(235, 235, 235, 1) 100%);
  }
}
.chosen__voice-container--fy23-april {
  background: rgb(255, 255, 255);
  background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 20%, rgba(249, 250, 251, 1) 20%, rgba(249, 250, 251, 1) 100%);
}
@media screen and (min-width: 768px) {
  .chosen__voice-container--fy23-april {
    background: rgb(255, 255, 255);
    background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(249, 250, 251, 1) 50%, rgba(249, 250, 251, 1) 100%);
  }
}
.chosen__step-container--fy23-april {
  background: rgb(250, 107, 0);
}
.chosen__step-article-container--fy23-april {
  width: 100%;
  margin-right: 0;
}
.chosen__step-article-container--fy23-april:nth-of-type(4) {
  margin-right: 0;
}
.chosen__step-article-container--fy23-april h3 {
  color: #fff;
}
.chosen__step-article-container--fy23-april p {
  color: #fff;
}
@media screen and (min-width: 768px) {
  .chosen__step-article-container--fy23-april {
    width: 23%;
    margin-right: 2%;
  }
  .chosen__step-article-container--fy23-april:nth-of-type(4) {
    margin-right: 0;
  }
  .chosen__step-container--fy23-april {
    background: rgb(250, 107, 0);
    background: linear-gradient(180deg, rgba(250, 107, 0, 1) 0%, rgba(250, 107, 0, 1) 45%, rgba(249, 250, 251, 1) 45%, rgba(249, 250, 251, 1) 100%);
  }
  .chosen__step-article-container--fy23-april h3 {
    color: #ff6b00;
  }
  .chosen__step-article-container--fy23-april p {
    color: #000;
  }
}

/* 動画背景 */
.chosen-video__conatainer {
  background-image: url(../img/chosen_child-letters_sp.png);
}
@media screen and (min-width: 768px) {
  .chosen-video__conatainer {
    background-image: url(../img/chosen_child-letters.png);
  }
}

/* 3 カラム */
.news__flex-container--three {
  width: 100%;
  margin-right: 0;
}
@media screen and (min-width: 768px) {
  .news__flex-container--three {
    width: 32%;
    margin-right: 2%;
  }
  .news__flex-container--three:nth-of-type(3n) {
    margin-right: 0;
  }
}

@media screen and (min-width: 768px) {
  .chosen-story__container {
    width: 32%;
    margin-right: 2%;
  }
  .chosen-story__container:nth-of-type(3n) {
    margin-right: 0;
  }
}

/* よくある質問 */
input {
  position: absolute;
  opacity: 0;
  z-index: -1;
  padding: 0;
  line-height: 1em;
}

/* Accordion styles */
.tabs {
  overflow: hidden;
}

.tab {
  width: 100%;
  color: #000;
  overflow: hidden;
  margin-bottom: 14px;
  border-top: 1px solid #ff6600;
}
.tab-label {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  padding: 1em 1em 1em 3.5em !important;
  line-height: 1em !important;
  /*background: #2c3e50;*/
  font-weight: bold;
  cursor: pointer;
  /* Icon */
  background: #fff2e5 url(../img/ico_question.png) no-repeat 10px 10px;
}
.tab h3 {
  padding: 0;
  margin-bottom: 0;
  line-height: 1em;
  color: #000;
}
.tab-label:hover {
  color: #ff6600;
  /* Icon */
  background: #fff2e5 url(../img/ico_question.png) no-repeat 10px 10px;
}
.tab-label::after {
  content: "\276F";
  width: 1em;
  height: 1em;
  text-align: center;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}
.tab-content {
  max-height: 0;
  padding: 0 1em 0 3.5em;
  color: #2c3e50;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
  /* Icon */
  background: #fbfbfb url(../img/ico_answer.png) no-repeat 10px 10px;
  overflow: hidden;
}
.tab-close {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  padding: 1em;
  font-size: 0.75em;
  background: #2c3e50;
  cursor: pointer;
}
.tab-close:hover {
  background: #1a252f;
}

input:checked + .tab-label {
  background: #fff2e5;
  /* Icon */
  background: url(../img/ico_question.png) no-repeat 10px 10px;
}
input:checked + .tab-label::after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
input:checked ~ .tab-content {
  max-height: 200vh;
  padding: 1em 1em 1em 3.5em;
}