@charset "UTF-8";

.is-pc {display: block;}
.is-sp {display: none;}

@media only screen and (max-width: 768px) {
.is-pc {display: none;}
.is-sp {display: block;}}

/*OC_CPで適用*/
.timeline-content h3 .year-badge { margin-right: 10px;}
@media only screen and (max-width: 768px) {
.timeline-item .timeline-content { padding: 1rem 1.5rem 1.5rem!important; }
.timeline-content h3 .ttl { display: block; width: 100%; margin-top: 10px;}}

/*全ページで適用*/
.p-3 .text-end { max-width: 1320px; width: 100%; margin: 0 auto;  }
.p-3 .text-end a { font-size:1.15em; margin: 10px 0.8em 0 0;}
@media only screen and (max-width: 768px) {
.p-3 .text-end { font-size: 1em; }
.p-3 .text-end a { font-size:1.1em; margin: 10px 1em 0 0;}}


/*.btn-official {
  display: inline-block;
  padding: 8px 16px;
  color: #fff;
  background-color: #CC5803; 
  border-radius: 4px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.3s ease, transform 0.2s ease;
  width: 250px;
}

.btn-official:hover {
  background-color: #cc5c00;
  transform: translateY(-2px);
  text-decoration: none;
}*/

.btn-official {
  display: inline-block;
  padding: 8px 24px 8px 16px;
  color: #fff;
  background-color: #CC5803;
  border-radius: 4px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  width: 250px;
}

.btn-official::after {
  content: "⧉"; /* 四角から飛び出す矢印（外部リンク標準） */
  position: absolute;
  right: 28px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.85em;
  opacity: 0.9;
  transition: all 0.3s ease;
}

.btn-official:hover {
  background-color: #cc5c00;
  transform: translateY(-2px);
}