@charset "utf-8";
/* Concept */

.main { background-color: #000; }

#intro{position: relative;}

#intro-tit{font-size: 6rem; line-height: 1.1; letter-spacing: 0.01em; width: 600px; position: absolute; top: 10%; left: 30%; margin-left: -300px;}
#intro-tit li:after{content: ''; background: url("../img/common/ic_x.png") no-repeat top left/100% 100%; width: 34px; height: 34px; display: block; margin: 0.1em 1.6em;}
#intro-tit li:last-of-type:after{display: none;}

#intro-wrap{width: 600px; position: absolute; top: calc(10% + 360px); left: 30%; margin-left: -300px;}
#intro-txt{font-size: 2.4rem; margin-bottom: 1em;}
#intro-desc{font-size: 1.6rem; line-height: 2.2;}
#intro-label{position: absolute; top: 1%; right: 2.5%; max-width: 106px; width: 10%;}

#topic{padding: 100px 0 150px;}

.topic-row-1{position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; text-align: center;}
.topic-row-1 p{font-size: 2.5rem; line-height: 1.3;}
.topic-row-1 p:after{content: ''; width: 100%; height: 3px; background-image: linear-gradient(to right,#a7a976,#f0f3d4,#a7a976); display: block; margin: 20px 0;}

.topic-row-2{display: flex; flex-wrap: wrap; border-left: 1px solid #fff; margin-bottom: 50px;}
.topic-row-2 figure{width: 50%; border-right: 1px solid #fff; text-align: center;}

.topic-row-3{display: flex; flex-wrap: wrap; justify-content: space-between;}
.topic-row-3 li{width: 47.5%;}
.topic-row-3 figure{margin-bottom: 2px;}

.caption{font-size: 12px; padding-top: 40px;}

img { max-width: 100%; }

@media only screen and (min-width: 768px){
  .d-flex {
    display: flex;
    max-width: 1920px;
  }
  .d-flex.flex-type1 {
    flex-direction: row-reverse;
  }
  .d-flex .flex1 {
    width: 50%;
  }
  .d-flex .flex2 {
    width: 50%;
  }
  .d-flex.flex-type1 .inner-flex {
    max-width: 540px;
    float: left;
    margin-left: 40px;
  }
  .inner-flex {
    max-width: 530px;
    float: right;
    margin-right: 40px;
  }
  .d-flex .title-type2 {
    padding-right: 15px;
    padding-left: 15px;
  }
  .pct-long {
    margin-right: 10%;
    margin-left: 10%;
  }
}

.pct-long img {
  max-width: 100%;
}


/* Media */
@media only screen and (max-width: 1000px){
    #intro-tit{font-size: 6vw; width: auto; left: 5%; margin-left: 0; top: 7%;}
    #intro-tit li:after{width: 3.4vw; height: 3.4vw; margin: 0.2em 1.6em;}
    
    #intro-wrap{position: static; width: 90%; margin: 0 auto 70px; padding-top: 50px;}
    #intro-txt{text-align: center;}
    
    .topic-row-1{position: static;}
}

@media only screen and (max-width: 767px){
  #topic{padding: 50px 0 70px;}

  .topic-row-1 p{font-size: 4.5vw;}
  .topic-row-2{border-left: none;}
  .topic-row-2 figure{width: 100%; border-right: none;}
  .topic-row-2 figure:nth-of-type(1){border-bottom: 1px solid #fff; padding-bottom: 20px; margin-bottom: 20px;}

  .topic-row-3 li{width: 100%;}
	
	#intro-desc{font-size: 1.3rem; line-height: 1.8;}
	#intro-desc br{display: none;}	
	#intro-txt{font-size: 2.2rem; }
  
  .flex1 {
    width: 90%;
    margin-right: auto;
    margin-left: auto;
  }
  .pct-long {
    margin-right: 5%;
    margin-left: 5%;
  }

}