/*

1. Add your custom Css styles below
2. Place the this code in your template:

 <link href="css/custom.css" rel="stylesheet">

*/
@media (max-width:414px) {
	.header-extras li.facebook {
		/*display: none;*/
	}
}
@media (max-width:766px) {
	#logo {
		display: none
	}
}
/*
言語選択の自動表示
*/
.langSelectHover {
    opacity: 1!important;
    transform: scale(1)!important;
    -moz-transform: scale(1)!important;
    -webkit-transform: scale(1)!important;
    -ms-transform: scale(1)!important;
    visibility: visible!important;
}


.pc_only { display: block; }
.sp_only { display: none; }
@media screen and (max-width: 735px) {
    .pc_only { display: none !important; }
    .sp_only { display: block !important; }
}


#other-apps {
  padding: 60px 0 0 0 !important;
}
#other-apps .container {
  padding: 0;
}
#other-apps .container .footer__col-title {
    font-size: 16px;
    letter-spacing: -0.1px;
    line-height: 23px;
    margin-bottom: 24px;
    color: #333;
    font-weight: 600;
}
.footer__other-apps {
  padding-top: 0;
  padding-left: 0;
  margin-bottom: 0;
}
.footer__other-apps-list {
  display: flex;
  gap: 24px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.footer__other-apps-item {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.footer__other-apps-item a {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-main);
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.footer__other-apps-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(74,67,62,0.15);
  flex-shrink: 0;
  display: block;
}
.footer__other-apps-item a::after {
  content: '';
  position: absolute;
  bottom: -1px; left: 0;
  width: 100%; height: 1px;
  background: var(--c-start);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s var(--ease-smooth);
}
.footer__other-apps-item a:hover::after { transform: scaleX(1); }
.footer__other-apps-item a:hover { color: var(--c-start); }
.footer__other-apps-item span {
  font-size: 12px;
  color: var(--text-sub);
  line-height: 1.65;
}

@media (max-width: 768px) {
  #other-apps .container{ padding: 0 30px; }
  .footer__inner { grid-template-columns: 1fr; }
  .footer__inner { grid-template-columns: 1fr; }
  .footer__other-apps-list { flex-direction: column; }
  .footer__other-apps-item { flex: none; }
}

@media (max-width: 480px) {
  #other-apps .container{ padding: 0 30px; }
  .footer__inner { grid-template-columns: 1fr; }
  .footer__other-apps-list { flex-direction: column; }
  .footer__other-apps-item { flex: none; }
}