/* ---------------------------------------
  TITLE : HANSHIN Tigers
  URI : https://series.hanshintigers.jp/
  (C) HANSHIN Tigers.
--------------------------------------- */
#news .inner .scrollarea {
  height: 260px; }
#news a {
  font-weight: 300;
  text-align: left;
  display: block;
  padding: 10px 0;
  border-bottom: 1px dotted #FFF;
  margin-bottom: 10px; }
  #news a dl {
    width: 100%; }
    #news a dl dt,
    #news a dl dd {
      display: inline-block;
      font-size: 16px;
      line-height: 1.5;
      font-weight: 300;
      vertical-align: top;
      color: #FFF; }
    #news a dl dt {
      width: 110px;
      font-size: 15px;
      text-align: center;
      margin-right: 10px; }
    #news a dl dd {
      width: calc(100% - 120px); }
      #news a dl dd:hover {
        text-decoration: underline; }

@media screen and (max-width: 767px) {
  #news .inner {
    width: auto; }
    #news .inner .scrollarea {
      height: 180px; }
  #news a {
    padding: 8px 0;
    margin-bottom: 8px; }
    #news a dl {
      width: 100%; }
      #news a dl dt,
      #news a dl dd {
        display: block;
        font-size: 13px; }
      #news a dl dt {
        width: auto;
        display: inline-block;
        margin: 0 0 5px 0; }
      #news a dl dd {
        width: auto; } }
#schedule ul.indent li {
  text-align: right; }
#schedule .schedule_list .unit {
  padding: 10px 30px;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #013827;
  margin-top: 20px;
  color: #FFF; }
  #schedule .schedule_list .unit.canceled {
    background: #333333; }
    #schedule .schedule_list .unit.canceled .vs {
      color: #cccccc; }
  #schedule .schedule_list .unit .date {
    width: 30%;
    font-size: 24px;
    line-height: 1.5em; }
  #schedule .schedule_list .unit .vs {
    width: 35%; }
    #schedule .schedule_list .unit .vs .logo,
    #schedule .schedule_list .unit .vs .score {
      display: inline-block;
      vertical-align: middle; }
    #schedule .schedule_list .unit .vs .logo img {
      width: 80px;
      height: auto;
      vertical-align: middle; }
    #schedule .schedule_list .unit .vs .score {
      font-size: 36px;
      padding: 0 10px;
      min-width: 140px; }
      #schedule .schedule_list .unit .vs .score span {
        color: #ffd900; }
  #schedule .schedule_list .unit .stadium {
    width: 30%;
    font-size: 22px; }
#schedule .schedule_list .unit_icons {
  background: #006143;
  padding: 10px 30px;
  margin-top: 4px; }
  #schedule .schedule_list .unit_icons a img {
    margin-left: 20px; }
  #schedule .schedule_list .unit_icons a:first-child img {
    margin-left: 0; }
#schedule .btn_area {
  display: flex;
  justify-content: center; }
  #schedule .btn_area .btn-block {
    margin-left: 20px; }
    #schedule .btn_area .btn-block a {
      height: 80px; }
  #schedule .btn_area .btn-block:first-child {
    margin-left: 0; }

@media screen and (max-width: 767px) {
  #schedule .inner {
    margin: 0 auto; }
  #schedule p.lead {
    font-size: 18px;
    margin-bottom: 20px;
    line-height: 1.5; }
  #schedule ul.indent {
    margin: 10px;
    font-size: 12px; }
  #schedule .bnr-block {
    margin: 40px 4% 0 4%; }
  #schedule .schedule_list .unit {
    flex-wrap: wrap;
    margin-top: 15px; }
    #schedule .schedule_list .unit .date {
      width: 100%;
      font-size: 16px; }
    #schedule .schedule_list .unit .vs {
      width: 100%;
      margin: 10px 0; }
      #schedule .schedule_list .unit .vs .logo img {
        width: 40px;
        height: auto; }
      #schedule .schedule_list .unit .vs .score {
        font-size: 24px;
        padding: 0 10px;
        min-width: 140px; }
    #schedule .schedule_list .unit .stadium {
      width: 100%;
      font-size: 16px; }
  #schedule .schedule_list .unit_icons a img {
    width: 40px;
    height: auto;
    margin-left: 10px; }
  #schedule .schedule_list .unit_icons a:first-child img {
    width: 50px;
    height: auto;
    margin-left: 0; }
  #schedule .btn_area {
    display: block; }
    #schedule .btn_area .btn-block {
      margin-left: 0; }
      #schedule .btn_area .btn-block a {
        height: auto; }
    #schedule .btn_area .btn-block:first-child {
      margin-left: 0; } }
