@charset "utf-8";

.fmenu_sp li a.sp_company:link span { color:#00E0E0; }
.fmenu_sp li a.sp_company:link em { color:#00E0E0; }
.fmenu_sp li a.sp_company:visited span { color:#00E0E0; }
.fmenu_sp li a.sp_company:visited em { color:#00E0E0; }

#g-nav.panelactive ul li a.a_company:link span { color:#FFFF02;}
#g-nav.panelactive ul li a.a_company:visited span { color:#FFFF02;}
footer a.f_company:link::after {
    content: ''; /* コンテンツを空にする */
    position: absolute; /* 絶対位置指定 */
    bottom:10px;
    left: 50%; /* 左端から中央に配置 */
    transform: translate(-50%, -50%); /* 中央揃え */
    width:50px; /* 要素の幅と同じ */
    height:20px; /* 要素の高さと同じ */
    background-image: url('../../img/color.png');
    background-size: contain; /* 画像を要素に合わせて表示 */
    opacity: 1; /* 初期状態は不透明 */
    transition: opacity 0.3s ease; /* フェードのアニメーション */
    margin:0 auto; 
  }

#g-nav-list ul li a.a_works { }
#g-nav-list ul li a.a_works strong { }
#g-nav-list ul li a.a_works:link { }
#g-nav-list ul li a.a_works span.btnarrow::before{content: '';position: absolute;bottom:-8px;left:15%; width: 85%; height: 1px;  }
#g-nav-list ul li a.a_works span.btnarrow::afer{content: '';position: absolute;bottom:-3px;right:0;width: 15px;height:1px;transform: rotate(35deg);}
.fmenu_sp .sp_works:link em {} 
.fmenu_sp .sp_works:link span {} 
.fmenu_sp .sp_works:visited em {} 
.fmenu_sp .sp_works:visited span {} 
.fmenu_sp li a.sp_works img {}  

.inlin_pc { display:none; } 
.inlin_sp { display:block; } 
@media screen and (min-width: 840px) {
    .inlin_pc { display:block; } 
    .inlin_sp { display:none; } 
    #text-container strong.josefin-sans .fade-in { margin: -6px; }
    #text-container span.japan { margin-top:-210px; }
    
}


.top_wrap { padding-bottom:0; }
@media screen and (min-width: 840px) {
    .top_wrap { height:auto; }
}

/* 共通 */
.contents { text-align:center; padding:30px 0; }
.contents p { letter-spacing:0.05em; line-height:1.8em; }
.contents img { max-width:100%; max-height:100%; height:auto; }
.mask-wrap .mask { margin-bottom:-10px; }
h3 { margin-bottom:20px; } 
h3::before { content: '●'; color:#00E0E0; display:inline-block; width:1em; margin-right: 0.5em; }

@media screen and (min-width: 840px) {
    .contents { padding:50px 0; }
}

/*トップ*/
.ul_top li.li_photo { margin-top:10px; }
.img_back { width:100%; }
.ul_top li.li_photo p { width:90%; margin: 0 auto; margin-top:15px; text-align: left; }

/* トップの下共通 */
.company_wrap_gray { width: 100%; background:#f7f7f7; }
.company_wrap_gray h3 { text-align:left; }
.companyContentsText  { text-align:left; }
.companyContentsImg li img { max-width:100%; max-height:100%; height:auto; width:auto; }
.companyContentsImg li:first-child { margin-bottom: 10px; }

@media screen and (min-width: 840px) {
    .company { display:flex; margin-top: 70px; gap:5%; }
    .worksContents { width:70%; }
    .companyContentsImg { width:40%; }
}

/* 100年必要とされる */
.company:first-child { margin-bottom:40px; }

@media screen and (min-width: 840px) {
    .company:first-child h3 { font-size:28px; line-height:1.5em; }
    .company:first-child .worksContents { width:40%; }
    .company:first-child .companyContentsImg { width:55%; }
}

/* 時代が変化 */
@media screen and (min-width: 840px) {
    .ul_top li.li_photo p { width:100%; font-size:18px; }
    .company:nth-child(2) h3 { font-size:24px; }
}


/* 私たちの使命 */
.contents strong { text-align:center; }
.contents_wrap.gray {text-align: center; }
.StrongText { text-align:left; display:inline-block; margin-top: 20px;}
.contents_wrap.gray strong { letter-spacing:0.05em; }
.contents_wrap.gray em { width:100%; margin-top:20px; display:block; text-align:center; font-style:normal; font-weight:bold; }
@media screen and (min-width: 840px) {
    .contents strong { font-size:28px; line-height:1.5em; }
    .contents_wrap.gray strong { font-size:28px; }
    .contents_wrap.gray em { font-size:20px; }
    .StrongText { width:60%; margin: 0 auto; margin-top:20px; display:block; }
    .StrongImg { width:60%; }
} 


 /* ビジョン */
 .VisionImg { display: flex; flex-wrap:wrap; justify-content: space-between;}
 .VisionImg li:nth-child(1){ width:100%;}
 .VisionImg li:nth-child(1) img { width:100%;}
 .VisionImg li { width:49%; }
 .VisionImg li img { width:100%; }
 @media screen and (min-width: 840px) {
    .VisionImg { margin-top:50px; margin-bottom:100px; }
    .VisionImg li:nth-child(1){ width:33%;}
    .VisionImg li { width:33%; }
 }

 h2 { margin-bottom:30px;font-family: "futura-pt-bold", sans-serif;font-weight: 700;font-style: normal; }
 @media screen and (min-width: 840px) {
    h2 { margin-bottom:0; }
 }

 @media screen and (min-width: 840px) {
 .sp_h2 { margin-bottom:30px; }
 }