@charset "utf-8";
/***************************************************************************************************
	page_culture.css
***************************************************************************************************/
/*  */
#header::before {
  background-color:#f3f3f3 ;
}
/*  */
.blk_hd_bk {
  position:fixed;
	display: block;
	width: 100%;
	height: auto;
	left:0;
	top:0;
	background-image: url('../images/culture_img_1_2.jpg');
	background-position: 50% 20%;
	background-size: 100% auto;
  padding:30% 0 0 0;
  z-index: 1;
}
.blk_hd_bk::after {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
	height: 100%;
	left:0;
	top:0;
	background-color: #f3f3f3;
}
.blk_hd_bk.nm_tgt_psa::after {
  opacity:1;
}
.blk_hd_bk.nm_tgt_psa.psa_show::after {
  animation:kf_blk_hd_bk_a1 .8s 0s 1 normal both;
}
@keyframes kf_blk_hd_bk_a1 {
  100% {opacity: 0;}
}
/*  */
body {
  background-color: #f3f3f3;
}
/*
*/
#page_culture {
  width:100%;
  z-index: 2;
  background-color: #f3f3f3;
  margin-top: 30%;
  overflow: visible;
}
#page_culture::before {
	position: absolute;
	display: block;
	content: '';
	width: 100%;
	height: 30px;
	left:0;
	top:-29px;
	background-color: #f3f3f3;
}
/*
*/
#page_culture .blk_1 {
  width:100%;
  text-align: center;
}
/*  */
#page_culture .blk_1 .gsty_tit_1 {
	width: var(--tgt_wid_1);
	max-width: var(--max_wid_1);
  margin: auto;
  text-align: left;
  z-index: 3;
}
#page_culture .blk_1 .gsty_tit_1 > span:nth-of-type(1) {
  width:160px;
}
/*  */
#page_culture .blk_1_1 {
	width: var(--tgt_wid_1);
	max-width: var(--max_wid_1);
  margin: auto;
}
#page_culture .blk_1 .gsty_blk_scroll {
  left:100%;
  top:-120px;
  z-index: 2;
}
#page_culture .blk_1 .gsty_blk_scroll {
  left:100%;
  top:-120px;
  z-index: 2;
}
#page_culture .blk_1 .gsty_blk_scroll.nm_tgt_psa {
  opacity:0;
  transform:translateY(-30px);
}
#page_culture .blk_1 .gsty_blk_scroll.nm_tgt_psa.psa_show {
  animation:kf_psa_1 .8s .4s 1 normal both;
}
/*
*/
#page_culture .blk_2 {
	width: var(--tgt_wid_1);
	max-width: var(--max_wid_1);
  margin: auto;
  padding:100px 0 0 0;
}
#page_culture .blk_2 > section {
  width:100%;
}
#page_culture .blk_2 h3 {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 700;
  padding:0 0 30px 0;
}
#page_culture .blk_2 h3.nm_tgt_psa {
  opacity:0;
  transform:translateY(30px);
}
#page_culture .blk_2 h3.nm_tgt_psa.psa_show {
  animation:kf_psa_1 .6s 0s 1 normal both;
}
/*  */
#page_culture .blk_2_1 {
  display:flex;
  width:100%;
  justify-content: space-between;
}
#page_culture .blk_2_1_1,
#page_culture .blk_2_1_2 {
  width:48%;
  border-top:1px solid #929292;
  border-bottom:1px solid #929292;
}
#page_culture .blk_2_1_1.nm_tgt_psa,
#page_culture .blk_2_1_2.nm_tgt_psa {
  opacity:0;
  transform:translateY(40px);
}
#page_culture .blk_2_1_1.nm_tgt_psa.psa_show,
#page_culture .blk_2_1_2.nm_tgt_psa.psa_show {
  animation:kf_psa_1 .6s 0s 1 normal both;
}
#page_culture .blk_2_1_2.nm_tgt_psa.psa_show {
  animation-delay: .2s;
}
#page_culture .blk_2_1 ul {
  display:block;
  width:100%;
  list-style: none;
  padding:30px 0 30px 0;
}
#page_culture .blk_2_1 ul li {
  display:block;
  padding:0 0 15px 15px;
  font-size:16px;
  line-height: 1.5;
  font-weight: 700;
}
/*
*/
#page_culture .blk_3 {
	width: var(--tgt_wid_1);
	max-width: var(--max_wid_1);
  margin: auto;
  padding:120px 0 0 0;
  
}
#page_culture .blk_3 > section {
	width: 100%;
}
#page_culture .blk_3 h3 {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 700;
  height: 80px;
}
#page_culture .blk_3 .nm_tgt_psa h3 {
  opacity:0;
  transform:translateY(30px);
}
#page_culture .blk_3 .nm_tgt_psa.psa_show h3 {
  animation:kf_psa_1 .6s 0s 1 normal both;
}
/*  */
#page_culture .blk_3_1 {
  width: 100%;
  max-width:600px;
  margin: auto;
}
#page_culture .nm_tgt_psa  .blk_3_1{
  opacity:0;
  transform:translateY(40px);
}
#page_culture .nm_tgt_psa.psa_show .blk_3_1 {
  animation:kf_psa_1 .8s 0s 1 normal both;
}
#page_culture .blk_3_1::before {
  display:block;
  content:'';
  padding:67% 0 0 0;
}
#page_culture .blk_3.single_pht .blk_3_1::before {
  display: none;
}
#page_culture .blk_3_1 ul {
  width: 100%;
  list-style:none;
}
#page_culture .blk_3_1 ul li {
  width: 100%;
  left:0;
  top:0;
  position: absolute;
  display: block;
}
#page_culture .blk_3_1 ul li img {
  width: 100%;
  display:block;
}
#page_culture .blk_3.single_pht .blk_3_1 ul li {
  display: none;
}
#page_culture .blk_3.single_pht .blk_3_1 ul li:first-child {
  display: block;
  position: relative;
}
/*  */
#page_culture .blk_3_1 .blk_js_ss {
  position: absolute;
  width: 100%;
  height: 100%;
  left:0;
  top:0;
  overflow:hidden;
}
#page_culture .blk_3_1 .blk_js_ss .deck img {
  display:block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*  */
