@charset "utf-8";


/* PC : 320 px - 999 px */
@media print, screen and (min-width: 320px) {

.gridContainer {
width:100%;
height:100%;
max-width:999px;
min-width:320px;
}

.sp{
display: block;
}

.pc{
display: none;
}

.wrap{
display: inline-block;
width: 100%;
margin-top: 70px;
font-size: 1rem;
}

.row{
display: flex;
flex-wrap: wrap;
font-size: 1.0rem;
line-height: 1.6rem;
}

.row p{
margin-bottom: 15px;
}

.col2{
width: 90%;
margin: 0 5%;
}

.col2 img{
width: 100%;
height: 340px;
background: #eee;
}

.col-100-38{
width: 100%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-48{
width: 100%;
vertical-align: top;
box-sizing: border-box;
}

.col-48{
width: 48%;
vertical-align: top;
box-sizing: border-box;
}

.col-50{
width: 50%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-60{
width: 100%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-30{
display: inline-flex;
width: 100%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-50{
display: inline-flex;
width: 100%;
vertical-align: top;
box-sizing: border-box;
}

.col-48-24{
display: inline-flex;
width: 48%;
box-sizing: border-box;
}

.w1000{
width:100%;
height:auto;
padding: 0 10px;
box-sizing: border-box;
}

.w1000-t{
width:100%;
height:auto;
padding: 0;
box-sizing: border-box;
}

.w1000-glay{
display: block;
width:100%;
height:auto;
padding: 20px;
box-sizing: border-box;
}

.w1000-g{
background: #fef4ef;
}

.w100p-80p{
width: 100%;
}

.w100p-50p{
width: 100%;
}

body p{
font-size: 1.05rem;
line-height: 1.7em;
}

.order1-2{
order: 1;
}

.order2-1{
order: 2;
}

.w100p-20p{
width: 100% !important;
}

.w100p-30p{
width: 100% !important;
background: #fefbf3;
font-weight: bold;
}

.w100p-70p{
width: 100% !important
}

/*----------------------------------------------------
ヘッダー
----------------------------------------------------*/
.header-wrap{
position: fixed;
z-index: 1000;
top: 0;
left: 0;
width: 100%;
height: 70px;
background: #fff;
box-sizing: border-box;
box-shadow: 0px 7px 12px -6px rgba(0,0,0,0.26);
}

/* メニュー */
nav.globalMenuSp {
position: fixed;
z-index: 2;
top: 0;
left: 0;
background: #fff;
color: #000;
text-align: center;
transform: translateY(-100%);
transition: all 0.6s;
width: 100%;
}

nav.globalMenuSp ul {
background: #ccc;
margin: 0 auto;
padding: 0;
width: 100%;
}

nav.globalMenuSp ul li {
font-size: 1.1em;
list-style-type: none;
padding: 0;
width: 100%;
border-bottom: 1px dotted #333;
}

nav.globalMenuSp ul li:last-child {
padding-bottom: 0;
border-bottom: none;
}

nav.globalMenuSp ul li a {
display: block;
color: #000;
padding: 1em 0;
}

/* jQueryで付与・削除 */
nav.globalMenuSp.active {
transform: translateY(0%);
}

/*　三本　*/
.navToggle {
display: block;
position: fixed;    /* bodyに対しての絶対位置指定 */
right: 0;
top: 10px;
width: 48px;
height: 47px;
cursor: pointer;
z-index: 20;
background: #fff;
text-align: center;
}

.navToggle span {
display: block;
position: absolute;    /* .navToggleに対して */
width: 30px;
border-bottom: solid 3px #1983c8;
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
transition: .35s ease-in-out;
left: 9px;
}

.navToggle span:nth-child(1) {
top: 9px;
}

.navToggle span:nth-child(2) {
top: 18px;
}

.navToggle span:nth-child(3) {
top: 27px;
}

.navToggle span:nth-child(4) {
border: none;
color: #1983c8;
font-size: 9px;
font-weight: bold;
top: 31px;
}

/* 最初 span マイナス45度 */
.navToggle.active span:nth-child(1) {
top: 10px;
left: 9px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}

/* 2番目 3番目 45度 */
.navToggle.active span:nth-child(2),
.navToggle.active span:nth-child(3) {
top: 28px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}

.sidebnr{
position: fixed;
z-index: 5;
left: 0px;
bottom: 30px;
}

.sidebnr img{
width: 48px;
height: 65px;
}

/*----------ナビゲーション----------*/
#navigation{
  position: fixed;
  display: none;
  width: 100%;
  height: calc(100vh - 70px);
  top: 70px;
  left: 0;
  background-color: #fff;
  z-index: 10;
  overflow: auto;
}
#navigation .navigation_inner{
  display: table;
  width: 100%;
  height: 100%;
}
#navigation .navigation_inner .navigation_menu{
  display: table-cell;
  vertical-align: middle;
}
#navigation .navigation_inner .navigation_menu{
float: left;
  width: 90%;
  height: auto;
  margin: 16px 5% 0 5%;
  padding: 15px 0;
  background: #fff;
}
#navigation .navigation_inner .navigation_menu .navigation_item:first-child{
  margin-top: 0;
}
#navigation .navigation_inner .navigation_menu .navigation_item a{
  display: block;
  position: relative;
  text-decoration: none;
  font-size: 2.4rem;
  color: #333;
  line-height: 40px;
  text-align: center;
}

