@charset "utf-8";

body { overflow:hidden; }

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

#g-nav.panelactive ul li a.a_jobs:link span { color:#FFFF02;}
#g-nav.panelactive ul li a.a_jobs:visited span { color:#FFFF02;}
footer a.f_jobs: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; } 
@media screen and (min-width: 840px) {
    .inlin_pc { display:block; } 
}


/*トップ*/
.ul_top li.li_photo { margin-top:10px; }
.img_back { width:100%; }
.top_wrap { padding-bottom:30px; }
.ul_top li.li_photo .p_top { width:90%; margin: 20px auto 0 auto;  text-align:justify; }
@media screen and (min-width: 840px) {
    .ul_top li.li_photo p { width:100%; font-size:18px; margin-top:0; bottom:20px; }
    .p_top { margin-left:15%; }
    .top_wrap { height:580px; }
}

/* 仕事内容 */
.contents { padding:30px 0; }
h2 { margin-bottom:50px; }
h3 { margin-bottom:10px; } 
h3::before { content: '●'; color:#00E0E0; display:inline-block; width:1em; margin-right: 0.5em; }
.jobsContentsImg li img { max-width:100%; max-height:100%; height:auto; width:auto; }
.jobsContentsImg li:first-child { margin-bottom: 10px; }

.jobs { margin-bottom:50px; }
@media screen and (min-width: 840px) {
    .contents { padding:50px 0 150px 0; }
    .jobs { display:flex; margin-top: 70px; margin-bottom:0; justify-content:space-between; }
    .jobs:nth-last-child(2) { display:flex; flex-direction:row-reverse;}
    .worksContents { width:50%; }
    .jobsContentsImg { width:40%; }
    .jobsContentsImg li:nth-child(2) { margin-left:-15%; margin-right:15%; margin-top:20px; margin-bottom:80px; }
}

/* 強み */
.contents_wrap.gray {text-align: center; }
.StrongText { text-align:left; display:inline-block; margin-top: 20px;}

@media screen and (min-width: 840px) {
    .contents_wrap.gray { padding: 50px 0 0 0; }
    .contents_wrap.gray strong { font-size:28px; line-height:1.7em; }
    .StrongText { width:75%; margin:20px auto 100px auto;}
} 

.mask-wrap .mask { margin-bottom:-10px; }

@media screen and (min-width: 840px) {
    #text-container span.japan { margin-top: -80px; }
}

.img_back { width:100%; height:500px; overflow: hidden; margin-bottom:0; }
.img_back img { width:100%; }


/*250620追加*/
.housedo { width:100%; display:block; }
.housedoText h3 { margin-bottom:20px; display:flex; } 
.housedoText h3::before { content: '●'; color:#00E0E0; display:inline-block; width:1em; margin-right: 0.5em; }
.housedoMap { width:110%; margin:0 -5%; }
.housedoIntroductions { width:100%; display:block; }
.housedoIntroduction { width:100%; display:block; }
.housedoIntroductionText { width:100%; margin:0 0 10px 0; display:block; color:#002B64; font-weight:bold; font-size:14px; line-height:1.5; }
.housedoIntroductionImg { width:100%; display:block; position:relative; }
.housedoIntroductionImgFuruta { height:170px; position:relative; z-index:0; }
.housedoIntroductionImgIll { height:170px; position:absolute; top:0; right:0; }
.housedoIntroductionImgName { display:block; position:absolute; left:32.5%; bottom:10px; z-index:1; color:#002B64; font-weight:bold; font-size:14px; line-height:1.2; }
.housedoPhoto { width:100%; max-width:445px; margin:10px 0 0 0; display:block; }
@media screen and (min-width: 840px) {
    .housedoText { width:500px; }
    .housedoText h3 { margin:50px 0 30px 0; font-size:28px; line-height:1.5em; }
    .housedoMap { width:770px; margin:0; position:absolute; top:0; left:480px; }
    .housedoIntroductions { margin:30px 0 0 0; display:flex; justify-content:space-between; align-items:flex-end; }
    .housedoIntroduction { width:600px; margin:50px 0 0 0; }
    .housedoIntroductionText { margin:0 0 -30px 0; position:relative; z-index:1; font-size:16px; }
    .housedoIntroductionImgFuruta { height:240px; margin:80px 0 0 0; position:relative; z-index:0; }
    .housedoIntroductionImgIll { height:320px; position:absolute; top:0; right:0; }
}

.shop { width:100%; margin:30px 0 0 0; display:block; }
.shopTitle { width:100%; display:block; }
.shopLists { width:100%; display:flex; flex-wrap:wrap; gap:10px 5%; }
.shopList { width:47.5%; display:block; }
.shopListImg { width:100%; display:block; }
.shopListName { width:100%; margin:5px 0 0 0; display:block; font-size:14px; line-height:1.2; }
@media screen and (min-width: 840px) {
    .shopLists { flex-wrap:nowrap; gap:20px; }
    .shopList { width:auto; }
    .shopListName { font-size:16px; }
}

.business { width:100%; display:flex; flex-wrap:wrap; }
.businessList { width:100%; margin:0 0 50px 0; display:flex; flex-direction:column; }
.businessListTexts { width:100%; display:block; }
.businessList h3 { width:100%; display:block; text-align:left; }
.businessListText { width:100%; display:block; text-align:justify; }
.businessListImg { width:100%; margin:20px 0 0 0; display:block; }
@media screen and (min-width: 840px) {
    .business { gap:20px 5%; }
    .businessList { width:30%; justify-content:space-between; }
    .businessListImg { width:100%; margin:20px 0 0 0; display:block; }
}

.worksTitle { width:100%; margin:50px 0 0 0; display:block; text-align:center; }
.worksTitle strong { display:block; font-size:40px; line-height:1.2; }
.worksTitle h2 { color:#00E0E0; font-weight:normal; font-size:16px; }
@media screen and (min-width: 840px) {
    .worksTitle strong { font-size:62px; }
}