@charset "utf-8";
@media screen and (min-width: 1201px) { html{font-size:16px; } }@media screen and (max-width: 1200px) { html{font-size:15px; } }@media screen and (max-width: 1024px) { html{font-size:14px; } }@media screen and (max-width: 768px) {  html{font-size:13px; } }@media screen and (max-width: 480px) {  html{font-size:12px; } }a,a:visited,a:active { color:rgba(66,66,66,1.00)}a:hover { color:rgba(186,186,186,1.00)}
/* css setting */
/*　--------------------　202408サステナビリティ　--------------------　*/
/*　ヘッダーナビ　*/
.fsNavMenuList li a { padding: 1.25rem 2rem 1.25rem 0!important; }
@media screen and (max-width: 1200px) {
.fsNavMenuList li a { padding: 1.25rem 1.5rem 1.25rem 0!important; }}
@media screen and (max-width: 1024px) {
.fsNavMenuList li a { padding: 1rem 1rem 1rem 0!important; }
.fsNavMenuList li:first-child { display: none!important; }
}

/* ページ */
.sdgs_tittle { font-size:2.4rem; padding:15vh 0 10vh 0; font-weight:bold; color: #000073 ;}
.sdgs_copy { max-width:800px; margin:0 auto;}
.sdgs_logo_A img { max-width:520px; }

@media screen and (max-width: 480px) {
.sdgs_tittle { font-size:2rem; padding:10vh 0 8vh 0; }
.sdgs_logo_A img { width:300px; }
}

/*　--------------------　SDGsテーブル　--------------------　*/
.sdgs_tb{margin:0rem 0rem 6rem 0rem;}
.sdgs_tb ul{width:100%; box-sizing: border-box;}
.sdgs_tb ul li{width:100%; box-sizing: border-box;}
.sdgs_tb ul li:first-child dl dd{padding:1rem; box-sizing: border-box;}
.sdgs_tb dl{border-top:1px solid #8da0b6; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-flow: row nowrap; justify-content: flex-start; width:100%;}
.sdgs_tb dl dt{padding:0.5rem 1rem; box-sizing: border-box; background-color:#8da0b6; color:#fff; text-align: justify; font-size:0.9rem; font-weight:bold;}
.sdgs_tb dl dd{ box-sizing: border-box; text-align: justify;}
.sdgs_tb dl dd:first-child { padding:1rem; }
.sdgs_tb dl dd:nth-child(2) , .sdgs_tb dl dd:nth-child(3) {padding:1rem 1rem 1rem 2rem; text-indent: -1rem; }
.sdgs_tb dl dt:first-child , .sdgs_tb dl dd:first-child{width:25%;}
.sdgs_tb dl dt:nth-child(2) , .sdgs_tb dl dd:nth-child(2) {width:40%; border-left:1px solid #ededed; }
.sdgs_tb dl dt:nth-child(3) , .sdgs_tb dl dd:nth-child(3) {width:35%; border-left:1px solid #ededed; }

@media screen and (max-width: 480px) {
.sdgs_tb{margin:0rem 0rem 4rem 0rem;}
}

.sdgs_process_flow { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-flow: row nowrap; justify-content: flex-start; align-items: flex-start; width: 100%; border-bottom:1px solid #8da0b6; }
.sdgs_process_flow dt { padding: 2rem 0 0 0 ; position: relative; font-weight: bold; font-size:1.2rem; color:#8da0b6; letter-spacing:0.1rem;
width: 200px; text-align: center;}
.sdgs_process_flow dd { text-align: justify; padding: 2rem 1rem ; width: calc(100% - 200px); }

.sdgs_process_img img { max-width:800px; }
.sdgs_process_img { margin:0 0 5rem 0; }


@media screen and (max-width: 768px){
.sdgs_process_flow {
     flex-flow: column wrap;
     justify-content: flex-start;
     align-items: flex-start;
     width: 100%;
}
.sdgs_process_flow dt {
font-weight: bold;
padding: 1.5rem 0 0.3rem 0.5rem;
width: 100%;
letter-spacing:0.1rem;
text-align: justify;
}
.sdgs_process_flow dd {
font-size: 1rem;
padding: 0 0 1.5rem 0.5rem;
border: none;
width: calc(100% - 0.5rem);
}
}

/*　==============================　トップ　==============================　*/
/*　--------------------　キャッチ　--------------------　*/
.background-blend{
mix-blend-mode: hard-light;
margin: 0rem 0rem 20rem 0rem;
}
@media screen and (max-width: 480px) {
.background-blend{
background:  rgba(7,34,79,0.9);
margin: 5rem 2rem 9.5rem 2rem;
}
}
.top-catch{
color: #ffffff;
font-weight: 400;
font-size: 2.3vw;
}
@media screen and (max-width: 1600px) {.top-catch{font-size:2.8vw;}}
@media screen and (max-width: 1300px) {.top-catch{font-size:3.5vw;}}
@media screen and (max-width: 1024px) {.top-catch{font-size:3vw;}}
@media screen and (max-width: 768px) {.top-catch{font-size:3.1vw;}}
@media screen and (max-width: 480px) {.top-catch{font-size:6.5vw;}}
/*　--------------------　ピックアップ　--------------------　*/
.top-pickup{
margin: 1px;
}
/*　==============================　わたしたちについて　==============================　*/

.character-box{
letter-spacing: 0.3rem;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
align-items: center;
position: relative;
width: 100px;
height: 100px;
background: #000072;
}
.character-box:after{
display: block;
position: absolute;
bottom: 0;
right: 0;
border-left: 20px solid transparent;
border-bottom: 20px solid #ffffff; 
content: "";
}
.character-mr-l{
margin-left:3rem;
}
@media screen and (max-width: 1024px) {
.character-mr-l{
margin-left:2rem;
}
}
@media screen and (max-width: 800px) {
.character-box{
width: 75px;
height: 75px;
}
.character-mr-l{
margin-left:1rem;
}
}
@media screen and (max-width: 480px) {
.character-box{
width: 75px;
height: 75px;
margin:0 auto;
}
.character-mr-l{
margin-left:0rem;
}
}
/*　==============================　振動･騒音の問題について　==============================　*/
.case-box{
background-color: #000072;
color: #ffffff;
padding: 0.5rem 0rem;
width: 140px;
display: block;
}
/*　==============================　事業内容（追加分）　==============================　*/
@media screen and (max-width: 480px) {
.addTable td.tbl_left,
.addTable td.tbl_right {
width: 100%;
display:block;
}
.addTable td.tbl_right {
margin-bottom:0.5rem;
}
}
/*　==============================　ヘッダー　==============================　*/
/*　--------------------　オートナビに関する設定　--------------------　*/
.sub_list{
/*margin-top: 1rem;*/
background-color: #ffffff;
}
.fsNavMenuList li ul li a{
margin: 1.8rem 1rem!important;
padding: 0.2rem 0.5rem 0.1rem 0.5rem!important;
border-left: 3px solid #000072!important;
}
.fsNavMenuList li ul li a:hover{
opacity: 0.5!important;
transition:0.3s!important;
}
/*　--------------------　Fatナビに関する設定　--------------------　*/
.fat-nav li {
list-style-type: none;
text-align: left;
padding: 1.5rem 0 1.5rem 2rem;
font-size: 1.2rem;
border-bottom: 1px solid #969696;
}
.fat-nav{
background: rgba(45, 55, 60, 0.96);
}
.hamburger .hamburger__icon, .hamburger .hamburger__icon:before, .hamburger .hamburger__icon:after {
background-color: #00469b;
}

/*　--------------------　Fatnavi　--------------------　*/
#topfix_A {
position: absolute;
z-index: 50;
top: 0;
right: 0;
}
#topfix_B {
position: absolute;
z-index: 10;
top: 0;
right: 0;
}
/*　==============================　フッター　==============================　*/
/*　--------------------　PAGETOPボタン　--------------------　*/
.pagetop .fs_btn_text {
line-height: 1.6;
}
/*　--------------------　ページトップボタン　--------------------　*/
.pagetop_btm{
position: fixed;
z-index: 20;
bottom: 0;
right: 0;
}
.pagetop_btm .fs_btn{
line-height: 1.6;
}

/*　--------------------　サイトマップ　--------------------　*/
.sitemap_table {
padding: 0 0 0.5rem 1rem;
vertical-align: top;
width: 50%;
line-height: 1.5rem;
}
.sitemap_table a, .sitemap_table a:visited, .sitemap_table a:active ,
.f_link a , .f_link a:visited, .f_link a:active  {
color: #ffffff;
}
.sitemap_table a:hover ,
.f_link a:hover{
opacity: 0.5;
transition:0.3s;
}
@media screen and (max-width: 480px) {
.sitemap_table {
line-height: 1.2rem;
padding: 0.3rem 0 0.3rem 1.5rem;
width: 48%;
}
}
/*　--------------------　コンタクトボタン　--------------------　*/
.f_contact .fs_btn_text {
line-height:1.1rem;
}
.f_contact .fs_btn_text_sub{
font-size: 0.7rem;
}
.f_contact .fs_btn_text_main{
font-size: 0.9rem;
}
/*　--------------------　事業内容のコンタクトボタン　--------------------　*/
.business_contact .fs_btn {
width: 50%;
}
@media screen and (max-width: 480px) {
.business_contact .fs_btn {
width: 100%;
}
}
.business_contact .fs_btn_text {
line-height:1.1rem;
}
.business_contact .fs_btn_text_main{
font-size: 1.3rem;
}
/*　==============================　全体　==============================　*/
/*　--------------------　スマホ・タブレット版対応　--------------------　*/
/*　--------------------　スマホ　--------------------　*/
@media screen and (max-width: 480px) {
.sp_center {text-align: center!important;}
.sp_left {text-align: left!important;}
}
/*--------------------スマホ時消去--------------------*/
@media screen and (max-width: 498px) {
     .sp_none {  display: none; }}
/*----------スマホ時改行なし----------*/
@media screen and (max-width: 498px){
.sp_br_none br { display:none; }}

/*----------スマホ時改行あり----------*/
@media only screen and (min-width: 480px){
.sp_br br { display:none;}}

/*--------------------telリンク - スマホ版のみ--------------------*/
@media screen and (min-width: 768px) { a[href^="tel:"] {pointer-events: none;}}
/*----------タブレット縦時改行あり----------*/
@media only screen and (min-width: 768px){
.tb_br br { display:none;}}

/*　--------------------　タブレット用背景　--------------------　*/
@media screen and (max-width: 768px) {
#pt001-2Parent,#areaStyleArea3156,
#pt003-1Parent,#pt003-3Parent{
background-attachment: scroll!important;
}
}
@media screen and (max-width: 768px) {
#pt003-2Parent {
background-image: none!important;
}
}

/*　--------------------　色関係　--------------------　*/
.main_rgba01{
background: rgba(0, 70, 150, 0.5);
}
.main_rgba02{
background: rgba(230, 35, 32, 0.5);
}
.gray_rgba{
background: rgba(55, 55, 55, 0.5);
}
.white_rgba{
background: rgba(255, 255, 255, 0.5);
}
.background-blend-blue{
background:  rgba(7,34,79,0.9);
mix-blend-mode: hard-light;
}
.background-blend-blue-r{
background:  rgba(7,34,79,0.4);
mix-blend-mode: hard-light;
}
.gradation_bg{
background: linear-gradient(-45deg, #393999, #000072);
}
#footer{
background: linear-gradient(-45deg, #393999, #000072)!important;
}
/*　==============================　デフォルト　==============================　*/
/*　--------------------　マルチイメージのポインター無　--------------------　*/
.cuosor {
pointer-events: none ;
cursor: default ;
}
/*　--------------------　telリンク - スマホ版のみ　--------------------　*/
@media screen and (min-width: 480px) {
.tel_splink {
pointer-events: none;
}
}
a {
text-decoration:none;
}
h1 , h2 , h3 {
margin: 0px 0px 0px 0px;
padding: 0px 0px;
margin-top: 0px;
}
.hover_opacity:hover{
opacity: 0.8;
transition:0.6s;
}
.hover_opacity_img:hover {
opacity:0.7;
transition:0.6s;
background-color: rgba(255,255,255,0.3);
}
.br_radius{
border-radius:7px;
}
.box-shadow {
box-shadow: 0.1rem 0.1rem #cccccc;
-webkit-box-shadow: 0.1rem 0.1rem #cccccc;
-moz-box-shadow: 0.1rem 0.1rem #cccccc;
}
/*　--------------------　ページリスト　--------------------　*/
.tk_flex{
padding:1.5rem 0rem;
}
.tk_tags_Tags{
color: #ffffff;
background-color: #000072;
padding: 0.3rem 0.7rem 0.3rem 0.8rem;
}
.tk_title{
margin-bottom: 0.9rem!important;
}
.tk_title a{
color: #000072;
font-weight: 600;
}
.tk_kiji_ttl{
font-size:1.2rem!important;
margin-bottom: 0.2rem;
}
.tk_kiji_ttl a{
color: #000072!important;
font-weight: 600;
}
@media screen and (max-width: 480px) { 
.tk_tags_Tags{
padding: 0.3rem 0.7rem 0.1rem 0.8rem;
}
}
/*　==============================　文字に関する設定　==============================　*/
body {
font-weight: 500;
}
.bold {
font-weight: bold;
}
.italic {
font-style: italic;
}
.eiji {
font-family: "Lato", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", sans-serif;
}
.space_1{
letter-spacing: 0.1rem;
}
.space{
letter-spacing: 0.2rem;
}
.space_2{
letter-spacing: 0.4rem;
}
.space_3{
letter-spacing: -0.1rem;
}
.br-sp{
display:none;
}
@media screen and (max-width: 480px) { 
.tx-center{
text-align: center!important;
}
.tx-left{
text-align: left!important;
}
.br-sp{
display:block;
line-height:0rem;
}
.font-sp-s{
font-size: 2rem!important;
}
}
/*　--------------------　タイトル　--------------------　*/
/*　---------- 青ver ----------　*/
.ttl-name{
font-weight: 600;
letter-spacing: 0.3rem;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row nowrap;
}
.ttl-name:before{
content:" ";
background: url( "https://work.fine-security.com/trial/tri_svr/files/7915/1378/0048/ttl_line_left_pc.png" ) no-repeat ;
background-size: cover;
background-position: right!important;
vertical-align: middle;
display: inline-block;
flex:1;
margin-top: -1rem;
margin-right:1.5rem;
width: 35%;
height: 40px;
}
.ttl-name:after{
content:" ";
background: url( "https://work.fine-security.com/trial/tri_svr/files/6715/1378/0048/ttl_line_right_pc.png" ) no-repeat ;
background-size: cover;
background-position: left!important;
vertical-align: middle;
display: inline-block;
flex:1;
margin-top: -1rem;
margin-left:1.2rem;
width: 35%;
height: 40px;
}
@media screen and (max-width: 480px) {
.ttl-name{
letter-spacing: 0.15rem;
}
.ttl-name-s{
letter-spacing: -0.1rem!important;
font-size: 1.8rem!important;
}
.ttl-name:before{
background: url( "https://work.fine-security.com/trial/tri_svr/files/9115/1378/0213/ttl_line_left_sp.png" ) no-repeat ;
margin-top: -0.5rem;
margin-right:0.5rem;
width: 25%;
height: 15px;
}
.ttl-name:after{
background: url( "https://work.fine-security.com/trial/tri_svr/files/1215/1378/0213/ttl_line_right_sp.png" ) no-repeat ;
margin-top: -0.5rem;
margin-left:0.4rem;
width: 25%;
height: 15px;
}
}
/*　---------- 白ver ----------　*/
.ttl-w-name{
font-weight: 600;
letter-spacing: 0.3rem;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
align-items: center;
flex-flow: row nowrap;
}
.ttl-w-name:before{
content:" ";
background: url( "https://work.fine-security.com/trial/tri_svr/files/2215/1511/1436/ttl_line-white_left_pc.png" ) no-repeat ;
background-size: cover;
background-position: right!important;
vertical-align: middle;
display: inline-block;
flex:1;
margin-top: -1rem;
margin-right:1.5rem;
width: 35%;
height: 40px;
}
.ttl-w-name:after{
content:" ";
background: url( "https://work.fine-security.com/trial/tri_svr/files/4815/1511/1437/ttl_line-white_right_pc.png" ) no-repeat ;
background-size: cover;
background-position: left!important;
vertical-align: middle;
display: inline-block;
flex:1;
margin-top: -1rem;
margin-left:1.2rem;
width: 35%;
height: 40px;
}
@media screen and (max-width: 480px) {
.ttl-w-name{
letter-spacing: 0.15rem;
}
.ttl-w-name-s{
letter-spacing: -0.1rem!important;
font-size: 1.8rem!important;
}
.ttl-w-name:before{
background: url( "https://work.fine-security.com/trial/tri_svr/files/3815/1511/2424/ttl_line-white_left_sp.png" ) no-repeat ;
margin-top: -0.5rem;
margin-right:0.5rem;
width: 25%;
height: 15px;
}
.ttl-w-name:after{
background: url( "https://work.fine-security.com/trial/tri_svr/files/2215/1511/2407/ttl_line-white_right_sp.png" ) no-repeat ;
margin-top: -0.5rem;
margin-left:0.4rem;
width: 25%;
height: 15px;
}
}
.change-border-color-r {
  position: relative;
}
.change-border-color-r:before {
border-bottom: solid 3px #ffffff;
width: 15%;
position: absolute;
z-index: 1;
bottom: 0;
left: 34.5%;
content: "";
}
.change-border-color-r:after {
border-bottom: solid 3px #ffffff;
width: 15%;
position: absolute;
bottom: 0;
left: 49.5%;
content: "";
}
.change-border-color-r-n {
  position: relative;
}
.change-border-color-r-n:before {
border-bottom: solid 3px #ffffff;
width: 6%;
position: absolute;
z-index: 1;
bottom: 0;
left: 44.1%;
content: "";
}
.change-border-color-r-n:after {
border-bottom: solid 3px #ffffff;
width: 5.5%;
position: absolute;
bottom: 0;
left: 50%;
content: "";
}
@media screen and (max-width: 480px) {
.change-border-color-r-n {
  position: relative;
}
.change-border-color-r-n:before {
border-bottom: solid 3px #ffffff;
width: 15%;
position: absolute;
z-index: 1;
bottom: 0;
left: 34.5%;
content: "";
}
.change-border-color-r-n:after {
border-bottom: solid 3px #ffffff;
width: 15%;
position: absolute;
bottom: 0;
left: 49.5%;
content: "";
}
}
/*　--------------------　Google font　--------------------　*/
.googlefont {
font-family: 'Roboto', 游ゴシック Medium,Yu Gothic Medium,游ゴシック体,YuGothic,sans-serif;
}
/* cyrillic-ext */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/0eC6fl06luXEYWpBSJvXCBJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
/* cyrillic */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/Fl4y0QdOxyyTHEGMXX8kcRJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/-L14Jk06m6pUHB-5mXQQnRJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/I3S1wsgSg9YCurV6PUkTORJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/NYDWBdD4gIq26G5XYbHsFBJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/Pru33qjShpZSmG3z6VYwnRJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Roboto';
font-style: normal;
font-weight: 300;
src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v16/Hgo13k-tfSpn0qi1SFdUfVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}


/*　———　YouTubeはみだし問題解除　———　*/
/* <div class="movie-wrap"></div> で囲う */
.movie-wrap {
position: relative;
padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
height: 0;
width: 100%;
overflow: hidden;
}
.movie-wrap iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@media screen and (max-width: 498px) {
.movie-wrap {
width: 100%;
}
}