@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;
}

/* カウンター棒グラフ */

/*------------------------------------
  bar graph
------------------------------------*/
.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;
  }
  .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;
  }

  .bar-graph-wrap .graph span {
	font-size: 14px;
	color: #ffffff;
  }
  @media screen and (max-width: 750px) {
	.bar-graph-wrap .graph span {
	  font-size: 12px;
	}
  }
  .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: 97%;/* 数字修正箇所 */ 
  }
  
  @-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);
	}
  }

/* ワールドビジョンとは */
.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;
	}
}

/* スタッフメッセージ */
.thousand-girls-fy24__staff-message--container {
	background-color: #fff;
}
@media screen and (min-width: 768px) {
	.thousand-girls-fy24__staff-message--container {
		background-color: #FFEBDC;
	}
	.thousand-girls-fy24__staff-message--container::before {
		position: absolute;
		content: '';
		bottom: 0;
		right: 0;
		width: 38%;
		height: 100%;
		background-color: #fff;
	}
}

/* ストーリー */
.thousand-girls-fy24__story--container {
	background-color: #FFEBDC;
}
@media screen and (min-width: 768px) {
	.thousand-girls-fy24__story--container::before {
		position: absolute;
		content: '';
		bottom: 0;
		left: 0;
		width: 38%;
		height: 100%;
		background-color: #fff;
	}
}

/* チャイルド・スポンサーシップ */
.thousand-girls-fy24__childsponsor--container::before {
	position: absolute;
	content: '';
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1170px;
	background-color: #fff;
}
@media screen and (min-width: 768px) {
	.thousand-girls-fy24__childsponsor--container::before {
		height: 450px;
	}
}

/* 動画 */
.thousand-girls-fy24__movie--container {
	background-color: #03accb;
}

/* 概要 */
.thousand-girls-fy24__summary--container {
	background-image: url(../img/1000girls-fy24_summary_bg_sp.jpg);
	background-size: cover;
}
@media screen and (min-width: 768px) {
	.thousand-girls-fy24__summary--container {
		background-image: url(../img/1000girls-fy24_summary_bg_pc.jpg);
		background-position: center;
	}
}

/* ヒーローイメージ */
.thousand-girls-fy24__hero-image--img {
}
.thousand-girls-fy24__logo--container {
	position: absolute;
	top: 48%;
	left: 50%;
	transform: translateX(-50%);
	width: 46%;
}
.thousand-girls-fy24__logo--img {
	width: 100%;
}
.thousand-girls-fy24__heading--container {
	position: absolute;
	top: 66%;
	left: 50%;
	transform: translateX(-50%);
	width: 80%;
}
.thousand-girls-fy24__heading-2--img {
	width: 100%;
	margin-bottom: 8%;
}
.thousand-girls-fy24__heading-3--img {
	width: 100%;
}

@media screen and (min-width: 768px) {
	.thousand-girls-fy24__hero-image--img {
		margin-left: 25%;
	}
	.thousand-girls-fy24__hero-image--container {
		background-color: #FF6B00;
	}
	.thousand-girls-fy24__hero-image--container::before {
		position: absolute;
		content: '';
		top: 0;
		left: 0;
		width: 100%;
		height: 36%;
		background-color: #fff;
	}
	.thousand-girls-fy24__logo--container {
		position: absolute;
		top: 5%;
		left: 10%;
		transform: translateX(0);
		width: 90%;
	}
	.thousand-girls-fy24__logo--img {
		width: 18%;
	}
	.thousand-girls-fy24__heading--container {
		position: absolute;
		top: 44%;
		left: 10%;
		transform: translateX(0);
		width: 90%;
	}
	.thousand-girls-fy24__heading-2--img {
		width: 30%;
		margin-bottom: 2%;
	}
	.thousand-girls-fy24__heading-3--img {
		width: 28%;
	}
	.thousand-girls-fy24__hero-image-cta--container::before {
		position: absolute;
		content: '';
		top: 0;
		right: 0;
		width: 15%;
		height: 100%;
		background-color: #fff;
	}
}






.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;
	}
}

.benefits__container {
	background-image: url(../img/chosen_bg-benefit_fy23_sp.jpg);
}
@media screen and (min-width: 768px) {
.benefits__container {
	background-image: url(../img/chosen_bg-benefit_fy23_pc.jpg);
	}
}


/* よくある質問 */
input {
    position: absolute;
    opacity: 0;
    z-index: -1;
    padding: 0;
    line-height: 1.0em;
  }
  
  
  /* 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: 1.0em !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: 1.0em;
    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;
  }