#photo .slick {
  width: 640px;
  margin: 0 auto; }
  #photo .slick li.slick-slide {
    box-sizing: border-box; }
    #photo .slick li.slick-slide img {
      width: 100%;
      height: auto; }
  #photo .slick .slick-dots {
    margin: 30px 0 40px 0; }
    #photo .slick .slick-dots li {
      display: inline-block;
      margin: 0 8px; }
      #photo .slick .slick-dots li button {
        text-indent: -9999px;
        border: 0;
        width: 12px;
        height: 12px;
        background: #FFF;
        -webkit-appearance: none;
        padding: 0;
        border-radius: 50%; }
      #photo .slick .slick-dots li.slick-active button {
        background: #ffd900; }

@media screen and (max-width: 767px) {
  #photo .slick {
    width: 92% !important;
    margin: 0 auto; }
    #photo .slick .slick-dots {
      margin: 10px auto 30px 0; }
      #photo .slick .slick-dots li button {
        width: 10px;
        height: 10px; } }
#column .inner {
  background: #000 url(/2025/ns/img/ns/bg_column.jpg) no-repeat center center;
  background-size: cover;
  padding: 50px 0; }
  #column .inner .unit {
    width: 1100px;
    margin: 0 auto; }
    #column .inner .unit.flex {
      display: -webkit-box;
      display: flex; }
      #column .inner .unit.flex .photo {
        width: 350px;
        margin: 0 30px 0 0; }
      #column .inner .unit.flex .info {
        width: 720px; }
    #column .inner .unit .photo {
      width: 600px;
      margin: 0 auto 30px auto; }
      #column .inner .unit .photo img {
        width: 100%;
        height: auto; }
    #column .inner .unit p {
      font-size: 15px;
      line-height: 1.8;
      font-weight: 300;
      color: #FFF;
      text-align: left; }
      #column .inner .unit p.writer {
        text-align: right;
        margin-top: 10px; }

@media screen and (max-width: 767px) {
  #column .inner {
    padding: 0 15px 30px 15px;
    margin: 0 auto;
    background: #000; }
    #column .inner .unit {
      width: auto; }
      #column .inner .unit.flex {
        display: block; }
        #column .inner .unit.flex .photo {
          max-width: 250px;
          margin: 0 auto 20px auto; }
        #column .inner .unit.flex .info {
          width: auto; }
      #column .inner .unit .photo {
        max-width: 380px;
        width: 100%;
        margin: 0 auto 20px auto; }
      #column .inner .unit p {
        font-size: 13px; } }
#tigers-message .inner .flex {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 980px;
  margin: 0 auto; }
#tigers-message .inner dl {
  margin: 20px 0 40px 0;
  text-align: left;
  line-height: 1;
  position: relative;
  border-left: 2px solid #FFF; }
  #tigers-message .inner dl dt,
  #tigers-message .inner dl dd {
    display: inline-block;
    vertical-align: middle; }
  #tigers-message .inner dl dt {
    font-size: 34px;
    padding: 0 5px 0 10px; }
  #tigers-message .inner dl dd {
    font-size: 32px;
    line-height: 1; }
#tigers-message .inner .unit-auto {
  margin: 0 auto;
  width: 560px; }
  #tigers-message .inner .unit-auto .youtube {
    width: 640px;
    height: 360px; }
#tigers-message .inner .unit .youtube {
  width: 470px;
  height: 0;
  padding-top: 56.25%;
  position: relative; }
  #tigers-message .inner .unit .youtube iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0; }
  #tigers-message .inner .unit .youtube img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0; }

@media screen and (max-width: 767px) {
  #tigers-message .inner .flex {
    width: auto;
    margin: 0 auto; }
  #tigers-message .inner dl {
    margin: 15px 0 30px 0; }
    #tigers-message .inner dl dt {
      font-size: 20px; }
    #tigers-message .inner dl dd {
      font-size: 18px; }
  #tigers-message .inner .unit-auto {
    width: 100%;
    max-width: 368px;
    margin: 0 auto; }
    #tigers-message .inner .unit-auto .youtube {
      width: 100%;
      height: 0;
      padding-top: 56.25%;
      position: relative; }
      #tigers-message .inner .unit-auto .youtube iframe {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0; }
  #tigers-message .inner .unit {
    width: 100%;
    max-width: 368px;
    margin: 0 auto; }
    #tigers-message .inner .unit .youtube,
    #tigers-message .inner .unit .video {
      width: 100%; } }