.hamb-box{
display: inline-block;
width: 100%;
height: auto;
padding-bottom: 30px;
background: #fff;
box-sizing: border-box;
font-size: 0.95rem;
overflow: auto;
}

.sp-bottom{
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 50px;
background: #bbb;
}

.sp-bottom div{
display: block;
}

.sp-b1{
float: left;
width: 50%;
height: 50px;
padding: 10px 0 0 0;
border: 1px solid #e2e2e2;
background: #e5f1f9;
box-sizing: border-box;
color: #0075c2 !important;
font-size: 1.0rem;
font-weight: bold;
line-height: 1em;
text-align: center;
}

.sp-b1 span{
vertical-align: super;
}

.sp-b-img{
display: inline;
width: 25px;
height: 25px;
margin: 5px 5px 0 0;
}

.sp-b2{
float: left;
width: 50%;
height: 50px;
padding: 28px 0 0 0;
border: 1px solid #e2e2e2;
background: #e5f1f9;
background-image: url("../img/common/sp-sub-1.png");
background-repeat: no-repeat;
background-size: 25px;
background-position: 10px 14px;
box-sizing: border-box;
color: #0075c2 !important;
font-size: 1.0rem;
font-weight: bold;
line-height: 1em;
text-align: center;
}

/*----------------------------------------------------
フッター
----------------------------------------------------*/
.footer-box{
display: inline-block;
width: 100%;
margin-top: 100px;
background: #004673;
padding-block: 5em 2em;
}

.footer-address {
  color: #fff;
}
.footer-address-company-name {
  font-weight: bold;
}

.copy{
display: block;
padding: 8px 0;
color: #fff;
font-size: 1.0rem;
font-weight: bold;
text-align: center;
}

.toppage{
position: fixed;
z-index: 10;
right: 5px;
bottom: 8px;
}

/*----------------------------------------------------
見出し
----------------------------------------------------*/
.h2-t1{
position: absolute;
top: 45px;
left: 20px;
color: #fff;
font-size: 1.3rem;
font-weight: bold;
}

.h2-t2{
position: absolute;
top: 45px;
right: 20px;
color: #fff;
font-size: 1.3rem;
font-weight: bold;
}

.h2-t3{
width: 100%;
color: #0075c2;
font-size: 1.5rem;
font-weight: bold;
text-align: center;
}

.top-rec-txt{
position: absolute;
top: 130px;
left: 0;
right: 0;
margin: 0 auto;
color: #fff;
font-size: 1.3rem;
font-weight: bold;
text-align: center;
}

.h2-cont{
position: absolute;
top: 100px;
left: 44px;
color: #fff;
font-size: 2.3rem;
text-shadow:
1px 1px 0 #005e9b, -1px -1px 0 #005e9b,
-1px 1px 0 #005e9b, 1px -1px 0 #005e9b,
0px 1px 0 #005e9b,  0-1px 0 #005e9b,
-1px 0 0 #005e9b, 1px 0 0 #005e9b;
line-height: 1.2em;
}

.cont-txt{
position: absolute;
top: 60px;
left: 45px;
color: #fff;
font-size: 1.45rem;
font-weight: bold;
}

.h2-cont-txt{
width: 100%;
padding: 30px 0 50px 0;
color: #0075c2;
font-size: 1.7rem;
text-align: center;
line-height: 1.2em;
}

.h3-cont-box{
width: 100%;
margin-bottom: 25px;
text-align: center;
}

.h3-cont{
display: inline-block;
width: auto;
padding: 0 0 0 10px;
border-left: 12px solid #3391ce;
box-sizing: border-box;
font-size: 1.35rem;
text-align: left;
line-height: 1.2em;
}

.h3-news-headline {
margin-bottom: 10px;
color: #004673;
font-size: 1.175rem;
}

.h4-cont{
margin-bottom: 12px;
font-size: 1.275rem;
line-height: 1.25em;
}

.h4-news-headline {
  font-size: 1.05rem;
  margin-bottom: 0.5rem;
}

.h4-service{
display: inline-table;
width: 100%;
margin-bottom: 30px;
padding: 8px 0;
box-sizing: border-box;
font-size: 1.05rem;
text-align: center;
line-height: 1.25em;
border: 1px solid #d0dce4;
background: #edf5fb;
}

.yellow{
width: 100%;
border: 1px solid #efd384;
background: #fdf2d3;
}

.green{
border: 1px solid #9bdbbd;
background: #e7faf1;
}

.h4-privacy{
margin-bottom: 10px;
color: #004673;
font-size: 1.175rem;
}

.h5-service{
display: inline-table;
width: auto;
margin-bottom: 15px;
padding: 8px 0;
border-bottom: 5px solid #1983c8;
box-sizing: border-box;
font-size: 1.05rem;
text-align: center;
line-height: 1.25em;
}

/*----------------------------------------------------
コンテンツ
----------------------------------------------------*/
/* Box */
.section-box{
width: 1000px;
margin: 0 auto;
}

.section-box-w100p{
width: 100%;
margin: 0 auto;
}

.flex-between{
justify-content: space-between;
}

.pc-nowrap{
flex-wrap: wrap;
}

.pc-wrap{
flex-wrap: wrap !important;
}

.box100{
display: flex;
width: 100%;
margin: 0;
}

.box100 li a,
.box100 li a:hover{
display: block;
text-decoration: none;
}

.logo-sp{
position: fixed;
top: 0;
left: 0;
z-index: 1000;
width: 80px;
height: 70px;
}