#page_culture .blk_3_2 {
  position: absolute;
  width:100%;
  max-width:600px;
  height:auto;
  left:50%;
  top:80px;
  transform:translateX(-50%);
}
#page_culture .blk_3.single_pht .blk_3_2 {
  display: none;
}
#page_culture .nm_tgt_psa .blk_3_2 {
  opacity:0;
}
#page_culture .nm_tgt_psa.psa_show .blk_3_2 {
  animation:kf_blk_3_2_a1 .6s .2s 1 normal both;
}
@keyframes kf_blk_3_2_a1 {
  100% {opacity: 1;}
}
/*  */
#page_culture .blk_3_2 .blk_circle {
	position: absolute;
  width:100px;
  height:100px;
  left:calc(100% - 100px);
  top:-50px;
}
#page_culture .blk_3_2 .blk_circle::after {
	position: absolute;
	display: block;
	content: attr(data-num);
	left:50%;
	top:calc(50% + 5px);
  transform:translate(-50%, -50%);
  font-size:30px;
  line-height: 1;
  font-family: 'Hind Guntur', sans-serif;
  font-weight: 500;
  letter-spacing: .1em;
}
#page_culture .blk_3_2 .blk_circle.hide::after {
  opacity:0;
  transition:opacity .4s ease-out 0s;
}
#page_culture .blk_3_2 .blk_circle.show::after {
  opacity:1;
  transition:opacity .4s ease-out .2s;
}
#page_culture .blk_3_2 .blk_circle svg {
  width:100%;
  height:100%;
  transform:rotate(-90deg);
}
#page_culture .blk_3_2 .blk_circle.anim_1 svg {
  transform:rotate(0deg);
  transition:transform .4s ease-out 0s;
}
#page_culture .blk_3_2 .blk_circle.anim_2 svg .c_2 {
  /* transform:rotate(-90deg); */
}
#page_culture .blk_3_2 .blk_circle svg .c_1 {
  fill:transparent;
  stroke-width:1;
  stroke: #333333;
}
#page_culture .blk_3_2 .blk_circle svg .c_2 {
  stroke: teal;
  stroke-width: 3px;
  fill: transparent;
  stroke-dasharray: 315%;
  stroke-dashoffset: 236.25%;
  stroke: #000000;
}
#page_culture .blk_3_2 .blk_circle.anim_1 svg .c_2 {
  animation:kf_blk_circle_1 .4s ease 0s both;
}
#page_culture .blk_3_2 .blk_circle.anim_2 svg .c_2 {
  animation:kf_blk_circle_2 .4s ease .2s both;
}
@keyframes kf_blk_circle_1 {
  0%{stroke-dashoffset:236.25%;}
  100%{stroke-dashoffset:315%;}
}
@keyframes kf_blk_circle_2 {
  0%{stroke-dashoffset:315%;}
  100%{stroke-dashoffset:236.25%;}
}
@keyframes kf_blk_circle_1_ {
  0%{stroke-dashoffset:236.25%;}
  45%{stroke-dashoffset:315%;}
  55%{stroke-dashoffset:315%;}
  100%{stroke-dashoffset:236.25%;}
}
/*  */
#page_culture .blk_3_3 {
  position: absolute;
  width:100%;
  max-width:600px;
  height: auto;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  z-index: 3;
}
#page_culture .blk_3.single_pht .blk_3_3 {
  display: none;
}
#page_culture .nm_tgt_psa .blk_3_3 {
  opacity:0;
  pointer-events: none;
}
#page_culture .nm_tgt_psa.psa_show .blk_3_3 {
  animation:kf_blk_3_3_a1 .6s .2s 1 normal both;
}
@keyframes kf_blk_3_3_a1 {
  100% {opacity: 1; pointer-events: auto;}
}
#page_culture .blk_3_3 .blk_btns {
	position: absolute;
	left:0;
	top:-34px;
	width: 90px;
	height: 100px;
}
#page_culture .blk_3_3 .blk_btns .btn_prev,
#page_culture .blk_3_3 .blk_btns .btn_next {
	position: absolute;
	width: 45px;
	height: 45px;
	left:0;
	top:10px;
	cursor: pointer;
}
#page_culture .blk_3_3 .blk_btns .btn_next {
	left:calc(100% - 45px);
	transform: scaleX(-1);
}
#page_culture .blk_3_3 .blk_btns .btn_prev::after,
#page_culture .blk_3_3 .blk_btns .btn_next::after {
	position: absolute;
	display: block;
	content: '';
	width: 20px;
	height: 20px;
	left:7px;
	top:23px;
	border-top: 1px solid #313131;
	border-left: 1px solid #313131;
	transform-origin: 0 0;
	transform: rotate(-45deg);
}
#page_culture .blk_3_3 .blk_btns .bar {
	position: absolute;
	left:-5px;
	top:65px;
	width: calc(100% + 10px);
	height: 1px;
	background-color: #b8b8b8;
  pointer-events: none;
}
#page_culture .blk_3_3 .blk_btns .bar div {
	position: absolute;
	left:0;
	top:0;
	width:100%;
	height: 1px;
	background-color: #313131;
	transform: scaleX(0);
	transition: transform 0s linear 0s;
  pointer-events: none;
}
/*
*/
#page_culture .blk_4 {
	width: var(--tgt_wid_1);
	max-width: var(--max_wid_1);
  margin: auto;
  padding:120px 0 200px 0;
}
#page_culture .blk_4 > section {
	width: 100%;
}
#page_culture .blk_4 h3 {
  font-size: 20px;
  line-height: 1.5;
  font-weight: 700;
  padding:0 0 40px 0;
}
#page_culture .blk_4 .nm_tgt_psa h3 {
  opacity:0;
  transform:translateY(30px);
}
#page_culture .blk_4 .nm_tgt_psa.psa_show h3 {
  animation:kf_psa_1 .6s 0s 1 normal both;
}
#page_culture .blk_4 > section > div {
	width: 100%;
  display:flex;
  justify-content: space-between;
}
/*  */
#page_culture .blk_4 > section > div section {
	width: 21%;
  border-top:1px solid #929292;
  border-bottom:1px solid #929292;
  padding:30px 0 40px 0;
}
#page_culture .blk_4 > section.nm_tgt_psa > div section {
  opacity:0;
  transform:translateY(40px);
}
#page_culture .blk_4 > section.nm_tgt_psa.psa_show > div section {
  animation:kf_psa_1 .8s 0s 1 normal both;
}
#page_culture .blk_4 > section.nm_tgt_psa.psa_show > div section:nth-of-type(1) {
  animation-delay: .1s;
}
#page_culture .blk_4 > section.nm_tgt_psa.psa_show > div section:nth-of-type(2) {
  animation-delay: .2s;
}
#page_culture .blk_4 > section.nm_tgt_psa.psa_show > div section:nth-of-type(3) {
  animation-delay: .3s;
}
#page_culture .blk_4 > section.nm_tgt_psa.psa_show > div section:nth-of-type(4) {
  animation-delay: .4s;
}
#page_culture .blk_4 > section > div section h4 {
  font-size: 16px;
  line-height: 1.5;
  font-weight: 700;
}
#page_culture .blk_4 > section > div section p {
  font-size: 15px;
  line-height: 2;
  padding:15px 0 0 0;
  /* text-align: justify; */
}
#page_culture .blk_4 > section > div section p span {
  font-size: inherit;
  line-height: inherit;
  display: inline-block;
}
/***************************************************************************************************
  responsive
***************************************************************************************************/