#fans-message .inner {
  -webkit-box-pack: justify;
  justify-content: space-between; }
  #fans-message .inner .info {
    width: 620px; }
    #fans-message .inner .info p {
      margin-bottom: 40px;
      font-size: 16px;
      font-weight: 400;
      text-align: left;
      line-height: 1.8; }
      #fans-message .inner .info p.tag {
        font-weight: 600;
        color: #ffd900;
        font-size: 28px;
        line-height: 1.4; }
  #fans-message .inner .photo {
    width: 520px; }
    #fans-message .inner .photo img {
      width: 100%;
      height: auto; }
#fans-message .btn-block {
  margin: 60px auto; }
@keyframes marquee {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(-100%); } }
#fans-message .msgSlider {
  background: #ffd900;
  color: #000;
  padding: 25px 0;
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  overflow: hidden;
  width: 100%;
  white-space: nowrap;
  position: relative;
  z-index: 2; }
  #fans-message .msgSlider ul {
    animation: marquee 40s linear infinite;
    transform: translateX(100%);
    font-size: 0;
    margin: 0;
    padding: 0; }
    #fans-message .msgSlider ul li {
      display: inline-block;
      padding-right: 30px;
      font-size: 18px;
      font-weight: 600; }

@media screen and (max-width: 767px) {
  #fans-message .inner {
    flex-wrap: wrap; }
    #fans-message .inner .info {
      width: auto; }
      #fans-message .inner .info p {
        margin-bottom: 20px;
        font-size: 14px; }
        #fans-message .inner .info p.tag {
          font-size: 18px;
          text-align: center; }
    #fans-message .inner .photo {
      width: auto; }
      #fans-message .inner .photo img {
        width: 100%;
        height: auto; }
  #fans-message .btn-block {
    margin: 40px auto; }
  #fans-message .msgSlider {
    padding: 15px 0; }
    #fans-message .msgSlider ul li {
      font-size: 14px; } }
#result {
  padding: 0 0 60px 0; }
  #result h3.en {
    margin-bottom: 30px; }
  #result .logo {
    width: 400px;
    margin: 0 auto 30px auto; }
    #result .logo img {
      width: 100%;
      height: auto; }
  #result h4 {
    color: #ffd900;
    font-size: 32px; }
  #result p.vs {
    font-size: 24px;
    margin: 30px 0 60px 0; }
  #result .inner .resultWrap {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1000px;
    margin: 0 auto; }
    #result .inner .resultWrap .unit {
      width: 480px;
      display: -webkit-box;
      display: flex;
      font-size: 24px;
      -webkit-box-align: center;
      align-items: center;
      margin-bottom: 30px;
      -webkit-box-pack: center;
      justify-content: center; }
      #result .inner .resultWrap .unit img {
        height: 40px;
        width: auto;
        -webkit-transition: opacity 0.3s ease;
        transition: opacity 0.3s ease; }
        #result .inner .resultWrap .unit img:hover {
          opacity: 0.7; }
      #result .inner .resultWrap .unit .point {
        margin: 0 30px; }
      #result .inner .resultWrap .unit .photo,
      #result .inner .resultWrap .unit .movie {
        margin: 0 10px; }

@media screen and (max-width: 767px) {
  #result {
    padding: 0 0 20px 0; }
    #result h3.en {
      margin-bottom: 20px; }
    #result .logo {
      width: 100%;
      max-width: 400px;
      margin: 0 auto 20px auto; }
    #result h4 {
      font-size: 18px;
      line-height: 1.5; }
    #result p.vs {
      font-size: 16px;
      margin: 20px 0 40px 0; }
    #result .inner .resultWrap {
      width: auto;
      margin: 0 auto; }
      #result .inner .resultWrap .unit {
        width: 96%;
        max-width: 350px;
        font-size: 18px;
        margin: 0 auto 25px auto;
        -webkit-box-pack: justify;
        justify-content: space-between; }
        #result .inner .resultWrap .unit img {
          height: 24px;
          width: auto;
          -webkit-transition: opacity 0.3s ease;
          transition: opacity 0.3s ease; }
          #result .inner .resultWrap .unit img:hover {
            opacity: 0.7; }
        #result .inner .resultWrap .unit .point {
          margin: 0 10px;
          white-space: nowrap; }
        #result .inner .resultWrap .unit .photo,
        #result .inner .resultWrap .unit .movie {
          margin: 0 5px; }
    #result .inner .btn-block a {
      margin-top: 0; } }
