/*
Theme Name: fujiikusetu-child
Template: understrap
*/

@import url('https://fonts.googleapis.com/css2?family=Kosugi&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,  caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
:focus {outline: 0;}

ol, ul {list-style: none;}
table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: 0;}
article, aside, details, figcaption, figure, footer, header,  menu, nav, section {display: block;}

* {
  box-sizing: border-box;
}

html{ font-size: 62.5% ; scroll-behavior: smooth;   scroll-padding-top: 70px;} /*初期値16pxの62.5%でルートが10px*/
body{
	line-height: 1.6;
	background:#fff;
	font-size: clamp( 14px, 1.6vw, 16px);
	font-family: 'Noto Sans JP', sans-serif;
	color:#000; -webkit-text-size-adjust: 100%;
    min-height: 100vh; 
	 font-weight: 400;
    
}


/*全てをクリア*/
.clear {clear: both;} 

/* new clearfix */
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */


/* リンク設定
------------------------------------------------------------*/
a,a:visited{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
 color:   #0255aa; transition: all 0.5s ease 0s;
  cursor: pointer;}

a:hover, a:active{transition: all 0.5s ease 0s;
outline: none;
color:#ff6c08; text-decoration: none;}

 a:hover img{opacity:.7; }

/**** Clearfix ****/

/* レイアウト
------------------------------------------------------------*/
.inner{margin:0 auto;max-width:1150px; width:98%; position: relative;  }
.inner2{margin:0 auto;max-width:1000px; width:95%;position: relative;}
.inner3{margin:0 auto;max-width:860px; width:85%;position: relative;}
.inner4{margin:0 auto;max-width:650px; width:85%;position: relative;}

#wrapper{margin:0 auto 0px; 
padding:0 0 0px; overflow: hidden; 
	display: flex;	background: url("/img/common/headerback.png") 0 0 no-repeat; background-size:100% auto;
  flex-direction: column;
  min-height: 100vh; 

}
/*.googlefont */

.lato-small {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight:600;
  font-style: normal;
}
.kosugi-regular {
  font-family: "Kosugi", sans-serif;
  font-weight: 400;
  font-style: normal;
}


/* 共通変更 フォントサイズ　*/
.font12 { font-size: clamp( 12px, 1.2vw, 12px); }/*  10px 最大　2px*/
.font14 { font-size: clamp( 14px, 1.4vw, 14px); }/*  12px 最大　14px*/
.font16 { font-size: clamp( 14px, 1.6vw, 16px); }/*  14px 最大　16px*/
.font18 { font-size: clamp( 16px, 1.8vw, 18px); }/*  16px 最大　18px*/
.font20{ font-size: clamp( 16px, 2.0vw, 20px); }/*  16px 最大　20px*/
.font22 { font-size: clamp( 18px, 2.2vw, 22px ); }/*  18px 最大　22px*/
.font24{ font-size: clamp( 18px, 2.4vw, 24px); }/*  18px 最大　24px*/
.font26{ font-size: clamp( 18px, 2.6vw, 26px); }/*  20px 最大　26px*/
.font28 { font-size: clamp(20px, 2.8vw, 28px); }/*  20px 最大　28px*/
.font30{ font-size: clamp(24px, 3.0vw, 30px); }/*  24px 最大　30px*/
.font34{ font-size: clamp( 26px, 3.4vw, 34px); }/*  26px 最大　34px*/
.font36{ font-size: clamp( 28px, 3.6vw, 36px); }/*  28px 最大　36px*/
.font40{ font-size: clamp(30px, 4.0vw, 40px ); }/*  30px 最大　40px*/
.font42 { font-size: clamp( 32px, 4.2vw, 42px );}/*  32px 最大　46px*/
.font48 { font-size: clamp(34px, 4.8vw, 48px );}/*  34x 最大　48px*/


.blue{ color: #007ec4;}
.blue2{ color: #0255aa;}
.flex{ display: flex;}
.wrap{flex-wrap: wrap;}
.justify-content{justify-content: space-between;}
.reverse{flex-direction: row-reverse;}

/* ヘッダー
----------------------------------*/
#glovalheader{display: block; 
  z-index: 90;
  cursor: pointer;
  pointer-events: auto;  
 transition: all 0.5s ease 0s;  font-weight: 400;
 position: fixed; /*ポジションを固定する*/
  top: 5px;
 width:100%; text-align: center;
}

#glovalheader.scroll{background: #fff; top: 0px;}


#glovalheader h1{ float: left; width:25%; min-width: 250px; padding:0; margin:23px 0 0px 0px ;  }
#glovalheader li a:hover{color: #fff;  background: #1999e7;transition: all 0.5s ease 0s;} 
#glovalheader li:last-child a{color: #fff;  background: #ff6c08;} 

.home #glovalheader li.homebtn a{color: #fff;  background: #1999e7;transition: all 0.5s ease 0s; border-radius: 30px;} 
#glovalheader li:last-child a:hover{color: #fff;  background: #1999e7;transition: all 0.5s ease 0s;} 
#glovalheader li a{ color: #000;  text-align: center;
display:block;  padding: 5px; border-radius: 30px;
text-decoration: none;transition: all 0.5s ease 0s;
} 


@media only screen and (min-width: 1000px){
.mob.logo,.headermynavi{ display:none;}
.el_humburger {  display: none;}
 .mainView{  margin: 0 0;}   
#glovalheader .navi{ float: right; text-align: right;  margin:23px 0 0 0;width:70%;  }
#glovalheader .navi ul{margin: 0 auto 0px 0;width:95%; border-bottom: 1px solid #fff;  text-align: center;  height:50px; background: rgba( 255,255,255,0.8); border-radius: 30px; padding: 7px 0 0 0;}
#glovalheader .navi li{ display: inline-block; text-align: center; vertical-align: middle; width:calc( 100% / 7 - 10px ); margin: 0 2px; }

    
 }