.top-img{
position: relative;
width: 100%;
height: auto;
}

.top-img img{
width: 100%;
height: 370px;
}

.top-img .txt{
position: absolute;
top: 90px;
width: 100%;
margin: 0 auto;
font-size: 1.5rem;
font-weight: bold;
text-align: center;
}

.cont-img{
position: relative;
width: 100%;
height: auto;
padding-bottom: 250px;
background-color: #e5f1f9;
}

.cont-img img{
width: 100%;
height: 250px;
}

.tomica-box {
  position: relative;
}
.tomica-item {
  position: absolute;
  bottom: 10px;
  right: 0;
}
.tomica-item img {
  width: 170px;
  height: auto;
}

.cont-triangle {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-right: 250px solid transparent;
border-top: 250px solid #0075c2;
opacity: 0.6;
mix-blend-mode: multiply;
}

.top-rm1{
position: absolute;
top: 80px;
left: 20px;
padding: 5px 10px;
border: 1px solid #0075c2;
background: #fff;
border-radius: 50px;
color: #0075c2;
font-size: 0.85rem;
font-weight: bold;
transition: all .2s ease-in;
}

.top-rm2{
position: absolute;
top: 80px;
right: 20px;
padding: 5px 10px;
border: 1px solid #0075c2;
background: #fff;
border-radius: 50px;
color: #0075c2;
font-size: 0.85rem;
font-weight: bold;
transition: all .2s ease-in;
}

.top-box-rm2 {
margin-top: 20px;
}

.top-box-rm1 a:hover .top-rm1,
.top-box-rm2 a:hover .top-rm2 {
  background: #13a0fb;
  color: #fff;
}

.top-box-rm1 a:hover img,
.top-box-rm2 a:hover img {
  opacity: 0.8;
}

.top-triangle0 {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-right: 179px solid transparent;
border-top: 27vh solid #0075c2;
opacity: 0.25;	
}

.top-triangle1 {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
opacity: 0.6;
}

.top-triangle2 {
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
opacity: 0.6;
}

.top-rec{
display: block;
position: relative;
width: 100%;
height: auto;
margin-top: 20px;
}

.top-rec img{
width: 100%;
height: 180px;
}

.top-rec-detail{
display: flex;
width: 100%;
height: auto;
margin: 0;
padding: 50px 0;
}

.top-rec-detail li{
width: 100%;
}

.top-rec-detail .txt p{
width: 100%;
color: #444;
font-size: 1.175rem !important;
font-weight: bold;
text-align: center;
}

.top-rec-detail .bb a{
width: 60%;
margin: 25px 20% 0 20%;
padding: 6px 0;
border-radius: 50px;
background: #ff8e00;
color: #fff;
font-size: 1.10rem;
font-weight: bold;
text-align: center;
line-height: 1.7em;
border: 1px solid transparent;
transition: all .375s ease;
}


.top-rec-detail .bb a:hover{
background: #fff;
color: #ff8e00;
border: 1px solid #ff8e00;
text-decoration: none;
}

.t-news{
position: relative;
width: 100%;
padding-top: 20px;
box-sizing: border-box;
}

.t-news dl{
display: table;
width: 84%;
margin: 20px 8% 0 8%;
font-weight: bold;
line-height: 1.75em;
}

.t-news dt{
width: 100%;
}

.t-news dd{
width: 100%;
}

.t-news dd a{
width: 95%;
margin: 0 0 8px 5%;
padding-bottom: 8px;
border-bottom: 1px dotted #bbb;
line-height: 1.5em;
z-index: 1;
}

.t-news dd a:hover {
  color: #0075c2;
  text-decoration: none;
}

.t-news ul{
display: table;
width: 100%;
margin-top: 30px;
line-height: 1.6em;
}

.t-news ul li{
display: block;
font-weight: bold;
}

.t-news .txt{
width: 80%;
margin: 0 10% 20px 10%;
font-size: 1.0rem;
}

.t-news .bb a{
width: 50%;
height: 40px;
margin: 0 25% 30px 25%;
padding: 7px 0 0 0;
border-radius: 30px;
background: #0075c2;
box-sizing: border-box;
text-align: center;
line-height: 1.5em;
}

.t-news .txt a{
display: inline;
color: blue;
text-decoration: underline;
}

.t-news .txt a:hover{
display: inline;
text-decoration: none;
}

.t-news .bb a,
.t-news .bb a:visited{
  border: 1px solid transparent;
  color: #fff;
  transition: all .375s ease;
}
.t-news .bb a:hover {
  background: #fff;
  border: 1px solid #0075c2;
  color: #0075c2;
}

.top-4{
width: 100%;
height: auto;
}

.path{
display: block;
width: 100%;
padding: 12px 0;
}

.path li{
display: inline-block;
}

.resp-table{
display: table;
width: 100%;
border-collapse: collapse;
border-bottom: 1px solid #b0b0b0;
line-height: 1.5em;
}

.resp-table th{
display: block;
width: 100%;
padding: 20px;
border: 1px solid #b0b0b0;
border-bottom: none;
background: #fef8e7;
box-sizing: border-box;
}

.resp-table td{
display: block;
width: 100%;
padding: 20px;
border: 1px solid #b0b0b0;
border-bottom: none;
box-sizing: border-box;
}

.officer{
width: 100%;
margin: 0;
border-top: 1px solid #88b0ca;
box-sizing: border-box;
}

