/*
Theme Name: FALCON Theme
Theme URI: https://falcon-hp.com/
Author: FALCON
Description: FALCON company website theme
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: falcon-theme
*/

/* ==========================================================================
   13. aboutページ
   ========================================================================== */
.a-message h2 span,.a-profile h2 span,.a-logo h2 span,.a-history h2 span{
    display: block;
    color: #45be2e;
    font-size: 16px;
    margin-bottom: 8px;
}
.a-message{
line-height: 2;
display: flex;
  justify-content: space-between;
  align-content: center;
  flex-wrap: wrap;
}
.a-message h2{
line-height: 1.7;
  margin-bottom: 30px;
  width: 100%;
}
.a-m-txt{
    width: 65%;  
}
.a-message .waku{
      width: 35%;
      padding-left: 30px;
    }
    .a-message .waku > img{
    width: 100%;
}  
.shomei{
    display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}
.shomei img{
    height: 25px;
  margin-left: 10px;
}
.a-profile{
margin: 50px auto;
background: #f2f4f5;
  padding: 50px;
}
.a-profile h2,.a-logo h2,.a-history h2{
    line-height: 1.7;
      margin-bottom: 30px;
 }
 .a-profile dl{
 background: #fff;
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
  padding: 15px;
}
.a-profile dt{
    width: 30%;
    display: flex;
    align-items: center;
    font-size: 13px;
}
.a-profile dd{
    width: 70%;
    }
    .a-profile h3{
    margin: 30px auto 15px;   
 }
 .a-profile h3:nth-of-type(2){
    margin-top:60px; }

    .a-logo{
        margin-bottom: 80px;
        position: relative;
    }
    /* CSS追加 */
.hato-animation {
    position: absolute;
    right: 10%;
    top: 30%;
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.5s ease;
}

.hato-animation img {
    width: 150px;
}

/* 表示時のアニメーション */
.hato-animation.show {
    opacity: 1;
    transform: translateY(0);
    animation: swing 2s ease;
}

/* swingアニメーションの定義 */
@keyframes swing {
    0%, 100% { 
        transform: rotate(0deg);
    }
    20% { 
        transform: rotate(15deg);
    }
    40% { 
        transform: rotate(-10deg);
    }
    60% { 
        transform: rotate(5deg);
    }
    80% { 
        transform: rotate(-5deg);
    }
}
    @media (max-width: 768px) {
        .a-message h2 {
            order: -2;
          }
        .a-m-txt {
            width: 100%;
          }
        .a-message .waku {
            width: 65%;
            padding-left: 0;
            align-items: center;
            display: flex;
            flex-direction: column;
            margin: 0 auto 30px;
            order: -1;
          }
          .a-profile {
            padding: 30px 20px;
          }
          .hato-animation {
            position: unset;
            margin: 30px auto;
            text-align: center;
          }
          .history-scroll-cont-box:first-of-type {
            padding-left: 400px !important;
          }
    }

/* ==========================================================================
   13. history section
   ========================================================================== */
   .history-section {
    padding: 60px 0;
    max-width: 800px;
    margin: 0 auto;
}

.history-timeline {
    position: relative;
    padding: 40px 0;
}

/* 中央の縦線 */
.history-timeline::before {
    content: '';
    position: absolute;
    left: 15%;
    transform: translateX(-50%);
    width: 2px;
    height: 100%;
    background: #45be2e;
    opacity: 0.3;
}

.history-list {
    position: relative;
}

.history-item {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

.history-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.history-year {
    flex: 0 0 120px;
    font-weight: bold;
    font-size: 18px;
    text-align: right;
    padding-right: 30px;
    position: relative;
}

/* 丸いポイント */
.history-year::after {
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    background: #45be2e;
    border-radius: 50%;
}

.history-content {
    flex: 1;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    margin-left: 30px;
    position: relative;
}

/* 矢印部分 */
.history-content::before {
    content: '';
    position: absolute;
    left: -10px;
    top: 50%;
    transform: translateY(-50%);
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #fff transparent transparent;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
    .history-section {
        padding: 40px 20px;
    }

    .history-timeline::before {
        left: 20px;
    }

    .history-item {
        flex-direction: column;
        align-items: flex-start;
        padding-left: 50px;
    }

    .history-year {
        flex: none;
        text-align: left;
        padding-right: 0;
        margin-bottom: 10px;
    }

    .history-year::after {
        left: -36px;
        top: 50%;
    }

    .history-content {
        margin-left: 0;
        width: 100%;
    }

    .history-content::before {
        left: 20px;
        top: -10px;
        transform: rotate(-90deg);
    }
}