@charset "utf-8";

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */
#pageTit {
  text-align: center;
}
/* 創始者 */
/* -------------------------------------------------- */
#secretstory1 {
  padding: 100px 5% 100px;
  margin-bottom: 100px;
  background: #122c58;
  /* display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center; */
}

#talkTitWrap {
  /* width: 30%; */
  margin-bottom: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

#talkTit {
  padding: 30px;
  border-top: 1px #3565b6 solid;
  border-bottom: 1px #3565b6 solid;
  color: #fff;
  /* -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl; */
  font-size: 4rem;
  text-align: center;
}

#talkTit::before {
  content: "";
  /* padding-bottom: 20px; */
  width: 134px;
  height: 62px;
  background: url(../../../img/secretstory/secretstory_bg.svg) 0 0 no-repeat;
  display: inline-block;
  vertical-align: middle;
}

#talkTit::after {
  content: "";
  /* padding-top: 20px; */
  width: 134px;
  height: 62px;
  background: url(../../../img/secretstory/secretstory_bg.svg) 0 0 no-repeat;
  display: inline-block;
  vertical-align: middle;
}

#talkTit span {
  padding: 0 5px;
  display: inline-block;
  vertical-align: middle;
}

#talkImg {
  margin: auto;
  width: 70%;
}

#talkImg img {
  width: 100%;
  height: auto;
}

@media screen and (max-width: 1250px) {
  #talkTit {
    font-size: 3rem;
  }
}

/* 秘話詳細 */
/* -------------------------------------------------- */
#secretstory2 {
  width: 1200px;
  max-width: 96%;
  margin: 0 auto;
  padding-bottom: 140px;
}

.story {
  padding-bottom: 100px;
}

.storyTit {
  padding-bottom: 20px;
  margin-bottom: 40px;
  font-size: 4rem;
  font-weight: bold;
  border-bottom: 5px #122c58 solid;
  color: #122c58;
}

.story1::before {
  content: "STORY1";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.story2::before {
  content: "STORY2";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.story3::before {
  content: "STORY3";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.story4::before {
  content: "STORY4";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.story5::before {
  content: "STORY5";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.story6::before {
  content: "STORY6";
  display: block;
  font-size: 1.8rem;
  color: #122c58;
  letter-spacing: 0.2em;
}

.storyContent {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.storyContent .img {
  width: 50%;
}

.storyContent .img img {
  width: 100%;
  height: auto;
}

.storyContent .txt {
  width: 50%;
  padding: 0 5%;
  font-size: 1.6rem;
}

.storyContent .txt p {
  padding-bottom: 1em;
}

.anno {
  padding: 30px;
  border: 1px #dcdcdc solid;
  font-size: 1.3rem;
}

.anno li {
  padding-bottom: 10px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.anno li:last-child {
  padding-bottom: 0;
}

.anno li .tit {
  white-space: nowrap;
}

#secretstory3 {
  padding: 100px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

#secretstory3 img {
	width: 100%;
	height: auto;
}

/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (max-width: 1024px) {
  #secretstory1 {
    padding: 50px 5%;
    margin-bottom: 80px;
  }

  #talkTitWrap {
    margin-bottom: 20px;
  }

  #talkTit {
    padding: 10px;
    font-size: 2rem;
  }

  #talkTit::before {
    width: 70px;
    height: 30px;
    -webkit-background-size: contain;
    background-size: contain;
  }

  #talkTit::after {
    padding-top: 0;
    width: 70px;
    height: 30px;
    -webkit-background-size: contain;
    background-size: contain;
  }

  #talkImg {
    width: 100%;
    padding: 0 10px;
  }

  /* 秘話詳細 */
  /* -------------------------------------------------- */
  #secretstory2 {
    width: 100%;
    padding: 0 5%;
  }

  .story {
    padding-bottom: 80px;
  }

  .storyTit {
    padding-bottom: 10px;
    margin-bottom: 30px;
    font-size: 2.4rem;
  }

  .story1::before {
    font-size: 1.4rem;
  }

  .story2::before {
    font-size: 1.4rem;
  }

  .story3::before {
    content: "STORY3";
    font-size: 1.4rem;
  }

  .story4::before {
    font-size: 1.4rem;
  }

  .story5::before {
    font-size: 1.4rem;
  }

  .story6::before {
    font-size: 1.4rem;
  }

  .storyContent {
    display: block;
  }

  .storyContent .img {
    width: 100%;
    margin-bottom: 15px;
  }

  .storyContent .txt {
    width: 100%;
    padding: 0;
  }

  #secretstory3 {
		padding: 30px 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
/*
		background: url(../../img/secretstory/secretstory_img11.jpg) center 0 no-repeat;
		-webkit-background-size: cover;
		background-size: cover;
*/
	}
	
	#secretstory3 .img {
		width: 40%;
	}
	
	#secretstory3 .img img {
		width: 100%;
	}
}

/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {
}
/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {
}

@media screen and (max-width: 480px) {
  #talkTit span {
    padding: 5px 0;
  }
  #talkTit::before,
  #talkTit::after {
    display: block;
    margin: auto;
  }
}