.officer li{
width: 100%;
padding: 15px;
border-bottom: 1px solid #88b0ca;
box-sizing: border-box;
}

.officer .txt1{
width: 100%;
}

.officer .txt2{
width: 100%;
}

.officer .txt3{
width: 100%;
}

.history{
width: 100%;
margin: 0;
font-size: 1.0rem;
line-height: 1.7em;
}

.history dt{
width: 100%;
margin: 0;
padding: 7px 20px;
background: #66acda;
box-sizing: border-box;
color: #fff;
font-weight: bold;
}

.history dd{
width: 80%;
margin:3px 10% 3px 10%;
padding: 25px 0 25px 30px;
border-left: 3px solid #cce3f3;
box-sizing: border-box;
}

.greeting-box{
display: flex;
flex-wrap: wrap;
}

.greeting-box .img{
width: 100%;
}

.greeting-box .img img{
width: 50%;
margin: 0 25%;
}

.greeting-box .txt{
width: 100%;
padding: 0 10px 0 10px;
box-sizing: border-box;
}

.rinen{
padding-left:1em;
text-indent:-1em;
font-size: 1.0rem;
line-height: 1.75em;
}
.rinen--paragraph {
  padding-left: 0;
  text-indent: inherit;
}

.rinen-link{
margin: 20px 0 0 0;
color: blue !important;
font-size: 1.0rem;
}

.greeting{
position: relative;
width: 100%;
margin-top: 20px;
}

.greeting h2{
margin-bottom: 40px;
font-size: 1.2rem;
line-height: 1.4em;
}

.greeting p{
line-height: 2.0em !important;
}

.greeting-txt{
width: 100%;
margin: 30px 0 0 0;
padding: 15px 10px;
border: 5px solid #cce3f3;
box-sizing: border-box;
}

.one-name-txt{
width: 100%;
margin: 30px 0 0 0;
padding: 15px 25px;
border: 5px solid #cce3f3;
box-sizing: border-box;
}

.greeting-txt .head{
width: 100%;
color: #004673;
font-size: 1.2rem;
font-weight: bold;
text-align: left;
}

.p-name{
width: 100%;
margin-top: 40px;
font-size: 1.25rem;
font-weight: bold;
text-align: right;
}

.name span{
font-family: "Sawarabi Mincho";
font-size: 1.45rem;
font-weight: 900;
}

.organization{
width: 100%;
}

.organization img{
width: 100%;
}

.organization .date{
width: 100%;
text-align: right;
}

.sp-nav li{
display: inline-block;
width: 32%;
height: 40px;
margin: 5px 0 0 0;
font-size: 0.9rem;
}

.sp-nav li a,
.sp-nav li span{
display: inline-block;
width: 100%;
height: 40px;
padding-top: 13px;
border: 1px solid #999;
box-sizing: border-box;
text-align: center;
line-height: 1em;
}

.sp-nav li span{
border: 1px solid #3391ce;
background: #3391ce;
color: #fff;
}

.plant-map{
width: 100%;
margin-top: 10px;
padding-right: 10px;
box-sizing: border-box;
text-align: right;
}

.plant-map a{
display: inline-block;
width: auto;
height: 36px;
padding: 8px 35px;
border-radius: 30px;
background: #13a0fb;
box-sizing: border-box;
color: #fff;
font-size: 1.0rem;
font-weight: bold;
line-height: 1.25em;
}

.plant-map a:hover{
border: 1px solid #13a0fb;
background: #fff;
box-sizing: border-box;
color: #13a0fb;
font-weight: bold;
text-decoration: none;
}

.cement{
width: 100%;
margin: 30px 0 0 0;
padding: 20px 20px 0 20px;
border: 2px solid #cce3f3;
background: #f2f8fc;
box-sizing: border-box;
}

.facility p,
.cement p{
margin-bottom: 20px;
font-size: 0.97rem;
font-weight: bold;
line-height: 1.85em;
}

.facility{
width: 100%;
height: auto;
margin-top: 20px;
padding: 20px 30px 0px 30px;
background: #d9eaf6;
box-sizing: border-box;
}

.table-scroll{
width: 100%;
margin: 0;
overflow: auto;
white-space: nowrap;
}

.plant-table{
width: 940px;
margin: 0 15px;
border-collapse: collapse;
box-sizing: border-box;
table-layout: fixed;
font-size: 0.95rem;
line-height: 1.275em;
}

.plant-table th{
border: 1px solid #aaa;
text-align: center;
}

.plant-table td{
padding: 13px 0;
border: 1px solid #aaa;
text-align: center;
}

.tb-40{
width: 40%;
padding: 10px 0;
background: #eee;
}

.tb-4{
width: 4%;
padding: 13px 0;
background: #f6f6f6;
}

.tb-13{
width: 13.3333%;
padding: 13px 0;
background: #f6f6f6;
}

.tb-15{
width: 15%;
padding: 0;
background: #eee;
}

.tb-30{
width: 30%;
padding: 0;
background: #eee;
}

.address{
width: 100%;
padding: 0 20px;
box-sizing: border-box;
font-size: 0.98rem;
line-height: 1.8em;
}

.service-office{
width: 100%;
margin-top: 20px;
padding: 20px 20px 0 20px;
border-top: 1px dotted #999;
box-sizing: border-box;
font-size: 0.98rem;
line-height: 1.8em;
}

