/* ----------------------------------------
	#content
---------------------------------------- */
#content {
  /*margin-top: 60px !important;
  @include minTabw{
      margin-top: 115px !important;
  }*/ }

h2.homeTitle {
  font-size: clamp(1.5rem, 2vw, 1.8rem);
  font-weight: bold;
  line-height: 1.0;
  margin-bottom: 5px;
  text-align: center; }
  @media screen and (min-width: 961px) {
    h2.homeTitle {
      font-size: 1.8rem; } }
  h2.homeTitle span.en {
    font-family: "Lato", sans-serif;
    color: #ea071d;
    font-weight: bold;
    line-height: 1.0;
    display: inline-block;
    width: 100%;
    padding-top: 7px;
    font-size: 3.5rem; }
    @media screen and (min-width: 961px) {
      h2.homeTitle span.en {
        padding-top: 20px;
        font-size: 5.2rem; } }

/* ----------------------------------------
	#visualHome
---------------------------------------- */
.visual {
  position: relative;
  overflow: hidden; }
  @media screen and (max-width: 767px) {
    .visual {
      height: 80vh; } }
  @media screen and (min-width: 768px) {
    .visual {
      height: 80vh; } }
  @media screen and (min-width: 1281px) {
    .visual {
      height: 85vh; } }
  .visual::before {
    content: "";
    position: absolute;
    inset: 0;
    /*background: rgba(0,0,0,0.2);*/
    z-index: 1; }
    @media screen and (max-width: 480px) {
      .visual::before {
        /*background: rgba(0,0,0,0.4);*/ } }
  .visual__bg {
    position: absolute;
    inset: 0; }
    .visual__bg img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
      @media screen and (max-width: 480px) {
        .visual__bg img {
          object-position: 70% center; } }
  .visual__inner {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    z-index: 2;
    color: #fff;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 10%; }
  .visual__copy {
    max-width: 65%;
    margin: 0px auto; }
    @media screen and (min-width: 961px) {
      .visual__copy {
        max-width: 400px;
        margin: 0px auto; } }
  .visual__copy h2 {
    font-size: clamp(2.3rem, 5vw, 5rem);
    line-height: 1.4;
    font-weight: bold;
    text-shadow: 2px 2px 6px black; }
  .visual__text {
    margin-top: 25px;
    line-height: 1.4;
    font-weight: bold;
    text-shadow: 2px 2px 6px black; }
    @media screen and (min-width: 768px) {
      .visual__text {
        font-size: 2.0rem;
        margin-top: 40px; } }
  .visual__sub {
    margin-top: 30px;
    max-width: 720px;
    width: 100%;
    padding: 5px 10px 6px 10px;
    line-height: 1.0;
    text-shadow: 2px 2px 6px black; }
    @media screen and (min-width: 768px) {
      .visual__sub {
        margin-top: 35px; } }

/* ----------------------------------------
	#topics
---------------------------------------- */
.topics {
  background: #ffffff; }
  .topics .inner {
    padding-top: 40px;
    padding-bottom: 15px; }
    @media screen and (min-width: 961px) {
      .topics .inner {
        display: flex;
        justify-content: space-between; } }
    @media screen and (min-width: 768px) and (max-width: 1280px) {
      .topics .inner {
        padding-top: 60px;
        padding-bottom: 20px; } }
    @media screen and (min-width: 1281px) {
      .topics .inner {
        padding-top: 90px;
        padding-bottom: 30px; } }
  .topics__titArea {
    position: relative; }
    @media screen and (min-width: 961px) {
      .topics__titArea {
        width: 180px; } }
  @media screen and (min-width: 961px) and (max-width: 1280px) {
    .topics__topicsArea {
      width: -webkit-calc(100% -220px);
      width: calc(100% - 220px); } }
  @media screen and (min-width: 1281px) {
    .topics__topicsArea {
      width: 920px; } }
  .topics h2.homeTitle {
    text-align: left; }
    @media screen and (max-width: 960px) {
      .topics h2.homeTitle {
        margin-bottom: 25px; } }
    @media screen and (min-width: 961px) {
      .topics h2.homeTitle {
        margin-bottom: 70px; } }
  .topics__topicsList {
    border-bottom: 1px solid  #cacaca; }
    @media screen and (max-width: 960px) {
      .topics__topicsList {
        margin-bottom: 30px; } }
  .topics__item {
    position: relative;
    border-top: 1px solid #cacaca; }
    .topics__item:hover .topics__title {
      color: #ea071d; }
    .topics__item a {
      display: block; }
      @media screen and (max-width: 767px) {
        .topics__item a {
          padding: 20px 20px 20px 0px; } }
      @media screen and (min-width: 768px) {
        .topics__item a {
          padding: 25px 25px 25px 0px; } }
  .topics .ol {
    top: 45%;
    right: 0px;
    left: 0px;
    text-align: center;
    padding: 2px 8px;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.3);
    font-weight: bold;
    font-size: 18px;
    position: absolute;
    width: 200px;
    margin: 0px auto;
    padding: 10px;
    border: 1px solid #ffffff; }
  .topics__date {
    font-weight: 600; }
    @media screen and (max-width: 767px) {
      .topics__date {
        font-size: 1.4rem; } }
  .topics__cat {
    display: inline-block;
    color: #ffffff;
    padding: 2px 5px 5px 5px;
    text-align: center;
    width: 112px;
    font-size: 1.4rem;
    font-weight: 400;
    background: #4c4c4c;
    border-radius: 30px;
    margin-left: 15px;
    line-height: 1.2; }
    @media screen and (max-width: 767px) {
      .topics__cat {
        font-size: 1.4rem; } }
  .topics__title {
    font-weight: 600;
    font-size: 1.7rem; }
  .topics__moreBtn {
    width: 100%;
    position: relative;
    transition: 0.3s ease;
    font-weight: bold; }
    @media screen and (max-width: 960px) {
      .topics__moreBtn {
        position: absolute;
        right: 1%;
        top: 20px;
        width: 130px; }
        .topics__moreBtn a {
          font-size: 1.2rem;
          font-weight: 600; }
          .topics__moreBtn a:hover {
            color: #ea071d; } }
    .topics__moreBtn a {
      font-weight: 600; }
      .topics__moreBtn a:hover {
        color: #ea071d; }
    .topics__moreBtn:after {
      content: url("../images/common/arrow_circle.svg?2026");
      width: 43px;
      position: absolute;
      margin-left: 8px; }
      @media screen and (max-width: 960px) {
        .topics__moreBtn:after {
          width: 30px;
          margin-left: 5px;
          top: 3px; } }
      @media screen and (min-width: 961px) {
        .topics__moreBtn:after {
          top: -5px; } }
    .topics__moreBtn:hover::after {
      content: url("../images/common/arrow_circle_r.svg?2026"); }

/******************************************************
.lineup
******************************************************/
.lineup {
  background: #ffffff; }
  .lineup .inner {
    padding-top: 15px;
    padding-bottom: 0px; }
    @media screen and (min-width: 961px) and (max-width: 1280px) {
      .lineup .inner {
        padding-top: 20px;
        padding-bottom: 30px; } }
    @media screen and (min-width: 1281px) {
      .lineup .inner {
        padding-top: 30px;
        padding-bottom: 70px; } }
  .lineup h2.homeTitle {
    margin-bottom: 50px; }
    @media screen and (min-width: 961px) {
      .lineup h2.homeTitle {
        margin-bottom: 75px; } }
  .lineup__list {
    margin-bottom: 0px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    @media screen and (min-width: 1281px) {
      .lineup__list {
        margin-bottom: 40px; } }
  .lineup__item {
    background: #f2eee7;
    border-radius: 10px;
    position: relative;
    padding: 95px 15px 40px 10px; }
    @media screen and (max-width: 960px) {
      .lineup__item {
        width: 48%;
        margin-bottom: 30px; }
        .lineup__item:nth-child(1) {
          width: 100%; } }
    @media screen and (min-width: 961px) and (max-width: 1280px) {
      .lineup__item {
        margin-bottom: 30px;
        padding: 100px 15px 40px 15px; }
        .lineup__item:nth-child(1) {
          width: 48%; }
        .lineup__item:nth-child(2) {
          width: 48%; }
        .lineup__item:nth-child(3) {
          width: 31%; }
        .lineup__item:nth-child(4) {
          width: 31%; }
        .lineup__item:nth-child(5) {
          width: 31%; } }
    @media screen and (min-width: 1281px) {
      .lineup__item {
        width: 19%;
        padding: 100px 15px 40px 15px; } }
  .lineup__iconArea {
    position: absolute;
    top: -17px;
    left: 50%;
    transform: translateX(-50%);
    width: 88px;
    height: 88px; }
  .lineup__titleArea {
    text-align: center;
    font-size: clamp(1.8rem, 2vw, 2.2rem);
    color: #ea071d;
    line-height: 1.4;
    font-weight: bold;
    width: 100%;
    padding-bottom: 20px; }
  .lineup__textArea {
    text-align: center;
    font-size: 1.4rem; }
    @media screen and (min-width: 768px) {
      .lineup__textArea {
        padding-bottom: 50px; } }
  .lineup .more {
    margin: 0px auto;
    font-size: 1.2rem;
    padding: 10px 10px;
    text-align: center;
    background: #ffffff;
    border: 1px solid #ea071d;
    color: #ea071d;
    font-weight: bold;
    line-height: 1.0;
    border-radius: 30px;
    left: 0;
    right: 0;
    width: 90%;
    max-width: 160px; }
    @media screen and (min-width: 481px) {
      .lineup .more {
        width: 160px; } }
    @media screen and (min-width: 768px) {
      .lineup .more {
        bottom: 40px;
        font-size: 1.5rem;
        position: absolute; } }
    .lineup .more:after {
      content: url("../images/common/arrow_r2.svg");
      width: 11px;
      margin-left: 6px;
      top: 10px;
      display: inline-block; }
      @media screen and (max-width: 480px) {
        .lineup .more:after {
          width: 9px;
          margin-left: 4px;
          top: 11px; } }
  .lineup a:hover .more {
    border: 1px solid #e83828;
    color: #FFFFFF;
    background: #e83828; }
    .lineup a:hover .more:after {
      content: url("../images/common/arrow_w2.svg"); }