@media screen and (max-width: 1000px) {
/*  */
.blk_hd_bk {
  padding:50vh 0 0 0;
  background-position: 50% 0;
  background-size: cover;
}
/*
*/
#page_culture {
  margin-top: 50vh;
}
#page_culture::before {
	height: 25px;
	top:-24px;
}
/*
*/
#page_culture .blk_1 {
}
/*  */
#page_culture .blk_1 .gsty_tit_1 {
	width: var(--tgt_wid_2);
	max-width:none;
}
#page_culture .blk_1 .gsty_tit_1 > span:nth-of-type(1) {
  width:100px;
}
/*  */
#page_culture .blk_1_1 {
	width: var(--tgt_wid_2);
	max-width:none;
}
#page_culture .blk_1 .gsty_blk_scroll {
  top:-80px;
}
/*
*/
#page_culture .blk_2 {
	width: var(--tgt_wid_2);
	max-width: var(--max_wid_2);
  padding:60px 0 0 0;
}
#page_culture .blk_2 > section {
  width:100%;
}
#page_culture .blk_2 h3 {
  font-size:  18px;
  padding:0 0 20px 0;
}
/*  */
#page_culture .blk_2_1 {
  display:block;
}
#page_culture .blk_2_1_1,
#page_culture .blk_2_1_2 {
  width:100%;
}
#page_culture .blk_2_1_2 {
  border-top:none;
}
#page_culture .blk_2_1 ul {
  padding:25px 0 ;
}
#page_culture .blk_2_1 ul li {
  padding:0 0 15px 0;
  font-size:14px;
}
#page_culture .blk_2_1 ul li:last-of-type {
  padding:0;
}
/*
*/
#page_culture .blk_3 {
  width:100%;
  max-width: none;
  padding:80px 0 0 0;
}
#page_culture .blk_3 h3 {
	width: var(--tgt_wid_2);
	max-width: var(--max_wid_2);
  font-size: 18px;
  height: 60px;
  margin: auto;
}
/*  */
#page_culture .blk_3_1 {
  width: 100vw;
}
/*  */
#page_culture .blk_3_2 {
	width: var(--tgt_wid_2);
	max-width: var(--max_wid_2);
}
#page_culture .blk_3_2 .blk_circle::after {
  font-size:24px;
}
/*  */
#page_culture .blk_3_2 .blk_circle {
	position: absolute;
  width:74px;
  height:74px;
  left:calc(100% - 74px);
  top:-60px;
}
/*  */
#page_culture .blk_3_3 {
	width: var(--tgt_wid_2);
	max-width: var(--max_wid_2);
}
#page_culture .blk_3_3 .blk_btns {
	top:-22px;
	width: 60px;
	height: 60px;
}
#page_culture .blk_3_3 .blk_btns .btn_prev,
#page_culture .blk_3_3 .blk_btns .btn_next {
	width: 25px;
	height: 35px;
	left:0;
	top:5px;
}
#page_culture .blk_3_3 .blk_btns .btn_next {
	left:calc(100% - 25px);
	transform: scaleX(-1);
}
#page_culture .blk_3_3 .blk_btns .btn_prev::after,
#page_culture .blk_3_3 .blk_btns .btn_next::after {
	width: 14px;
	height: 14px;
	left:4px;
	top:16px;
}
#page_culture .blk_3_3 .blk_btns .bar {
	position: absolute;
	left:-3px;
	top:45px;
	width: calc(100% + 6px);
}
/*
*/
#page_culture .blk_4 {
	width: var(--tgt_wid_2);
	max-width: var(--max_wid_2);
  margin: auto;
  padding:80px 0 120px 0;
}
#page_culture .blk_4 h3 {
  font-size: 18px;
  padding:0 0 30px 0;
}
#page_culture .blk_4 > section > div {
  flex-wrap: wrap;
}
/*  */
#page_culture .blk_4 > section > div section {
	width: 46.5%;
  padding:25px 0 30px 0;
}
#page_culture .blk_4 > section > div section:nth-of-type(1),
#page_culture .blk_4 > section > div section:nth-of-type(2) {
  border-bottom:none;
}

#page_culture .blk_4 > section > div section h4 {
  font-size: 15px;
}
#page_culture .blk_4 > section > div section p {
  font-size: 14px;
  line-height: 1.75;
  padding:10px 0 0 0;
}
#page_culture .blk_4 > section > div section p span {
  display: inline;
}
}