.map-box{
position: relative;
width: 100%;
}

.p1{
position: absolute;
display: inline-block;
top: 47%;
right: 33%;
}

.p2{
position: absolute;
display: inline-block;
top: 69%;
right: 36%;
}

.p3{
position: absolute;
display: inline-block;
top: 47%;
right: 3%;
}

.p4{
position: absolute;
display: inline-block;
top: 58%;
right: 30%;
}

.p5{
position: absolute;
display: inline-block;
top: 53%;
left: 1%;
}

.p6{
position: absolute;
display: inline-block;
top: 41%;
left: 1%;
}

.p7{
position: absolute;
display: inline-block;
top: 27%;
left: 2%;
}

.p8{
position: absolute;
display: inline-block;
bottom: 3.5%;
left: 20%;
}

.p9{
position: absolute;
display: inline-block;
bottom: 24%;
right: 1%;
}

.p10{
position: absolute;
display: inline-block;
bottom: 5%;
right: 1%;
}

.p11{
position: absolute;
display: inline-block;
bottom: 14.5%;
right: 1%;
}

.p12{
position: absolute;
display: inline-block;
top: 78.5%;
right: 36%;
}

.p1 a,
.p2 a,
.p3 a,
.p4 a,
.p5 a,
.p6 a,
.p7 a,
.p8 a,
.p9 a,
.p10 a,
.p11 a,
.p12 a{
width: auto;
height: 27px;
padding: 5px 9px;
border: 2px solid #e53b00;
border-radius: 30px;
background: #fff;
box-sizing: border-box;
color: #e53b00 !important;
font-size: 0.9rem;
font-weight: bold;
line-height: 1em !important;
}

.p1 a:hover,
.p2 a:hover,
.p3 a:hover,
.p4 a:hover,
.p5 a:hover,
.p6 a:hover,
.p7 a:hover,
.p8 a:hover,
.p9 a:hover,
.p10 a:hover,
.p11 a:hover,
.p12 a:hover
{
border: 2px solid #ea5a28;
background: #ea5a28;
color: #fff !important;
text-decoration: none;
}

.service{
margin-bottom: 15px;
background: #f2f8fc;
}

.service h3{
width: 100%;
padding: 5px 0;
color: #004673;
font-size: 1.2rem;
text-align: center;
line-height: 1.25em;
}

.service .txt{
padding: 10px 15px;
font-size: 0.95rem;
}

.table-service1{
width: 856px;
border-collapse: collapse;
table-layout: fixed;
}

.table-service1 th{
width: 16.6666%;
padding: 10px 0;
border: 1px solid #999;
background: #eee;
text-align: center;
}

.tab-16{
width: 16.666%;
}

.table-service1 td{
width: 100%;
padding: 13px 0;
border: 1px solid #999;
font-size: 0.825rem;
text-align: center;
}

.dl-service{
width: 100%;
font-size: 0.925rem;
background: #fafafa;
}

.dl-service dt{
display: inline-block;
width: 70%;
padding: 12px 0 12px 15px;
border-bottom: 1px solid #999;
box-sizing: border-box;
font-weight: bold;
}

.dl-service dd{
display: inline-block;
width: 30%;
padding: 12px 0;
border-bottom: 1px solid #999;
text-align: center;
}

.date-s{
width: 100%;
padding-right: 10px;
margin-bottom: 10px;
box-sizing: border-box;
color: #004673;
font-size: 0.975rem;
text-align: right;
font-weight: bold;
}

.sp-mt20{
margin-top: 20px;
}

.sp-mt30{
margin-top: 30px;
}

.sp-mt40{
margin-top: 40px;
}

.gmap1{
width: 100%;
height: 350px;
border: 1px solid #aaa;
box-sizing: border-box;
}

.indeed{
width: 90%;
margin: 50px 5% 0 5%;
}

.name{
position: absolute;
bottom: -10px;
width: auto;
padding: 8px 32px;
border-radius: 3px;
left: 10px;
background: #0075c2;
font-size: 1.025rem;
color: #fff;
border: 1px solid transparent;
}

.box-person a:hover .name {
  background: #fff;
  color: #0075c2;
  border: 1px solid #0075c2;
}

.box-person a:hover img {
  opacity: 0.8;
}

.box-person > .box-pop-img { /* .nameの要素が見切れるのを防ぐ */
  overflow: inherit;
}


.sitemap{
width: 100%;
margin: 15px 0 25px 0;
vertical-align: top;
align-items: flex-start;
}

.sitemap li a{
display: inline-block;
width: 90%;
margin: 0 0 15px 10%;
line-height: 1.5em;
}

.sitemap li a:hover{
color: blue;
text-decoration: underline;
}

.sitemap-list-container {
  flex-direction: column;
}

.privacy-ol{
display:block;
width: 98%;
margin: 30px 1%;
}

.privacy-ol li{
display: list-item;
margin: 30px;
list-style: decimal;
line-height: 1.75em;
}

.call{
width: 95%;
margin: 30px 2.5% 0 2.5%;
padding: 17px 19px;
border:3px solid #b2d5ed;
box-sizing: border-box;
}

.news-dl{
font-size: 1.06rem;
line-height: 1.7em;
}

.news-dl dt{
display: block;
width: 100%;
padding: 5px 10px;
background: #f1f1f1;
box-sizing: border-box;
color: #0075c2;
font-weight: bold;
}