@media only screen and (max-width: 1000px){
.toptxt{display: none; }
#glovalheader { margin:0px ;  }
#glovalheader h1{ float: left; width: 250px; padding:0; margin:15px 0 10px 0px ;  }

.mainView{ margin:0 0 0 0;} 
/*ハンバーガーボタン*/
.el_humburger {
  position: fixed; display: block;
  top:10px;  
  right: 10px;  
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding:15px 10px ;
  z-index: 65;
  cursor: pointer;
  pointer-events: auto;
  color: #000;  width: 60px; background: rgba( 255,255,255,0.8); height: 60px; 
  text-align: right;}
    .js_humburgerOpen .el_humburger{ width:60px; margin-right: 10px; }
.el_humburger_wrapper {
    margin-bottom: 5px;
    width:40px;
  display: inline-block; }
.js_humburgerOpen .el_humburger_text.el_humburger_text__menu {
  display: none; }
.el_humburger_text.el_humburger_text__close {
  display: none; }
.js_humburgerOpen .el_humburger_text.el_humburger_text__close {
  display: block; }

.el_humburger_text svg path {
    -webkit-transition: all 200ms cubic-bezier(0.16, 0.52, 0.25, 1);
    -o-transition: all 200ms cubic-bezier(0.16, 0.52, 0.25, 1);
    transition: all 200ms cubic-bezier(0.16, 0.52, 0.25, 1);
    fill: #000; }
  .js_humburgerOpen .el_humburger_text svg path {
    fill: #000; } 
  .el_humburger span.el_humburger_bar {
    left: 0;
    top: 0;}
.el_humburger span.el_humburger_bar {
  display: block;
  margin: 0 0 8px; text-align: left;
  height:4px;
  background: #005bab; border-radius: 3px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out; }
.el_humburger span.el_humburger_bar.bottom {margin-bottom: 0; }
.js_humburgerOpen .el_humburger span.el_humburger_bar.top {
  -webkit-transform: translateY(12px) rotate(-45deg);
  -ms-transform: translateY(12px) rotate(-45deg);
  transform: translateY(12px) rotate(-45deg); }
.js_humburgerOpen .el_humburger span.el_humburger_bar.middle { opacity: 0; }
 .js_humburgerOpen .el_humburger span.el_humburger_bar.bottom {
  -webkit-transform: translateY(-11px) rotate(45deg);
  -ms-transform: translateY(-11px) rotate(45deg);
  transform: translateY(-11px) rotate(45deg); 
 width: 100%;margin-top: 8px;}
.el_humburgerButton.el_humburgerButton__close {
  top: 2%;
  right: 2%; }
    
 
.el_humburgerButton__close span.el_humburger_bar {
  display: block;
  width: 55px;
  margin: 0 auto;
  height: 4px; }
 
.el_humburgerButton__close span.el_humburger_bar.top {
  -webkit-transform: translateY(5px) rotate(-45deg);
  -ms-transform: translateY(5px) rotate(-45deg);
  transform: translateY(5px) rotate(-45deg);}
 
.el_humburgerButton__close span.el_humburger_bar.bottom {
  -webkit-transform: translateY(-6px) rotate(45deg);
  -ms-transform: translateY(-6px) rotate(45deg);
  transform: translateY(-6px) rotate(45deg); }
nav.navi {
  position: fixed;
  right: 0; top:0;
  height: 100%;
  background-color: #fff !important;
  width: 100%;
  z-index: 60;
  padding-top:20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 600ms ease-out;
  -o-transition: all 600ms ease-out;
  transition: all 600ms ease-out;
  transform:translateZ(0) translateX(100%);
  overflow: auto; }
  .js_humburgerOpen .navi {
    transform:translateZ(0) translateX(0); 
}
.mob.logo{margin: 5px auto; width:60%; max-width: 210px;}
#glovalheader .navi li{ display:block; vertical-align: top; margin: 0em auto;  font-size: 18px; position: relative; width:90%; text-align: left; }
#glovalheader .navi ul { text-align: center;margin: 20px auto 0px; }
#glovalheader .navi li a{ position: relative; display: block; padding: 0.5em 2em;  text-align: left; }
#glovalheader .navi li a:before{
font-family: "Font Awesome 7 Free";
 font-weight: 900; 
  content: "\f0da";  position: absolute;   top:50%; transform: translateY(-50%);
  left: 1em;

}  
    #glovalheader li:last-child a{color: #fff;  background: #ff6c08;} 
    
    
    #glovalheader.scroll{background: rgba(255,255,255,1);}
 }

@media only screen and (max-width: 500px){
/*ハンバーガーボタン*/
.el_humburger {
  padding:15px 10px ;}

.el_humburger_wrapper {
    margin-bottom: 5px;
    width: 45px; }  
	
}

@media (max-width: 768px) {
  html {
    font-size: 50%; /* 8px相当 */
  }
}


/* フッター
----------------------------------*/
.footercontact .inner4{ margin: 1em auto 3em; text-align: center;}
.footercontact p span{display: inline-block; vertical-align: middle;}
.footercontact a,.footercontact b{ display: inline-block; vertical-align: middle; width:46%; max-width: 260px; text-align: center; margin: 2% 1%}
.footercontact a{color: #fff;   background:  #ff6c08; border-radius: 40px;padding: 0.2em 0; transition: all 0.5s ease 0s;}
.footercontact a:hover{   background:  #1999e7; transition: all 0.5s ease 0s; }
.footercontact a .fa-envelope{color: #fff; transition: all 0.5s ease 0s; display: inline-block;  margin-right: 0.2em;}
.footercontact b{color: #fff; background: #1999e7;border-radius: 40px;padding: 0em 0; transition: all 0.5s ease 0s;}
.footercontact b .fa-phone-volume{color: #fff; transition: all 0.5s ease 0s; display: inline-block;  margin-right: 0.2em;}
.footercontact dl{ margin: 1em auto 0;}

.footercontact dl  dt img,.footercontact dl  dt span{ display: inline-block; vertical-align: middle; margin:0 0.2em 0.5em;}
.footercontact dl  dt img{ width:90px; height: auto;} 
.footercontact dl  dd{ text-align:center; line-height: 1.2;} 
.footercontact dl  dd span{  display: inline-block; vertical-align: middle; margin-right: 1.5em;} 

footer.global{  color: #fff; padding: 0.5em 0; background: #1999e7;}
footer.global nav ul{  width:100%;}
footer.global nav li { color: #fff; position: relative; margin: 0;}
footer.global nav li a{ color: #fff; display: block; padding: 0.5em 1.5em 0.5em 0.8em ; background-image: linear-gradient(#fff, #fff);
  background-repeat: no-repeat;
  background-position: bottom right; /* 下線の初期位置 */
  background-size: 0 1px; /* 下線のサイズ（横幅、高さ） */
  transition: background-size 0.3s;}
footer.global nav li a:hover{ background-position: bottom left; /* 下線のホバー時位置 */
  background-size: 100% 1px; /* 下線の横幅を100%にする */}
footer.global nav li:last-of-type{
    margin-left: auto;
}
footer.global nav li:not(:first-child):before{ content:"|"; display: inline-block; position: absolute; left:-0.5em; top:50%; transform:translateY(-50%);}
footer.global nav li:last-of-type:before{ display: none;}

footer.global nav li:last-of-type{
    margin-left: auto;padding: 0.15em 0 0;
}
footer.global nav li:last-of-type a:before{
font-family: "Font Awesome 7 Free";
 font-weight: 900; 
  content: "\f105";  position: absolute;   top:50%; transform: translateY(-50%);
  left: 0em;

}
p.address{  text-align: center; padding:1em 0 0; border-top:1px solid #fff; padding: 0.5em 0 0; }


#page-top1{
  display: block;
  position: fixed;
  z-index: 9999;
  bottom: 20px;
  right: 40px;
  width: 40px;
  height:40px;
  text-align: center;
  text-decoration: none; 
  transition: .5s; font-size: 14px; font-size: 1.4rem; 
	vertical-align:middle;background: #005bab;  border-radius:50%;  }
a#page-top1 {  color: #fff !important;}
#page-top1 span {display: block; margin:0 auto 0;  font-size: 20px; font-size: 2.0rem; }

.alignleft{ float:left;}
.alignright{ float:right;}
.center{ text-align:center;}


 /* 共通
----------------------------------*/
.mob{ display:none!important;}

@media only screen and (max-width:999px){
.pc{ display:none !important;} 
.mob{ display:block!important;}}


#contents{ margin: 110px 0 0; }

/* ホーム
----------------------------------*/
.homeheader { position: relative;}
.slider{width:95%; max-width: 860px;  margin:0px auto 0;  text-align: center;  height: auto; filter: drop-shadow(4px 4px 4px rgba(0,0,0,0.6)); }
.slider li img{width: 100%; height: auto;  border-radius: 30px;}

.maingazomoji {position: absolute; top:0%; left:0; width:100%; height: 100%;}
.maingazomoji .inner{ position: relative;  height: 100%; }
.maingazomoji  h1{  width:80%;  position: absolute; left:50%; top: 40%; transform: translate(-50%,-40%); max-width:435px; }
.maingazomoji h2{ position:absolute;  left:50%; bottom:35px; transform: translateX(-50%); width:95%;max-width:696px; }
a.more{ display: block;  position:  relative; padding: 0.5em 1em; transition: all 0.5s ease 0s;}
a.more .fa-arrow-right{ position: absolute; border-radius: 50%; right:20px; top:50%; transform: translateY(-50%);}
.home article{ padding:40px 0;}
.home article.topbusines{margin:0 auto 45px; padding:60px 0 0 0}
.topbusines img.img{ width:48%; height: auto;  display: block;border-radius:20px;}
.topbusines  img.title{ max-width:342px; width:48%;  height: auto; display: inline-block; vertical-align: middle;}
.topbusines div { padding: 30px 0 0 ;　align-items: flex-start;}
.topbusines div div{ padding: 0; width:50%; }
.topbusines div div h3{ margin: 0 0 0.5em; padding: 0;}
.topbusines a.more { margin: 1em 0 0 auto; width:10em; }
.topbusines a.more .fa-arrow-right{ font-size: 30px; background: #ff6c08; color: #fff; width:1.5em; height: 1.5em; line-height: 1.5em;transition: all 0.5s ease 0s;}
.topbusines a.more:hover .fa-arrow-right{  background: #0255aa; transition: all 0.5s ease 0s;}



/* 左右いっぱいに伸びた横線 */
.heading {
  text-align: center; /* 全体を中央寄せ */
  display: flex;
  flex-direction: column; /* 縦並び */
  align-items: center;
  gap: 0.2em; /* 英語と日本語の間隔 */
}

.heading .en {
  display: flex;
  align-items: center;
  width: 100%; /* 横いっぱいに広げる */
  gap: 1em; /* 線と文字の余白 */
}

.heading .en::before,
.heading .en::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #ff6c08; /* 線の色・太さ */
}
.topconstruction { background: url("/img/index/back.jpg") ;  padding:1em 0 0; color: #fff;}
.topconstruction .heading .en::before,
.topconstruction .heading .en::after {
  border-bottom: 1px solid #fff; /* 線の色・太さ */
}
.slider2{ margin: 1em auto 0em;}
.slider2 a{ color: #fff;}
.slider2 img{ width:98%; height: auto; mix-blend-mode: normal; border-radius: 10px;}
.slider2 h3{ text-align: left; position: relative;margin: 0 1%;}
.slider2 h3 span{ display: block !important;}
.slider2 h3  .fa-arrow-right{  position: absolute; right: 1%; bottom: 0; color: #fff; width:1.5em; height: 1.5em; line-height: 1.5em;transition: all 0.5s ease 0s;}


.home article.topcompany{ padding:60px 0 0px;}
.topcompany ul{ text-align: center; margin:2em auto;justify-content: space-around; width: 95%; max-width: 800px;}
.topcompany li{ width:30%; margin: 0 1.25%; }
.topcompany a{color: #fff;  display: block;  background: #1999e7; border-radius: 40px;padding: 0.4em 1em; transition: all 0.5s ease 0s; position: relative;}
.topcompany  a:hover{   background: #ff6c08;  transition: all 0.5s ease 0s; }
.topcompany  a .fa-arrow-right{ font:16px; position: absolute; right:10px; top:50%; transform:  translateY(-50%);background: #fff; color: #1999e7; border-radius: 50%; width:1.5em; height: 1.5em; line-height: 1.5em;transition: all 0.5s ease 0s;}
.topcompany  a:hover .fa-arrow-right{  color: #ff6c08; transition: all 0.5s ease 0s;}


.req_news{ background: url("/img/common/back.png") 50% 0; background-size: 100% auto; padding: 50px 0 0px;}
.topreq {position: relative;  min-height: 270px;  }
.topreq img {position:absolute; border: 1px solid #ff6c08; border-radius: 50%; }
.topreq img.req3 { width:140px; height: auto; top:70%;  left:40px; border-radius: 10px; }
.topreq img.req1 { width:140px; height: auto; top:-50px;  left:-10px; }
.topreq img.req2 { width:109px; height: auto; top:30px;  left:140px; }
.topreq img.req4{ width:109px; height: auto;top:-20px;  right:-30px; }
.topreq img.req5{  width:140px;height: auto;top:50%;  right:40px; }
.topreq ul{ display: block; margin: 30px auto; width:100%; text-align: center;  }

.topreq ul li{ display: inline-block; vertical-align: middle; width:190px; margin: 0 1.25%; }
.topreq ul a{color: #000; background: #fff;    display: block; border: 1px solid  #ff6c08;  border-radius: 40px;padding: 0.4em 1em; transition: all 0.5s ease 0s; position: relative;}
.topreq ul a:hover{   background: #ff6c08;  color: #fff; transition: all 0.5s ease 0s; }
.topreq ul a .fa-arrow-right{ font:16px; position: absolute; right:10px; top:50%; transform:  translateY(-50%);background: #ff6c08; color: #fff; border-radius: 50%; width:1.5em; height: 1.5em; line-height: 1.5em;transition: all 0.5s ease 0s;}
.topreq ul a:hover .fa-arrow-right{  color: #ff6c08; background: #fff; transition: all 0.5s ease 0s;}


.newstop { background: rgba( 255,255,255,0.8); margin: 1em 0 0; }
.newstop .heading{
  text-align: left; /* 全体を中央寄せ */
  display: block;
  align-items:left;
}

.newstop .heading .en {
  display: flex;
  align-items:left;
  width: 100%; /* 横いっぱいに広げる */
  gap: 1em; /* 線と文字の余白 */
}

.newstop .heading .en::before{display: none;}
.newstop .heading .en::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #ff6c08; /* 線の色・太さ */
}
.newstop ul{ margin: -1.5em 0 0 200px; width:calc( 100% - 200px ); border-top: 1px dotted #0268b6;}
.newstop li {position: relative;  padding:0.5em  0.8em; border-bottom: 1px dotted #0268b6;}
.newstop li a{display: block; }
.newstop li h3,.newstop li span {  display:  inline-block; vertical-align:middle;}
.newstop li  span {  margin-right: 0.8em;color: #000; padding:0; width:8em; text-align:left; }
.newstop li h3 { text-align: left;}

.newstop a.more{ width:10em; margin: 2em  0 0 auto;position: relative; display: block;}
.newstop a.more:hover{   background: #ff6c08;  color: #fff; transition: all 0.5s ease 0s; }
.newstop a.more .fa-arrow-right{ font:16px; position: absolute; right:10px; top:50%; transform:  translateY(-50%);background: #ff6c08; color: #fff; border-radius: 50%; width:1.5em; height: 1.5em; line-height: 1.5em;transition: all 0.5s ease 0s;}
.newstop a.more:hover .fa-arrow-right{  color: #ff6c08; background: #fff; transition: all 0.5s ease 0s;}
.insta {background-size: 100% auto; text-align: center; color: #fff; min-height: 600px;position: relative;
background-image: url('/img/common/back2.png'), url('/img/common/back3.png');
  background-position: top center, bottom center; /* 上部中央、下部中央に表示 */
  background-repeat: no-repeat;
  height: 100vh; /* 画面の高さに合わせて表示 */}
 a.instag { display: block;  text-align: center; margin: 2em auto; width:16em; text-align: center; color: #fff; background: #007ec4!important; border-radius: 40px;padding: 0.2em 0; transition: all 0.5s ease 0s;}
 a.instag:hover{   background:  #1999e7!important; transition: all 0.5s ease 0s; }



/*サブページ*/
section.sub{  padding-bottom: 6em !important;}

.subheader{ margin: 40px auto 0;  padding: 5px 0 0px;}
.subheader h1 {
  display: flex;
  align-items: center;
  width: 100%; /* 横いっぱいに広げる */
  gap: 1em; /* 線と文字の余白 */
}.subheader h1::after {
  content: "";
  flex: 1;
  border-bottom: 1px solid #ff6c08; /* 線の色・太さ */
}
.subheader h1 span{position: absolute; left:-0.5em; top:-23px;  display: inline-block; margin-right:0;}

.subheader h2{ text-align: right; margin: -0.5em 0 0 0; }
.sub article { margin:0px auto 80px;padding: 50px 0 0;z-index: 1; }
.sub article h2 { margin: 0px auto 1em; text-align: center;
    padding: 15px 10px;/*文字回りの余白（上下 左右）*/
    display: block;
    position: relative; z-index: 1;
}
.sub article h2 span {
  position: relative;
  display: block;
}
.sub article h2  span:before {
  content: '';
  position: absolute;
  bottom: -15px;
  display: block;
  width: 2em;
  height: 2px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  background-color: black;
  border-radius: 6px;
}
.sub article h2 b{ display: block; margin: 1em auto 0;}
.sub article h3 {
  position: relative;
padding-left: 1em;
  text-shadow: 0 0 2px white;line-height: 1;
}
.sub article h3:before {
  content: "";
  position: absolute;
  border: 12px solid #fff;
  width:90px;
  height: 90px;
  border-radius: 50%;
  top: 50%;
  /* border: dashed 1px white; */
  left: -15px;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: -1;
}
.sub article.third h3:before {
  border: 12px solid #cfecf8;

}
.sub article h3 span{ display: block;}

.sub article table {
     margin: 0 auto;
  border-collapse: collapse;
 
}
.sub article table th, .sub article table td {
  border-bottom: 2px solid #c1c7c6;
  padding: 1em;
}
.sub article table th {
  border-bottom: 2px solid #005bab;
  text-align:left;
  width: 20%;
  min-width: 4em; 
}


.sub article table ul li{position: relative; padding-left: 1.5em; margin: 0.5em 0; }
.sub article table ul li:before{ position: absolute;
font-family: "Font Awesome 7 Free";
 font-weight: 900; 
 content: "\f111"; font-size: 10px;
 top:5px; left:00; color: #005bab;transition: all 0.5s ease 0s; 
}

.sub article .honbun { margin: 1em 0 1.5em 4em;}

/* ol デザイン */
.sub article.no04 ol {
  counter-reset: li;
}
.sub article.no04 ol > li:before {
  position: absolute;
  font-weight: bold;
  counter-increment: li;
  content: counter(li) "";
  left: -34px;
  top: -1px;
  color: #fff;
  width: 24px;
  height: 24px;
  font-size: 14px;
  text-align: center;
  box-sizing: border-box;
  line-height: 1;
  background: #1692ce;
  padding: 6px 0;
}
.second {background-size: 100% auto;position: relative;
background-image: url('/img/common/subback.jpg');
  background-position: top center;
  background-repeat: no-repeat;}


/*会社概要*/
.message div{ position: relative;}
.message p{ line-height: 1.8;}
.message p b{ display: block;}

.balloon {
  position: relative; border-radius: 50px;
  padding: 30px ;
  margin: 0 0 0; width:90%;
  text-align:left !important;
  background-color:#fff; border:3px solid #1999e7;
}
.message div img{ position: absolute; right:20%; bottom:-70px; width:200px; height: auto; transform: rotate(10deg);}

.about dt,.about dd{ padding: 0.8em; border-bottom: 1px solid #1999e7}
.about dt{ width:10em;}
.about dd{ width:calc(100% - 10em);}
.about dd ul li{ position: relative;  padding-left: 1.2em; }
.about dd ul li:before{ position: absolute;
font-family: "Font Awesome 7 Free";
 font-weight: 900; 
 content: "\f111"; font-size: 10px;
 top:5px; left:00; color: #005bab;transition: all 0.5s ease 0s; 
}
.about dd ul ul{  margin:0em 0 0 1em;}
.about dd ul ul li:before{ position: absolute;
font-family: "Font Awesome 7 Free";
 font-weight: 900; 
 content: "\f111"; font-size: 3px; color: #000;
 top:10px; left:5px; transition: all 0.5s ease 0s; 
}

.about dd span,.about dd b{  display: inline-block; vertical-align: middle; padding: 0em 0 0.5em; margin-bottom: 0.5em; font-weight: 300; }
.about dd span{ width:18em; }
.about dd b{ }


.sub article.access .honbun { margin: 1em 0 1.5em 4em;}
.access dl dt,.access dl dd{ display: inline-block; vertical-align: middle;}
.access dl  dt img,.access dl  dt span{ display: inline-block; vertical-align: middle;}
.access dl  dt img{ width:60px; height: auto;} 
.access dl  dd{ text-align: left; margin-left: 1em; line-height: 1.2;} 
.access dl  dd span{  display: inline-block; vertical-align: middle; margin-right: 1.5em;} 
.access iframe{ margin: 30px auto 0; width:100%; height: 250px; display: block;}



/*事業案内*/
.sub.business article h3{  line-height: 1.3;}
.sub.business article dl{  background: #ffe8d9; border: 1px solid #ff6600;  padding:0.8em 1.5em; border-radius: 10px; text-align: left; margin: 1em auto; }
.sub.business article dt,.sub.business article dd{  display: inline-block; vertical-align: top;}
.sub.business article dd{   margin-left: 1em;}


/*個人情報保護方針*/
.page-id-3 .sub ul{ margin:0 0 }
.page-id-3 .sub ul li:before{
font-family:  "Font Awesome 7 Free";
font-weight: 900;
position: absolute; top:0; left: 0px;
content: "\f14a"; }
.page-id-3 .sub ul li {
  line-height: 1.5em; position: relative; padding-left: 18px; }
.page-id-3 .sub p {text-align: left;
 margin:2em 0;}
.page-id-3 .sub  dt{ font-size:18px; margin: 1em 0 ;position: relative; padding-left: 18px; }
.page-id-3 .sub  dt:before{
font-family:  "Font Awesome 7 Free";
font-weight: 900;
position: absolute; top:5px; left: 0px; color:#5c9ee7; font-size: 14px;
 content: "\f111";  
}
.page-id-3 .sub  dd{  margin: 0 0 3em 1em;}
.page-id-3 .sub .shomei{ border-left:2px solid #000; padding-left: 1em; margin: 1em 0 0 auto; width:25em;}
.page-id-3 .sub .shomei h3{ margin-left: 0!important;  padding: 0 !important;}
.page-id-3 .sub .shomei p{  margin: 0.5em 0 0 0 !important; padding: 0!important }
.page-id-3 .sub .shomei p span{   display: inline-block; margin-left: 1em;}



/* ニュース
------------------------------------------------------------*/
section.news ul li{  margin: 0 0 80px; padding:30px;background: rgba( 255,255,255,0.8); padding: 2em 3em; border-radius:40px;}
section.news ul li:last-child{ border: none;}
section.news ul li:before{ display: none; }
section.news ul li h3{  border-bottom: 1px dotted  #005bab;padding-bottom: 0.2em; }

section.news ul li span.days{ display: block; text-align: right;  margin: 0.5em 0 0;  }
section.news ul li .honbun{  margin: 20px auto; width:95%; max-width: 920px;
	text-align: left;}
section.news ul li .honbun a{ display: block; color:#003399; width:auto; 
  position: relative; margin: 0.5em 0 0.5em 2em; padding: 3px 0 0 30px;}
section.news ul li .honbun a:hover{width:auto;  color:#FF7B4D; }
section.news ul li .honbun a.link:before{
font-family:  "Font Awesome 7 Free";
position: absolute; top:0; left: 0px;
 font-weight: 900; 
  content: "\f360";  font-size: 20px;
}
section.news ul li .honbun a.file:before{
font-family:  "Font Awesome 7 Free";
position: absolute; top:0; left: 0px;
 font-weight: 900; 
  content: "\f381";  font-size: 20px;
}
section.news ul li .photo{  margin: 40px auto; width:auto; max-width: 90%;  text-align: center; }
section.news ul li .photo img{ width:auto;  max-width: calc(75% - 16px); height: auto; margin: 8px;  display:  inline-block; vertical-align: top; }

.tablenav {
color: #000;
background: rgba( 255,255,255,0.8); 
margin: 1em auto;
line-height:2em; 
text-align:center;
  font-weight: 400;
  font-style: normal; 
}

a.page-numbers, .tablenav .current {
color: #000;
padding:0.8em 1.1em;font-family: "Lato", sans-serif;
border:solid 1px #005bab;
text-decoration:none; border-radius: 5px; width:2em;font-size: 20px;
}

a.page-numbers:hover {
color:white;
background: #005bab；
}

.tablenav .current {
color: white;
background: #005bab;
border-color: #005bab;
}

.tablenav .next, .tablenav .prev {
border:0 none;
background:transparent;
text-decoration:underline;
font-size:smaller;
}



/*採用情報*/

.reqnav{background:rgba( 255,255,255,0.8); border-radius: 5px; display: block;}
.reqnav a{ display: inline-block; vertical-align: middle; margin: 0.5em 1em;}

.sub .footernav .reqnav{  text-align: center; background: #fff; border:1px solid #1999e7;}
.page-template-page-req #contents article li  {border-bottom: 1px dotted #0062b0; margin: 0.5em; 
padding:0.5em ;
}
.page-template-page-req #contents article li a:before{ 
font-family: "Font Awesome 5 Free";
  font-weight: 900;  font-size:16px;
  content: "\f105";  margin:0 0.2em 0 0;
}
.page-template-page-req  article h3,.single-req article h3{font-size:26px; font-size:2.6rem;
}

form#mailformpro { padding: 15px;}

body.single-req .sub { padding: 0 0 80px; }
body.single-req  #contents a.recruit{ display: block;  text-align: right; margin: 0 0 1em;  }
body.single-req  #contents a.recruit::before{ 
font-family: "Font Awesome 5 Free";
  font-weight: 900;  font-size:16px; margin-right: 0.2em;
  content: "\f151"; 

}

.single-req  .sub .recruit { background: rgba( 255,255,255,0.8); padding: 2em; margin: 1em auto; width:95%;  border-radius: 20px; }
.single-req  .sub h2{  text-align: center;}
.single-req  .sub p.honbun{ margin: 20px auto; width:95%; max-width:800px; }
.single-req  .sub .linksaki{ margin: 20px auto;width:90%; max-width:750px; }
.single-req  .sub .linksaki a::before{ 
font-family: "Font Awesome 5 Free";
  font-weight: 900;  font-size:16px; margin-right: 0.2em;
  content: "\f0c1"; 

}
.single-req  .sub .renrakusaki{ margin: 2em auto; width:calc( 90% - 40px ) ; max-width:600px; border: 1px solid #000; padding:10px 20px; border-radius: 10px; text-align: left;  }
.single-req  .sub .renrakusaki li{ border-bottom: 1px dotted #000; padding: 5px; margin: 0.5em auto; width:90%;}
.single-req  .sub .renrakusaki li:first-child{ font-size: 18px; font-size: 1.8rem; margin: 0 0 0.5em;}
.single-req  .sub  li.tel::before{ 
font-family: "Font Awesome 5 Free";
  font-weight: 900;  font-size:16px; margin-right: 0.4em;
  content: "\f098"; 
}
.single-req  .sub  li.tel{ font-size: 18px; font-size: 1.8rem; font-family: 'Lato', sans-serif; }
.single-req  .sub  li.mail::before{ 
font-family: "Font Awesome 5 Free";
  font-weight: 900;  font-size:16px; margin-right: 0.4em;
  content: "\f199";} 

.single-req  .sub dl{ margin: 30px auto 60px; width:95%; max-width:800px;border-bottom: 1px solid #999;  }
.single-req  .sub dl dt,.single-req  .sub dl dd{  display: inline-block ; margin: 10px 0 0; padding: 10px 10px; border-top: 1px solid #999; vertical-align: top;}
.single-req  .sub dl dt{ width: calc( 20% - 20px )}
.single-req  .sub dl dd{  width: calc( 80% - 20px );}
.single-req  .sub  dl.mailform {margin: 30px auto  0 !important;}
.single-req  .sub  dl.mailform dt,.single-req  .sub dl.mailform dd{   border:none; }
.single-req  .sub p.privacy{  text-align:center; font-size: 14px; font-size: 1.4rem; margin: 20px auto }
.single-req  .sub h4{ display: block;  font-size: 18px;font-size: 1.8rem;  text-align:left;  margin: 40px auto 0; width:95%; max-width: 800px;}
.single-req  .sub h4:before{  content:"■";}
.single-req  .sub dd span { font-size: 14px !important;}
.single-req  .sub .inlineframe {  margin: 2em auto;}
.single-req  .sub .inlineframe h4{  display: inline-block; margin: 0; padding: 0;font-size: 14px !important; }
.single-req  .sub .inlineframe h4:before{  display: none !important;}
.single-req  .sub .inlineframe h2{ margin: 1em 0; }
.single-req .headsub{ display: block;   padding: 0; text-align: left;  margin: 1.5em auto 0; }
.single-req .privacydata { display: block;  margin: 1em auto; max-width:27em; width:95%;}
div.chuijiko{ margin:2em 0 0 3em;}
div.chuijiko p{ display: block; margin:0 0 0 1.2em; padding: 0; }
div.chuijiko p:before{ content:"※"; margin:0 0.2em 0 -1em}

#contents article.recruit p{  padding: 0 !important;  }
#contents article.recruit p.privacy{  text-align:center; font-size: 14px; font-size: 1.4rem; margin: 20px auto }
#contents article  p.privacy a{ color:#003399; }
#contents article  p.privacy a:hover{width:auto;  color:#FF7B4D; }

/*以下、①背景色など*/
.voice h4{ text-align: left; background: #0255aa; color: #fff; padding: 0.5em;}
.voice dl{ margin: 0 0.5em 1em;text-align: left; }
.voice  dt,.voice  dd{  display: inline-block; vertical-align: middle; padding: 0 !important;}
.voice  dt{ margin-right: 0.5em;}
.voice  dd{ text-align: left; line-height: 1.3;}


.line-bc {
  padding: 20px 10px;
  margin: 15px auto;
  text-align: right;

}

/*以下、②左側のコメント*/
.balloon6 {
  width: 100%;
  margin: 10px 0;
  overflow: hidden;
}

.balloon6 .faceicon {
  float: left;
  margin-right: -50px;
  width: 40px;
}

.balloon6 .faceicon img{
  width: 100%;
  height: auto;
}
.balloon6 .chatting {
  width: 100%;
  text-align: left;
}
.says {
  display: inline-block;
  position: relative; 
  margin: 0 0 0 50px;
  padding: 10px;
  max-width:500px;
  border-radius: 12px;
  background: #edf1ee;
}

.says:after {
  content: "";
  display: inline-block;
  position: absolute;
  top: 3px; 
  left: -19px;
  border: 8px solid transparent;
  border-right: 18px solid #edf1ee;
  -webkit-transform: rotate(35deg);
  transform: rotate(35deg);
}
.says p {
  margin: 0;
  padding: 0;
}

/*以下、③右側の緑コメント*/
.mycomment {
  margin: 10px 0 3em;
}
.mycomment p {
  display: inline-block;
  position: relative; 
  margin: 0 10px 0 0;
  padding: 8px;
  max-width: 500px;
  border-radius: 12px; text-align: left;
  background: #1999e7; color: #fff;
}

.mycomment p:after {
  content: "";
  position: absolute;
  top: 3px; 
  right: -19px;
  border: 8px solid transparent;
  border-left: 18px solid #1999e7;
  -webkit-transform: rotate(-35deg);
  transform: rotate(-35deg);
}


/* お問合せ関連
------------------------------------------------------------*/
/* お問合せ
------------------------------------------------------------*/
.sub.contact article .inner4-2 {  padding: 1em;  margin: 0em auto 1em; border-radius: 10px; }
.sub.contact article .inner4 p{ margin-bottom: 1em;}

.sub article .wpcf7-form dl{ margin:60px auto 20px; width:100% !important; max-width: 100%;  border-bottom: 1px  dotted #999;}
.sub article .wpcf7-form dt,.sub article .wpcf7-form dd{ border: none; border-top: 1px  dotted #999; display:inline-block;  vertical-align: top; }
.sub article .wpcf7-form.wpcf7-form dt{width: calc(35% - 5px);  padding: 20px 0px 0px 45px;  font-weight: 300; font-size: 16px; position: relative; }
.sub article .wpcf7-form.wpcf7-form dd{ width: calc(63%); padding: 20px 0px 0px;  }
.sub article .wpcf7-form.wpcf7-form dt.hissu:before {
	content: '必須'/* 他の文字列を入れたりlist-style-typeの設定をしたり */; position: absolute; left: 5px; top:25px;
	font-size: 12px; background:#AA0C0C; color: #fff; padding:0 0.3em; border-radius: 3px;
	/* その他任意のデザイン指定 */
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
    padding: 0.8em;
    outline: none; display: block;
    border: 1px solid #DDD;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px; margin: 0 0 0.5em;
    font-size: 16px;  width:100%;
}
.wpcf7-form textarea { height: 6em;}
.wpcf7-form input::placeholder {
  font-size: 14px;
}


span.wpcf7-form-control-wrap{display: inline-block; }
.wpcf7-form input[type="text"]:focus,
.wpcf7-form texture:focus {
    box-shadow: 0 0 7px #AA0C0C;
    border: 1px solid #AA0C0C;
}
.wpcf7-form input.p-postal-code[type="text"]{max-width: 10em;}

.wpcf7-form input[type="submit"].wpcf7-submit{font-size: 20px !important; font-size: 2.0rem !important;
  margin:30px auto ;  vertical-align: middle;color:#fff;
  background-color:#036EB7;
  padding: 0; height: 50px; line-height: 50px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #036EB7;
  -webkit-transition: .5s;
  transition: .5s;
  display:block;
  cursor: pointer;
width:80%; max-width: 250px;
}
.wpcf7-form input[type="submit"].wpcf7-submit:hover {
  background:#AA0C0C;  border: 1px solid #AA0C0C;color:#fff;
}
.wpcf7-form input[type="button"].wpcf7-previous{font-size: 16px !important; font-size: 1.6rem !important;
  margin:30px auto 5px;  vertical-align: middle;color:#000;
  background-color:#ddd;
  padding: 0; height: 40px; line-height: 40px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  border: 1px solid #ddd;
  -webkit-transition: .5s;
  transition: .5s;
  display:block;
  cursor: pointer;
width:200px;
}
.wpcf7-form input[type="button"].wpcf7-previous:hover {
  background:#AA0C0C;  border: 1px solid #AA0C0C;color:#fff;
}

.form-buttons{ margin-bottom: 3em;}

span.wpcf7-spinner {
  display: none;
}
p.hissu.hissu:before {  position: absolute; top:50%; transform: translateY(-50%);
	content: '必須'/* 他の文字列を入れたりlist-style-typeの設定をしたり */; 
	font-size: 12px; background:#AA0C0C; color: #fff; padding:0 0.3em; border-radius: 3px;
	/* その他任意のデザイン指定 */
}
p.hissu{ text-align: center; position: relative; margin: 0 auto 1em; width:95%; max-width: 350px !important;  border-bottom: 1px solid #AA0C0C;
}


/*ここからモバイル*/

@media only screen and (max-width: 1000px){
}


@media only screen and (max-width: 900px){
#contents{ margin: 60px 0 0; }
.home #contents{ margin: 110px 0 0; }
.newstop ul{ margin: -1.5em 0 0 100px; width:calc( 100% - 100px ); border-top: 1px dotted #0268b6;}
}
@media only screen and (max-width: 800px){
    
#wrapper{background: url("/img/common/headerback.png") 0 0 no-repeat; background-size:auto 300px;
}
 .topreq img.req2 { width:109px; height: auto; top:110%;  left:200px; }   
    .balloon { border-radius:20px;
  padding:20px ;
  margin: 0 0 0; width:100%;
}
    .sub article .honbun { margin: 1em 0 1.5em 1em;}
    .sub article.access .honbun { margin: 1em 0 0em 1em;}
    .message div img{ right:5%; bottom:-70px; width:200px; height: auto;}
}

@media only screen and (max-width: 750px){	
.page{ background: url("/img/common/header2.jpg") 100% 0 no-repeat; background-size: 750px auto;} 
.topreq img {position:static; display: inline-block;  vertical-align: middle;} 
.topreq { text-align: center; }
.topreq img.req3 {  border-radius: 50%; width: calc( 20% - 5px );}
.topreq img.req1,.topreq img.req2,.topreq img.req4,.topreq img.req5{  width: calc( 20% - 5px ); }
.req_news{ background: url("/img/common/back.png") 50% 0; background-size: auto  100%; padding: 0px 0 0px;}
} 


@media only screen and (max-width: 650px){
.topreq ul li{ display: inline-block; vertical-align: middle; width:48%; margin: 0 1%; }
 .topreq {position: static;  min-height: auto;  }   
.newstop { margin:  0; }    
    .sub article { margin:0px auto 40px;padding: 30px 0 0;z-index: 1; }
.sub article .wpcf7-form dl{ margin:30px auto 20px; width:100% !important; }
.sub article .wpcf7-form dt,.sub article .wpcf7-form dd{  display:block; }
.sub article .wpcf7-form.wpcf7-form dt{width: calc(100% - 5px);  padding:8px 0px 5px 5px;  font-weight: 300; font-size: 14px; background: #C4E9FF; }   
  .sub article .wpcf7-form.wpcf7-form dt.hissu{ padding: 8px 0 5px 40px;} 
     .sub article .wpcf7-form.wpcf7-form dt.hissu:before {
	content: '必須'/* 他の文字列を入れたりlist-style-typeの設定をしたり */; position: absolute; left: 5px; top:12px;
	font-size: 10px; background:#AA0C0C; color: #fff; padding:0 0.3em; border-radius: 3px;
	/* その他任意のデザイン指定 */
}
.sub article .wpcf7-form.wpcf7-form dd{ width: calc(100% - 5px);padding:8px 0px; margin: 0; } 
     .message div img{ right:-10px; bottom:-20px; width:150px; height: auto;}
    .about dl{ border-top: 1px solid #1999e7}
    .about dt{ width:100%; background: #cfecf8;}
.about dd{width:100%; padding: 0.8em 0.8em 1.5em; }
    .access dl dt,.access dl dd{ display:block; }
    .access dl  dd{margin:0.5em 0 0 1em ;} 
}

@media only screen and (max-width: 600px){
    
    .topbusines div div{ padding: 0; width:100%; margin: 0 auto }
    .topbusines img.img{ width:100%; max-width: 400px; height: auto;  display: block;border-radius:10px;margin: 1em auto 0;}
    .topbusines a.more { margin: 1em 0 0 auto; width:11em; }
#page-top1{
  bottom:-10px;
  right: 5px; }
	
.topcompany li{ width:95%; margin:0.5em auto; max-width: 4 }   
}
	
@media only screen and (max-width: 500px){
#contents{ margin: 60px 0 0; }
.home #contents{ margin: 100px 0 0; }    
.newstop ul{ margin:0.5em auto 0; width:95%;}
 .home article.insta{ padding:20px 0;}  
.insta {background-size: 100% auto; text-align: center; color: #fff; min-height: 600px;position: relative;
background-image: url('/img/common/back2.png'), url('/img/common/back3.png');
  background-position: top center, bottom center; /* 上部中央、下部中央に表示 */
  background-repeat: no-repeat;
  height: 100px; /* 画面の高さに合わせて表示 */}  
    
    
    .footercontact a,.footercontact b{ display:block; width:95%; max-width: 260px; text-align: center; margin: 5px auto}
    .footercontact dl  dd  { width:100%; max-width: 400px;  text-align: center; margin: 5px auto 0;}
    .footercontact dl  dd span{  display: inline-block; vertical-align: middle; margin-right: .5em;} 
    .message div img{ right:-20px; bottom:-20px; width:120px; height: auto;}
    .message div{  padding-bottom: 50px;}
    .balloon {
  padding:20px ;width:100%;
}
}

@media only screen and (max-width: 450px){
.info li { width: 90%; margin: 1em auto; text-align: left;}
}
@media only screen and (max-width:380px){.slider li img{border-radius: 5px;}
}