.news-dl dd{
display: block;
width: 100%;
margin: 15px 0 15px 0;
padding: 0 5px;
box-sizing: border-box;
line-height: 1.5em;
}

.news-dl dd a{
display: block;
width: 100%;
margin: 15px 0 30px 0;
padding: 0 5px;
box-sizing: border-box;
font-weight: bold;
line-height: 1.5em;
}

.news-dl dd a:hover{
color: #0075c2;
text-decoration: none;
}
.news-dl dd a:not([href]):hover{
  color: initial;
}

/* dt+dd*の状態でもレイアウトを維持する */
.news-dl .flex {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.news-dl .flex dt {
  float: none;
  margin: 0;
}

.news-dl .flex dd {
  width: 76%;
  margin: 0;
  border-bottom: none;
}

.news-dl .flex dd a {
  width: 100%;
}

.news-date{
margin:-5px 0 25px 0;
font-weight: bold;
text-align: right;
}

.prev{
display: block;
width: 100%;
margin: 60px 0 0 0;
text-align: center;
}

.prev a{
display: inline-block;
width: auto;
margin: 0;
padding: 14px 30px;
border-radius: 4px;
background: #13a0fb;
box-sizing: border-box;
color: #fff;
font-weight: bold;
line-height: 1em;
}

.prev a:hover{
display: inline-block;
width: auto;
height: 44px;
margin: 0;
padding: 14px 30px;
border: 1px solid #13a0fb;
border-radius: 4px;
background: #fff;
box-sizing: border-box;
color: #13a0fb;
font-weight: bold;
line-height: 1em;
text-decoration: none;
}

.one-name{
margin-bottom: 10px;
padding-bottom: 10px;
border-bottom: 1px solid #aaa;
font-size: 1.175rem;
font-weight: bold;
}

.recruit-img{
position: relative;
}

.recruit-img .box{
position: absolute;
bottom: -3px;
right: 5px;
padding: 10px 15px 10px 35px;
background: #0075c2;
text-align: center;
}

.recruit-img .box h3{
display: inline-block;
color: #fff;
font-size: 1.22rem;
line-height: 1.0em;
}

.recruit-img .box p{
display: inline-block;
color: #fff;
font-size: 0.75rem;
font-weight: bold;
line-height: 1.0em;
}

.h4-faq{
display: table;
width: 100%;
margin-bottom: 20px;
padding-bottom: 10px;
border-bottom: 1px solid #7fa2b9;
font-size: 1.25rem;
}

.h4-faq .q1{
display: inline-block;
width: 13%;
padding: 15px 0;
background: #0075c2;
box-sizing: border-box;
color: #fff;
text-align: center;
}

.h4-faq .q2{
display: inline-block;
width: 87%;
padding: 0 0 0 15px;
box-sizing: border-box;
color: #0075c2;
font-size: 1.175rem;
vertical-align: middle;
line-height: 1.25em;
}

.news2{
width: 100%;
margin-top: 30px;
padding: 25px 0;
border: 4px solid #b2c7d5;
box-sizing: border-box;
font-size: 0.9rem;
line-height: 1em !important;
text-align: center;
}

}
/* *************************************************************************************************************************** 320-999 */

/* PC : 10000 px -  */
@media print, screen and (min-width: 1000px) {

.gridContainer {
width:100%;
height:100%;
max-width:100%;
min-width:1000px;
}

.sp{
display: none !important;
}

.pc{
display: block !important;
}

.box100{
flex-wrap: nowrap;
width: auto;
margin: 0;
}

.pc-nowrap{
flex-wrap: nowrap;
}

.w1000,
.w1000-t{
display: block;
max-width: 1100px;
height:auto;
margin: 0 auto 0 auto;
padding: 0 15px;
}

.w1000-glay{
display: block;
width:100%;
max-width: 1000px;
height:auto;
margin: 0 auto;
}

.order1-2{
order: 2;
}

.order2-1{
order: 1;
}

.w100p-30p{
width: 15% !important;
font-weight: bold;
}

.w100p-50p{
width: 45% !important;
margin: 0 27.5%;
}

.w100p-70p{
width: 85% !important;
}

.col-48-24{
display: inline-flex;
width: 23%;
box-sizing: border-box;
}

/*----------------------------------------------------
ヘッダー
----------------------------------------------------*/
.header-wrap{
width: 230px;
height: 100vh;
box-shadow: 2px 0 10px 3px rgba(0,0,0,0.2);
}

.header-box{
display: table;
width: 1000px;
margin: 13px auto;
font-size: 0.9rem;
}

.gnav{
display: block;
width: 100%;
height: auto;
}

.gnav > li{
display: inline-block;
width: 100%;
height: 64px;
margin: 0;
padding: 0;
border-bottom: 1px solid #7fbae0;
box-sizing: border-box;
font-size: 1rem;
line-height: 1em;
}

.gnav > li > a{
display: block;
height: 64px;
padding: 27px 0 0 0;
box-sizing: border-box;
color: #004673;
font-size: 0.9rem;
font-weight: bold;
text-align: center;
vertical-align: middle;
line-height: 1em;
}

.gnav li a:hover{
background: #3391ce;
color: #fff;
text-decoration: none;
}

.gnav li {
  transition: all .3s ease-in-out;
}

.gnav > li:hover .megamenu {
  max-height: 9999px;
  opacity: 1;
}

.sidebnr{
top: 145px;
right: 0;
left: auto;
}

.sidebnr img{
width: 48px;
height: 144px;
}

/* mega */

.main-wrapper {
display: block;
justify-content: center; 
width: 100%;
margin: 0 auto;
}

.main-wrapper > li {
 margin-top: 0;
}

.hd-wrapper {
  padding: 20px 0 30px;
  overflow: hidden;
  position: relative;
}

.gnav-wrapper {
 display: inline-block;
 z-index: 100000;
 width: 230px;
 height: calc(100vh - 200px);
 background: #e5f1f9;
  
}

.megamenu {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 230px;
  width: 100%;
  height: 100vh;
  max-height: 0;
  background: #e5f1f9;
  opacity: 0;
  overflow: hidden;
  transition: all .375s ease-in;
}

.megamenu-inner li {
display: block;
width: 100%;
margin-top: 200px;
padding: 0;
box-sizing: border-box;
}

.megamenu-inner .kamoku {
float: left;
width: 60%;
padding: 13px 10px 0 10px;
box-sizing: border-box;
}

.megamenu-inner a {
float: left;
width: 100%;
height: 60px;
padding-top: 24px;
background: none;
box-sizing: border-box;
color: #004673;
font-weight: bold;
text-align: center;
text-decoration: none;
line-height: 1em;
}

.megamenu-inner a:hover {
color: #f74561;
}

.megamenu-inner-img {
float: left;
  margin: 0;
}

.megamenu-inner-text{
display: inline-block;
width: 100%;
height: 50px;
margin: 0;
padding: 0 0 0 0;
text-align: center;
line-height: 1em;
}

.mega-box{
float: left;
width: 100%;
height: 700px;
background: #000;
}

.sub-bg{
position: relative;
display: block;
z-index: 1;
width: 100%;
height: 50px;
margin-top: -6px;
background: #333;
}

.w100p-80p{
width: 80%;
margin: 0 10%;
}

/*----------------------------------------------------
フッター
----------------------------------------------------*/
.footer-box{
float: right;
width: calc( 100% - 230px );
margin-top: 200px;
}

.footer-address-company-name {
  font-size: 1.3rem;
}

.copy{
margin-bottom: 0;
}

/*----------------------------------------------------
見出し
----------------------------------------------------*/
.h2-t1{
top: 45px;
left: 20px;
font-size: 1.5rem;
}

.h2-t2{
top: 45px;
right: 20px;
font-size: 1.5rem;
}

.h2-t3{
font-size: 1.5rem;
}

.h2-cont-txt{
font-size: 1.575rem;
}

.top-rec-txt{
top: 155px;
font-size: 1.5rem;
}

.h3-cont{
font-size: 1.5rem;
text-align: center;
}

/*----------------------------------------------------
コンテンツ
----------------------------------------------------*/
.col-100-30{
width: 30%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-38{
width: 38%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-48{
width: 48%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-50{
width: 50%;
vertical-align: top;
box-sizing: border-box;
}

.col-100-60{
width: 60%;
vertical-align: top;
box-sizing: border-box;
}

.logo-pc{
top: 22px;
width: 230px;
height: 200px;
}

.wrap{
float: right;
width: calc( 100% - 230px );
margin: 0;
}

.sub-nav{
width: 80%;
margin: 30px 10% 0 10%;
box-sizing: border-box;
text-align: center;
}

.nav-1 {
width: 100%;
margin-bottom: 10px;
padding: 12px 0;
border: 1px solid #0075c2;
border-radius: 4px;
background: #fff;
box-sizing: border-box;
font-size: 0.95rem;
font-weight: bold;
line-height: 1.35em !important;
transition: all .375s ease;
}

@media all and (-ms-high-contrast:none) {
	.nav-1 {
	padding: 12px 0 9px 0 !important;
	}
}
.nav-2 {
width: 100%;
margin-bottom: 10px;
box-sizing: border-box;
font-size: 0.9rem;
font-weight: bold;
line-height: 1.15em !important;
}

.nav-1:link,
.nav-1:visited{
color: #004673;
}

.nav-1:hover{
background: #3391ce;
border: 1px solid transparent;
color: #fff;
text-decoration: none;
}

.top-img img{
width: 100%;
height: 300px;
}

.top-rec img{
width: 100%;
height: 232px;
}

.top-rec-detail li{
width: 50%;
}

.top-rec-detail .txt p{
font-size: 1.275rem !important;
}

.top-rec-detail .bb a{
width: 45%;
margin: 0 27.5%;
font-size: 1.10rem;
}

.t-news ul li{
display: table-cell;
font-weight: bold;
}

.t-news .txt{
width: 50%;
margin: 0;
font-size: 1.0rem;
}

.t-news .bb a{
width: 40%;
margin: 0 30% 30px 30%;
}

.top-img .txt{
top: 140px;
font-size: 1.78rem;
}

.top-box-rm2 {
margin-top: 0;
}

.top-triangle0 {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;
border-right: 230px solid transparent;
border-top: 230px solid #0075c2;
opacity: 0.25;
mix-blend-mode: multiply;
z-index: -1;
}

.top-triangle1 {
position: absolute;
top: 0;
left: 0;
width: 0;
height: 0;

}

.top-triangle2 {
position: absolute;
top: 0;
right: 0;
width: 0;
height: 0;
}

.resp-table{
width: 80%;
margin: 0 10%;
border-collapse: collapse;
}

.resp-table th{
display: table-cell;
width: 27%;
}

.resp-table td{
display: table-cell;
width: 73%;
}

.recruit-table th{
display: table-cell;
width: 19%;
}

.inner-officer{
width: 80%;
margin: 0 10%;
}

.officer li{
display: flex;
align-items: center;
}

.officer .txt1{
width: 25%;
}

.officer .txt2{
width: 20%;
}

.officer .txt3{
width: 55%;
}

.history{
width: 80%;
margin: 0 10%;
}

.history dt{
width: 90%;
margin: 0 5%;
padding: 7px 20px;
}

.history dd{
width: 80%;
margin:3px 10% 3px 10%;
padding: 25px 10px 25px 50px;
}

.greeting-box{
display: flex;
flex-wrap: nowrap;
}

.greeting-box .img{
width: 40%;
}

.greeting-box .img img{
width: 70%;
}

.greeting-box .txt{
width: 95%;
margin: 0 0 0 5%;
padding: 0 10px 0 10px;
box-sizing: border-box;
}

.rinen{
padding-left:1em;
text-indent:-1em;
font-size: 1.0rem;
line-height: 1.75em;
}
.rinen--paragraph {
  padding-left: 0;
  text-indent: inherit;
}

.rinen-link{
margin: 20px 0 0 0;
color: blue !important;
font-size: 1.0rem;
}

.greeting{
width: 100%;
margin: 0;
}

.greeting-txt{
width: 80%;
margin: 70px 10% 0 10%;
padding: 25px;
}

.greeting-txt .head{
font-size: 1.375rem;
text-align: center;
}

.organization{
/* width: 60%;
min-width: 60%;
margin: 0 20%; */
}

.organization img{
width: auto;
display: inline-block;
}

.facility{
margin-top: 50px;
padding: 50px 40px 30px 40px;
}

.cement{
width: 90%;
margin: 30px 5% 0 5%;
padding: 20px 20px 0 20px;
}

.address{
padding: 0 35px;
font-size: 1.05rem;
}

.service-office{
padding: 20px 35px 0 35px;
font-size: 1.05rem;
}

.p1{
top: 38%;
right: 49%;
}

.p2{
top: 62.5%;
right: 47%;
}

.p3{
top: 38%;
right: 35%;
}

.p4{
top: 51%;
right: 54%;
}

.p5{
top: 48%;
left: 14%;
}

.p6{
top: 36%;
left: 20%;
}

.p7{
top: 11%;
left: 16%;
}

.p8{
bottom: 8%;
left: 32%;
}

.p9{
bottom: 64%;
right: 16.5%;
}

.p10{
bottom: 15%;
right: 30%;
}

.p11{
bottom: 35%;
right: 32%;
}

.p12{
top: 72%;
right: 47%;
}

.p1 a,
.p2 a,
.p3 a,
.p4 a,
.p5 a,
.p6 a,
.p7 a,
.p8 a,
.p9 a,
.p10 a,
.p11 a,
.p12 a{
width: auto;
height: 33px;
padding: 8px 18px;
border: 2px solid #e53b00;
border-radius: 30px;
background: #fff;
box-sizing: border-box;
color: #e53b00 !important;
font-size: 1.0rem;
font-weight: bold;
line-height: 1em !important;
}

.p9 a,
.p10 a,
.p11 a{
font-size: 1.0rem !important;
}

.p1 a:hover,
.p2 a:hover,
.p3 a:hover,
.p4 a:hover,
.p5 a:hover,
.p6 a:hover,
.p7 a:hover,
.p8 a:hover,
.p9 a:hover,
.p10 a:hover,
.p11 a:hover,
.p11 a:hover
{
border: 2px solid #ea5a28;
background: #ea5a28;
color: #fff !important;
text-decoration: none;
}

.sp-mt20,
.sp-mt30,
.sp-mt40{
margin-top: 0;
}

.indeed{
width: 50%;
margin: 50px 25% 0 25%;
}

.privacy-ol{
width: 96%;
margin: 30px 2%;
}

.call{
width: 360px;
margin: 30px 0 0 4%;
padding: 17px 19px;
border:3px solid #b2d5ed;
box-sizing: border-box;
}

.news-dl dt{
display: inline-block;
float: left;
width: 24%;
padding: 5px 10px 5px 0;
background: #fff;
}

.news-dl dd a{
display: inline-block;
width: 76%;
margin: 0;
padding: 7px 0;
}

.news-dl dd{
margin: 15px 0 15px 0;
padding: 0 5px 5px 5px;
border-bottom: 1px dotted #bbb;
}






/* dt+dd*の状態でもレイアウトを維持する */
.news-dl .flex {
  justify-content: flex-end;
  border-bottom: 1px dotted #bbb
}
.news-dl .flex dt {
  margin: 15px 0 0;
}
.news-dl .flex dd {
  margin: 15px 0 0;
}















.top-rm2{
top: 80px;
}

.one-name-txt{
width: 90%;
margin: 0 5% 0 5%;
padding: 17px 25px;
border: 5px solid #cce3f3;
box-sizing: border-box;
}

.recruit-img .box{
bottom: -4px;
right: 20px;
padding: 12px 45px 12px 110px;
text-align: center;
}

.recruit-img .box h3{
display: block;
margin-bottom: 8px;
padding-bottom: 5px;
border-bottom: 1px solid #fff;
font-size: 1.35rem;
}

.recruit-img .box p{
display: block;
font-size: 0.95rem;
}

.news2{
font-size: 1.0rem;
}

}