@charset "utf-8";

/* ************************************************ 
*	各ページ共通　枠　スライド
* ************************************************ */
.wrap-inner {
margin: 0;
padding: 0;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.wrap-left {
width: 30%;
margin: 0;
padding: 0;
}
.wrap-left-inner {
position: sticky!important;
top: 0;
}

.wrap-right {
width: 70%;
margin: 0;
padding: 0;
}
.wrap-right-inner-white {
width: calc(100% - 200px);
margin: 0;
padding: 50px 50px 100px 150px;
background: #f5f8fc;
}
.wrap-right-inner-blue {
width: calc(100% - 200px);
margin: 0;
padding: 50px 50px 100px 150px;
background: #f5f8fc;
overflow: hidden;
height: 100%;
}
.wrap-right-inner {
width: 100%;
max-width: 800px;
margin: 0;
padding: 0;
}
.wrap-right-inner1000 {
width: 100%;
max-width: 1000px;
margin: 0;
padding: 0;
}


.swiper-container {
width: 100%;
position: relative;
margin: 0 0 0 0;
}
.swiper-slide {
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
position: relative;
z-index:0;
}
.swiper-slide::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,160,180,0.05);
}

.slide-img {
background-size: cover; 
background-position: center center; /* 背景画像は中央を軸に表示させる */
height: 100vh; 
}
.swiper-slide img {
height: 100%;
margin: 0;
vertical-align: bottom;
}

.swiper-slide-active {
width: 100%!important;
}
.swiper-slide-active a{
display: block;
}

.slide-text {
position: absolute;
z-index: 10;
top: 37.5%;
left: 50%;
transform: translateX(-50%);
}
.slide-text h2{
white-space: nowrap;
letter-spacing: 0.05em;
font-size: 22px;
line-height: 1;
color: #fff;
font-weight: 500;
text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
letter-spacing: 0.1em;
}


.anq-nav-box{
margin: 0 0 50px 0;
padding: 0;
}
ul.anq-nav{
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: start;
font-size: min(1.6vw,16px);
}
ul.anq-nav li{
margin: 0 20px 0 0;
padding: 0;
list-style: none;
text-align: center;
}
ul.anq-nav li a{
background-color: #cce3f3;
color: #0075c1;
text-decoration: none;
padding: 5px 40px 5px 20px;
position:relative;
display: inline-block;
}
ul.anq-nav li a:hover{
background-color: #cce3f3;
color: #0075c1;
text-decoration: none;
}

ul.anq-nav li a::after{
position:absolute;
top:50%;
right: 10px;
transform: translateY(-50%);
content:"";
display:inline-block;
width:15px;
height:15px;
background:url("../watp/images/view-more-mo.svg") no-repeat;
background-size:contain;
}
ul.anq-nav li a:hover::after{
transition: 0.5s;
background:url("../watp/images/view-more.svg") no-repeat;
}


/* ************************************************ 
*	各ページ共通タイトルなど
* ************************************************ */
.pagetitle-box {
margin: 0 0 50px 0;
}
.pagetitle {
font-size: 24px;
margin: 0 0 10px 0;
font-weight:400;
letter-spacing: 0.05em;
padding: 0;
color: #333;
}
.pagesubtitle {
font-size: 14px;
font-weight:400;
letter-spacing: 0.05em;
padding: 0;
margin: 0;
color: #898989;
}

.midashititle-box {
margin: 50px 0 0 0;
}

.midashi-title {
font-size: 18px;
margin: 0 0 30px 0;
padding: 0;
letter-spacing: 0.05em;
font-weight: 400;
color: #0075c1;
}

.midashi-title2 {
font-size: min(2.1vw,21px);
margin: 0 0 15px 0;
padding: 0 0 20px 0;
letter-spacing: 0.05em;
font-weight: 500;
position: relative;
display: block;
}
.midashi-title2:after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  content: '';
  background-image: -webkit-repeating-linear-gradient(135deg, #ffb4b4, #ffb4b4 1px, transparent 2px, transparent 5px);
  background-image: repeating-linear-gradient(-45deg, #ffb4b4, #ffb4b4 1px, transparent 2px, transparent 5px);
  background-size: 7px 7px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}


ul.list1 {
font-size: min(1.8vw,18px);
counter-reset:list;
list-style-type:none;
padding:0;
margin: 0;
}
ul.list1 li{
position:relative;
padding: 0 0 0 20px;
margin: 0;
font-weight: normal;
line-height: 30px;
}

ul.list1 li:before{
background: #ffb4b4;
counter-increment: list;
content: "";
display: block;
position: absolute;
left: 0px;
height: 10px;
width: 10px;
border-radius: 50%;
top: 16px;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

ol.list {
padding:0;
margin: 0;
}
ol.list li{
font-size: min(2.1vw,21px);
list-style: none;
padding-left: 0;
text-indent: 0;
font-weight: 500;
border-bottom: 1px dotted #666;
margin: 0 0 30px 0;
padding: 0 0 10px 0;
}
ol.list li span{
font-size: min(1.6vw,16px);
font-weight: 400;
}


/* ************************************************ 
*	私たちについて
* ************************************************ */
.about-box{
margin: 0;
padding: 100px 0 0 0;
}
.about-box-middle{
margin: 0;
padding: 70px 0 0 0;
}
.about-box-end{
margin: 0;
padding: 50px 0 50px 0;
}
.about-textbox{
margin: 0;
max-width: 800px;
}
.about-textbox p{
font-size: min(1.6vw,16px);
}
.about-logo{
width: 500px;
max-width: 70%;
margin: 0 0 30px 0;
}
.longline{
position: relative;
padding: 0 60px 0 0;
}
.longline::after {
content : '';
display : inline-block;
position : absolute;
background-color: #333;
right : 5px;
top : 50%;
transform : translateY(-50%);
width : 50px;
height : 1px;
}


/* 私たちの強み　安全な物流を目指す取り組み　縦スライド */
.strengths-inner-list {
margin: 0;
padding: 0;
}
.strengths-inner-list .slick-prev:before,
.strengths-inner-list .slick-next:before {
position:absolute;
content:"";
display:inline-block;
width:40px;
height:40px;
background-size:contain;
}
.strengths-inner-list .slick-prev:before {
top:45%;
left: 0;
background:url("../watp/images/info-prev-btn.svg") no-repeat;
}
.strengths-inner-list .slick-next:before {
top:55%;
left: 0;
background:url("../watp/images/info-next-btn.svg") no-repeat;
}

.strengths-inner-list .slick-dots {
position: absolute;
top: calc(50% - 15px);
bottom: 0;
left: -50px;
transform : translateY(-50%);
display: block;
width: auto!important;
height: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
writing-mode: vertical-rl; /* 縦書き指定 */
text-orientation: upright; /* 英数字も縦方向に表示 */
}
.strengths-inner-list .slick-dots li {
position: relative;
display: inline-block;
margin: 5px 0;
padding: 0;
cursor: pointer;
}
.strengths-inner-list .slick-dots li button {
color: #898989;
font-size: 16px;
line-height:1;
text-align: center;
width: 27px;
height: 27px;
padding: 0 1px 0 0;
}
.strengths-inner-list .slick-dots li button::before {
content: none;
}
.strengths-inner-list .slick-dots li.slick-active button {
color: #000;
background-color: #b1c5de;
border-radius: 50vh;
height: 27px;
width: 27px;
}


.strengths-inner {
height: 200px!important;
margin: 0 0 30px 0;
padding: 0;
width: calc(100% - 2px)!important;
display: flex!important;
flex-wrap: wrap!important;
justify-content: space-between!important;
border: 1px solid #b1c5de!important;
background-color: #fff;
border-radius: 50vh;
align-items: center;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
.strengths-inner-imgbox {
margin: 0;
padding: 0;
width: 200px;
height: 200px;
border-radius: 50vh;
background-color: #b1c5de;
align-content: center;
text-align: center;
}
.strengths-inner-imgbox img{
width: 150px;
vertical-align: bottom;
margin: auto;
}
.strengths-inner-imgbox img.width120{
width: 120px;
vertical-align: bottom;
}
.strengths-inner-imgbox img.width90{
width: 90px;
vertical-align: bottom;
}
.strengths-inner-imgbox img.width80{
width: 80px;
vertical-align: bottom;
}
.strengths-inner-imgbox img.width75{
width: 75px;
vertical-align: bottom;
}
.strengths-inner-imgbox img.width70{
width: 70px;
vertical-align: bottom;
}

.strengths-inner-textbox {
margin: 0 30px 0 0;
padding: 0;
width: calc(100% - 260px);
}
.strengths-inner-textbox h3{
font-size: min(1.5vw,15px);
font-weight: 500;
margin: 0 0 5px 0;
padding: 0;
}
.strengths-inner-textbox p{
font-size: min(1.0vw,14px);
line-height: 1.5;
margin: 0;
padding: 0;
}
/* 私たちの強み　安全な物流を目指す取り組み　縦スライド ここまで*/


/* 私たちの強み　下部 */
.strengths-aboutbox {
margin: 0;
padding: 0;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.strengths-aboutbox-box {
width: 47.5%;
box-sizing: border-box;
margin: 0 0 30px 0;
padding: 20px 30px;
border: 1px solid #b1c5de;
background-color: #fff;
border-radius: 12px;
}
h4.strengths-about-title {
position: relative;
margin: 0 0 20px 0;
padding: 0 0 3px 10px;
font-size: min(1.8vw,18px);
line-height: 1;
font-weight: 400;
border-left: 3px solid #b1c5de;
color: #b1c5de;
}
.strengths-aboutbox-img {
width: 85%;
margin: 0 auto;
padding: 0;
}
.strengths-aboutbox-img2 {
width: 100%;
margin: 0 auto;
padding: 0;
}
.stat-item {
text-align: center;
}
.count {
font-size: min(3.6vw,36px);
color: #b1c5de;
line-height: 1;
}
.tani {
font-size: min(2.4vw,24px);
color: #b1c5de;
line-height: 1;
}




/* SDGs */
h4.sdgs-title {
position: relative;
margin: 0;
padding: 0 0 15px 0;
}
h4.sdgs-title label{
color: #898989;
text-decoration: none;
display: block;
font-size: min(1.8vw,18px);
font-weight: 400;
margin: 0;
text-align: left;
}
h4.sdgs-title label::before{
position:absolute;
top: 7px;
left: -40px;
margin: 0;
padding: 0;
content:"";
display:block;
width:30px;
height:10px;
background:url("../watp/images/arrow_open.svg") no-repeat;
background-position: bottom center;
background-size:20px 8px;
}
h4.sdgs-title label:hover{
color:#0075c1;
text-decoration: none;
transition: 0.5s;
}

.sdgs-box {
width: 100%;
margin: 0;
padding: 0;
}

.sdgs-hidden_box_waku {
padding: 30px;
border: 1px solid #b1c5de;
background-color: #fff;
border-radius: 12px;
}

.sdgs-hidden_box {
margin: 0;
padding: 0;
width: 100%;
max-width: 800px;
}

/*ボタン装飾*/
.sdgs-hidden_box label {
cursor :pointer;
text-decoration: none;
}
/*ボタンホバー時*/
.sdgs-hidden_box label:hover {
color:#fff;
text-decoration:none;
}

/*チェックは見えなくする*/
.sdgs-hidden_box input {
display: none;
}
/*中身を非表示にしておく*/
.sdgs-hidden_box .sdgs-hidden_show {
    margin: 0;
    padding: 0;
    height: 0;
    opacity: 0;
    overflow: hidden;
    transition: 0.5s;
}
/*クリックで中身表示*/
.sdgs-hidden_box input:checked ~ .sdgs-hidden_show {
    margin: 0 0 20px 0;
    padding: 0;
    height: auto;
    opacity: 1;
    transition: 0.8s;
}
.sdgs-hidden_box input:checked ~ h4.sdgs-title label::before {
background:url("../watp/images/arrow_close.svg") no-repeat;
background-position: bottom center;
background-size:20px 8px;
}

h4.sdgs-inner-title {
position: relative;
margin: 0 0 20px 0;
padding: 0 0 3px 10px;
font-size: min(1.8vw,18px);
line-height: 1;
font-weight: 400;
border-left: 3px solid #b1c5de;
color: #b1c5de;
}
.sdgs-imgbox {
margin: 0 0 15px 0;
padding: 0 0 0 0;
}
.sdgs-imgbox img{
vertical-align: bottom;
height: 80px;
}
ul.sdgs-list {
margin: 0 0 0 20px;
padding: 0 0 0 0;
}
ul.sdgs-list li{
position: relative;
margin: 0 0 10px 0;
padding: 0 0 0 0;
font-size: min(1.4vw,14px);
list-style-type: circle;
line-height: 1.5;
}



/* ************************************************ 
*	会社案内
* ************************************************ */
.company-box{
margin: 0;
padding: 100px 0 0 0;
}
table.company {
width: 100%;
margin: 0;
padding: 0;
border: none;
border-collapse: collapse;
border-spacing: 0;
border-top: 1px solid #ccc;
font-size: min(1.6vw,16px);
}
table.company tr {
border-bottom: 1px solid #ccc;
}
table.company th {
padding: 25px 5px;
white-space: normal;
font-weight: normal;
vertical-align: top;
width: 20%;
color: #0075c1;
}
table.company td {
text-align: left;
padding: 25px 5px;
white-space: normal;
vertical-align: top;
}

table.history {
width: 100%;
margin: 0;
padding: 0;
border: none;
border-collapse: collapse;
border-spacing: 0;
border-top: 1px solid #ccc;
font-size: min(1.6vw,16px);
}
table.history tr {
border-bottom: 1px solid #ccc;
}
table.history th {
padding: 25px 5px;
text-align: left;
white-space: normal;
font-weight: normal;
vertical-align: top;
width: 20%;
color: #0075c1;
}
.indent1 { margin-left: 1.2em; color: #0075c1;}
.indent2 { margin-left: 0.8em; color: #0075c1;}
.indent6 { margin-left: 0.9em; color: #0075c1;}
.indent3 { margin-left: 3.7em; color: #0075c1;}
.indent4 { margin-left: 3.63em; color: #0075c1;}
.indent5 { margin-left: 4em; color: #0075c1;}
table.history td {
text-align: left;
padding: 25px 5px;
white-space: normal;
vertical-align: top;
}

.map-box{
margin: 0;
padding: 150px 0 0 0;
}
.map-box2{
margin: 0;
padding: 0;
}
.map-box-inner {
margin: 0;
padding: 50px 0;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
border-top: 1px solid #ccc;
}
.add-area{
width: 35%;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
}
.add-area h3{
font-size: min(1.8vw,18px);
font-weight: 400;
margin: 0 0 50px 0;
padding: 0;
color: #0075c1;
}
.add-area p{
font-size: min(1.6vw,16px);
margin: 0;
padding: 0;
}
.add-area .google{
margin: auto 0 0 0;
}
.add-area .google a{
color: #0075c1;
text-decoration:underline;
}
.add-area .google a:hover{
color: #333;
text-decoration:none;
}
.map-area{
width: 65%;
height: 300px;
margin: 0;
padding: 0;
position: relative;
overflow-y: hidden;
}
.map-area iframe {
position: absolute;
top: -150px;
left: 0;
width: 100%;
height: calc(100% + (150px * 2));
}


/* ************************************************ 
*	事業案内
* ************************************************ */
.service-box{
margin: 0;
padding: 100px 0 0 0;
}
.service-textbox{
margin: 0 0 0 0;
}
.service-textbox p{
font-size: min(1.6vw,16px);
}


/* 事業案内　輸送品目　縦スライド */
.service-transport-inner-list {
margin: 0;
padding: 0;
}
.service-transport-inner-list .slick-prev:before,
.service-transport-inner-list .slick-next:before {
position:absolute;
content:"";
display:inline-block;
width:40px;
height:40px;
background-size:contain;
}
.service-transport-inner-list .slick-prev:before {
top:45%;
left: 0;
background:url("../watp/images/info-prev-btn.svg") no-repeat;
}
.service-transport-inner-list .slick-next:before {
top:55%;
left: 0;
background:url("../watp/images/info-next-btn.svg") no-repeat;
}

.service-transport-inner-list .slick-dots {
position: absolute;
top: calc(50% - 15px);
bottom: 0;
left: -50px;
transform : translateY(-50%);
display: block;
width: auto!important;
height: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
writing-mode: vertical-rl; /* 縦書き指定 */
text-orientation: upright; /* 英数字も縦方向に表示 */
}
.service-transport-inner-list .slick-dots li {
position: relative;
display: inline-block;
margin: 5px 0;
padding: 0;
cursor: pointer;
}
.service-transport-inner-list .slick-dots li button {
color: #898989;
font-size: 16px;
line-height:1;
text-align: center;
width: 27px;
height: 27px;
padding: 0 1px 0 0;
}
.service-transport-inner-list .slick-dots li button::before {
content: none;
}
.service-transport-inner-list .slick-dots li.slick-active button {
color: #000;
background-color: #b1c5de;
border-radius: 50vh;
height: 27px;
width: 27px;
}


.service-transport-inner {
height: 200px!important;
margin: 0 0 30px 0;
padding: 0;
width: calc(100% - 2px)!important;
display: flex!important;
flex-wrap: wrap!important;
justify-content: space-between!important;
border: 1px solid #b1c5de!important;
background-color: #fff;
border-radius: 50vh;
align-items: center;
position: relative;
overflow: hidden;
box-sizing: border-box;
}
.service-transport-inner-imgbox {
margin: 0;
padding: 0;
width: 200px;
height: 200px;
border-radius: 50vh;
background-color: #b1c5de;
align-content: center;
text-align: center;
}
.service-transport-inner-imgbox img{
width: 150px;
vertical-align: bottom;
margin: auto;
}
.service-transport-inner-imgbox img.width120{
width: 120px;
vertical-align: bottom;
}
.service-transport-inner-imgbox img.width90{
width: 90px;
vertical-align: bottom;
}

.service-transport-inner-textbox {
margin: 0 30px 0 0;
padding: 0;
width: calc(100% - 260px);
}
.service-transport-inner-textbox h3{
font-size: min(1.5vw,15px);
font-weight: 500;
margin: 0 0 5px 0;
padding: 0;
}
.service-transport-inner-textbox p{
font-size: min(1.0vw,14px);
line-height: 1.5;
margin: 0;
padding: 0;
}
/* 事業案内　輸送品目　縦スライド ここまで*/


.service-area-inner {
margin: -50px auto 50px auto;
padding: 0;
width: 75%;
position: relative;
z-index: 0;
}
.area-circle {
position: absolute;
top: 52%;
left: 58%;
transform : translate(-50%,-50%);
z-index: 1;
width: 100%;
height: 100%;
background-color: #b1c5de;
display: flex;
justify-content: center;
align-items: center;
clip-path: circle(0%);
animation: showCircle 3s ease-in-out 1s forwards infinite;
}

@keyframes showCircle {
  0% {
    clip-path: circle(20%);
    opacity: 0.6;
  }
  50% {
    clip-path: circle(38%);
    opacity: 0;
  }
  100% {
    clip-path: circle(20%);
    opacity: 0.6;
  }
}

.service-jirei-inner {
margin: 0 auto 50px auto;
padding: 0;
width: 100%;
}
.service-jirei-inner img{
margin: 50px 0 0 0;
vertical-align: bottom;
}

.service-warehouse-inner {
margin: 0 0 70px 0;
padding: 0;
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.service-warehouse-img{
width: 48%;
margin: 0;
padding: 0;
position: relative;
z-index:0;
}


.slider-se {
z-index: 0;
list-style: none;
}
.slider-se .slick-slide {
position: relative;
overflow: hidden;
margin: 0;
z-index:0;
}
.slider-se .slick-slide::before{
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,160,180,0.05);
}
.slider-se .slick-slide img {
width: 100%;
height: auto;
}
.slider-se .slick-prev:before,
.slider-se .slick-next:before {
position:absolute;
top:50%;
transform : translateY(-50%);
content:"";
display:inline-block;
width:8px;
height:16px;
background-size:contain;

}
.slider-se .slick-prev:before {
left: 5px;
background:url("../watp/images/slide-prev.svg") no-repeat;
}
.slider-se .slick-next:before {
right: 5px;
background:url("../watp/images/slide-next.svg") no-repeat;
}

.service-warehouse-img-text{
color: #fff;
font-size: min(1.5vw,15px);
text-align: center;
margin: 0;
padding: 0;
position: absolute;
left: 50%;
bottom: 15px;
transform: translateX(-50%);
}

.service-warehouse-text-box{
width: 46%;
margin: 20px 0 0 0;
padding: 0;
}
.service-warehouse-text-box h3{
font-size: min(1.5vw,18px);
margin: 0 0 25px 0;
padding: 0;
font-weight: 500;
line-height: 1.5;
}
.service-warehouse-text-box p{
font-size: min(1.5vw,15px);
line-height: 1.8;
}


/* ************************************************ 
*	保有車両一覧
* ************************************************ */
.vehicle-box{
margin: 0;
padding: 100px 0 0 0;
}
.vehicle-box2{
margin: 0;
padding: 0;
}

.vehicle-box-inner{
margin: 0;
padding: 10px 0 90px 0;
text-align: center;
}
.vehicle-box-inner-end{
margin: 0;
padding: 10px 0 40px 0;
text-align: center;
}
.vehicle-box-inner p,
.vehicle-box-inner-end p{
margin: 0;
padding: 0;
font-size: min(1.6vw,16px);
}
.vehicle-box-inner p span,
.vehicle-box-inner-end p span{
color: #0075c1;
}
.vehicle-box-inner img,
.vehicle-box-inner-end img{
margin: 0 0 25px 0;
padding: 0;
vertical-align: bottom;
}
.vehicle-box-inner img.width75,
.vehicle-box-inner-end img.width75{
width: 75%;
vertical-align: bottom;
}
.vehicle-box-inner img.width70,
.vehicle-box-inner-end img.width70{
width: 70%;
vertical-align: bottom;
}
.vehicle-box-inner img.width60,
.vehicle-box-inner-end img.width60{
width: 60%;
vertical-align: bottom;
}
.vehicle-box-inner img.width55,
.vehicle-box-inner-end img.width55{
width: 55%;
vertical-align: bottom;
}


/* ************************************************ 
*	採用情報
* ************************************************ */
.recruit-box{
margin: 0;
padding: 100px 0 0 0;
}
.recruit-textbox{
margin: 0 0 0 80px;
}
.recruit-textbox p{
font-size: min(1.6vw,16px);
}


/* ************************************************ 
*	お知らせ
* ************************************************ */
.news-box{
margin: 0;
padding: 100px 0 0 0;
}
.newsbox-inner{
margin: 0;
padding: 0;
}
.newsbox-inner ul{
float:left;
margin: 0;
padding: 0;
width: 100%;
}

.newsbox-inner li{
float:left;
margin: 0 0 0 0;
padding: 50px 0;
list-style: none;
width: 100%;
border-bottom: 1px solid #999;
position:relative;
font-size: min(1.6vw,15px);
letter-spacing: 0.05em;
}

.newsbox-inner li a{
color:#333;
margin: 0 0 0 0;
padding: 0 0 0 0;
list-style: none;
line-height:1;
text-decoration: none;
}
.newsbox-inner li a::after{
position:absolute;
top:50%;
right: 15px;
transform : translateY(-50%);
content:"";
display:inline-block;
width:40px;
height:40px;
background:url("../watp/images/news-view-more.svg") no-repeat;
background-size:contain;
transition: 0.5s;
}
.newsbox-inner li a:hover::after{
background:url("../watp/images/news-view-more-mo.svg") no-repeat;
transition: 0.5s;
}

.newsbox-inner li a:hover{
text-decoration:none;
text-underline-offset:0.3em;
color:#0075c1;
}


.news-item-title-news {
width: calc(100% - 25px);
line-height: 150%;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: start;
}
.news-item-title-news-date{
width: 13%;
font-weight: 400;
margin: 0;
padding: 0;
color: #898989;
}
.news-item-title-news-title{
width: 82%;
font-weight: 400;
margin: 0;
padding: 0;
}


.news-title-single {
margin: 0;
padding: 0 0 20px 0;
font-size: min(1.8vw,18px);
font-weight: 400;
line-height: 1.8;
position: relative;
border-bottom: 1px solid #898989;
}
.date-single {
font-size: min(1.4vw,14px);
padding: 0px 10px;
margin: 10px 0 15px 0;
background-color: #b1c5de;
color: #fff;
display: inline-block;
}
.news-text-single p{
font-size: min(1.6vw,16px);
line-height: 1.9;
}


/* ************************************************ 
*	お問い合わせ
* ************************************************ */
.contact-box{
margin: 0;
padding: 100px 0 0 0;
}
.contact-top-box{
margin: 0;
padding: 0 0 50px 0;
}
.contact-top-box p{
font-size: min(1.6vw,16px);
}
.contact-top-box p a{
color: #0075c1;
text-decoration: none;
}
table.contact {
width: 100%;
margin: 0 0 50px 0;
padding: 0;
border: none;
border-collapse: collapse;
border-spacing: 0;
border-top: 1px solid #ccc;
}
table.contact tr {
border-bottom: 1px solid #ccc;
}
table.contact th {
padding: 25px 5px;
white-space: normal;
font-weight: normal;
vertical-align: top;
width: 25%;
}
table.contact th label{
font-size: min(1.6vw,16px);
}
table.contact td {
text-align: left;
padding: 25px 5px;
white-space: normal;
vertical-align: top;
}
.contact-end{
text-align: center;
margin: 0 auto;
}
.contact-end p{
font-size: min(1.6vw,16px);
}
/* 送信ボタン */
input.sub-btn {
width: 30%;
background-color: #cce3f3;
color: #0075c1;
font-size: 16px;
margin: 20px auto 0 auto;
padding: 10px;
letter-spacing: 0.1em;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
transition: 0.5s;
border-radius: 5px !important; /* CSS3 */
 -webkit-border-radius: 5px !important; /* Firefox */
 -moz-border-radius: 5px !important; /* Safari,Chrome */
}

/* 送信ボタンホバー */
input.sub-btn:hover{
background-color: #0075c1;
color: #fff;  
border-radius: 5px; /* CSS3 */
 -webkit-border-radius: 5px; /* Firefox */
 -moz-border-radius: 5px; /* Safari,Chrome */	
}
.wpcf7-spinner {
width: 0!important;
height: 0!important;
margin: 0!important;
}

input[type="submit"] {
  -webkit-appearance: none;
  border-radius: 0;
  border-style: none;
  border-color: none;
}

.privacy-box{
margin: 0;
padding: 100px 0 50px 0;
}
.privacy-box-textbox{
margin: 0 0 50px 0;
padding: 0;
}
.privacy-box p{
font-size: min(1.6vw,16px);
}
.privacy-box-textbox ul{
margin: 15px 0 0 0;
}
.privacy-box-textbox ul li{
font-size: min(1.5vw,15px);
list-style-type:none;
position:relative;
padding: 0 0 0 15px;
margin: 0;
font-weight: normal;
line-height: 30px;
}
.privacy-box-textbox ul li:before{
background: #898989;
counter-increment: list;
content: "";
display: block;
position: absolute;
left: 0px;
height: 7px;
width: 7px;
border-radius: 50%;
top: 16px;
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}



/* ************************************************ 
*	ブログ
* ************************************************ */
.blog-title {
margin: 0px 0px 5px 0px;
padding: 0px 0px 0px 0px;
font-size: 18px;
font-weight: normal;
color: #333;
line-height:120%;
}

.blog-title a {
color:#333;
}
.blog-title a:hover {
color:#000;
text-decoration: underline;
}

/* ブログ記事部分 */	
p {
font-size: 16px; 
color: #333;
line-height: 190%;
padding: 0px 0px 0px 0px;
}

p a {
color:#3684C6;
text-decoration:underline;
transition: 0.5s;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
-ms-transition: 0.5s;
}

p a:hover {
color:#000;
}

p a:active, a:focus {
outline: 0;
}

#youtube-box{
margin: 20px auto 10px auto;
padding: 0 0 0 0;
height: 350px;
width: 100%;
text-align: center;
}


/* ************************************************ 
*	BLOG　NEWS ページャー 
* ************************************************ */
.next-pagenavi{
text-align:center;
margin:50px 0 0 0;
padding:0;
}

#next {
font-size:100%;
font-weight:lighter;
text-align: center;
padding: 100px 0 50px 0;
}
#next .left{ width:47%; margin: 0 3% 0 0; text-align:left; float:left;}
#next .right{ width:47%; margin: 0 0 0 3%; text-align:right; float:right;}
#next .left a{font-size: min(1.4vw,14px); padding: 0; display: block; line-height: 1.7; color: #898989; text-decoration: none;}
#next .right a{font-size: min(1.4vw,14px); padding: 0; display: block; line-height: 1.7; color: #898989; text-decoration: none;}
#next .left a:hover{ color: #0075c1; text-decoration: none;}
#next .right a:hover{ color: #0075c1; text-decoration: none;}

.wp-pagenavi span.pages {
color: #898989;
background-color:#fff;
border: 1px solid #898989!important;
font-size: min(1.6vw,16px);
display: inline-block;
line-height: 1;
margin: 3px!important;
padding: 10px 5px 0 5px!important;
text-decoration:none;
height: 30px;
border-radius: 50vh; /* CSS3 */
 -webkit-border-radius: 50vh; /* Firefox */
 -moz-border-radius: 50vh; /* Safari,Chrome */
}
.wp-pagenavi a {
color: #898989;
background-color:#fff;
border: 1px solid #898989!important;
font-size: min(1.6vw,16px);
display: inline-block;
line-height: 1;
margin: 3px!important;
padding: 10px 5px 0 5px!important;
text-decoration:none;
height: 30px;
width: 30px;
border-radius: 50vh; /* CSS3 */
 -webkit-border-radius: 50vh; /* Firefox */
 -moz-border-radius: 50vh; /* Safari,Chrome */
}
.wp-pagenavi a:hover {
color: #fff;
background-color:#0075c1;
border: 1px solid #0075c1!important;
}
.wp-pagenavi span.current {
color: #0075c1;
background-color:#fff;
border: 1px solid #0075c1!important;
font-size: min(1.6vw,16px);
font-weight: 500!important;
display: inline-block;
line-height: 1;
margin: 3px!important;
padding: 10px 5px 0 5px!important;
text-decoration:none;
height: 30px;
width: 30px;
border-radius: 50vh; /* CSS3 */
 -webkit-border-radius: 50vh; /* Firefox */
 -moz-border-radius: 50vh; /* Safari,Chrome */
}


/* ************************************************ 
*	レスポンシブ
* ************************************************ */
/* PC 画面の横幅が1160px以上 */
@media only screen and (min-width: 1160px) {
#wing,
#flat,
#crane {
margin-top: -50px;
padding-top: 50px;
}
#yoshida,
#kawada,
#koami,
#tarui {
margin-top: -80px;
padding-top: 80px;
}
}


/* Tablet (Portrait) 画面の横幅が768px〜1159pxまで */
@media only screen and (min-width: 768px) and (max-width: 1159px) {
.slide-text h2 { font-size: 2vw; }
.wrap-right-inner-blue {
width: calc(100% - 80px);
padding: 50px 40px 30px 40px;
}
ul.anq-nav li{ margin: 0 10px 0 0; }
ul.anq-nav li a{ padding: 5px 30px 5px 10px; }

.about-box { padding: 70px 0 0 0; }
.about-box-middle { padding: 40px 0 0 0; }
.about-box-end { padding: 20px 0 50px 0; }
.about-textbox { margin: 0 0 0 0; }

.strengths-inner {
height: 300px!important;
margin: 0 0 20px 0;
border-radius: 0;
}
.strengths-inner-imgbox {
margin: 0 0 0 20px;
width: 120px;
height: 120px;
}
.strengths-inner-textbox {
margin: 0 20px 0 0;
padding: 0;
width: calc(100% - 180px);
}
.strengths-inner-textbox h3 {
font-size: min(1.6vw, 15px);
}
.strengths-inner-textbox p {
font-size: min(1.4vw, 14px);
}
.strengths-inner-list .slick-dots {
left: -30px;
}
.strengths-inner-imgbox img{ width: 100px; }
.strengths-inner-imgbox img.width120{ width: 90px; }
.strengths-inner-imgbox img.width90{ width: 70px; }
.strengths-inner-imgbox img.width80{ width: 60px; }
.strengths-inner-imgbox img.width75{ width: 55px; }
.strengths-inner-imgbox img.width70{ width: 50px; }

.strengths-aboutbox-box {
margin: 0 0 30px 0;
padding: 20px;
}
h4.strengths-about-title {
margin: 0 0 20px 0;
padding: 0 0 3px 10px;
}
.strengths-aboutbox-img {
width: 90%;
}

h4.sdgs-title label::before {
top: 7px;
left: -30px;
width: 30px;
height: 10px;
background-size: 20px 8px;
}

.company-box { padding: 70px 0 0 0; }
.pagetitle-box { margin: 0 0 30px 0; }
.pagetitle { font-size: 2.3vw; }
.pagesubtitle { font-size: 1.6vw; }
.midashi-title {
font-size: 2.0vw;
margin: 0 0 20px 0;
}

.map-box { padding: 100px 0 0 0; }
.add-area {
width: 100%;
margin: 0 0 20px 0;
}
.add-area h3 {
font-size: min(1.8vw, 18px);
margin: 0 0 30px 0;
}
.map-area {
width: 100%;
height: 300px;
}


.service-box { padding: 70px 0 0 0; }
.service-textbox { margin: 0 0 0 0; }

.service-transport-inner {
height: 180px!important;
margin: 0 0 20px 0;
border-radius: 0;
}
.service-transport-inner-imgbox {
margin: 0 0 0 20px;
width: 120px;
height: 120px;
}
.service-transport-inner-textbox {
margin: 0 20px 0 0;
padding: 0;
width: calc(100% - 180px);
}
.service-transport-inner-textbox h3 {
font-size: min(1.6vw, 15px);
}
.service-transport-inner-textbox p {
font-size: min(1.4vw, 14px);
}
.service-transport-inner-list .slick-dots {
left: -30px;
}
.service-transport-inner-imgbox img{ width: 100px; }
.service-transport-inner-imgbox img.width120{ width: 90px; }
.service-transport-inner-imgbox img.width90{ width: 70px; }

.service-area-inner { margin: -20px auto 50px auto; }


.vehicle-box { padding: 70px 0 0 0; }
.vehicle-box-inner,
.vehicle-box-inner-end{
padding: 10px 0 50px 0;
}
.vehicle-box-inner img,
.vehicle-box-inner-end img{
margin: 0 0 20px 0;
}

.recruit-box { padding: 70px 0 0 0; }
.recruit-textbox { margin: 0 0 0 0; }

.contact-box { padding: 70px 0 0 0; }
table.contact th {
padding: 25px 5px;
width: 35%;
}
.privacy-box { padding: 70px 0; }

.news-box { padding: 70px 0 0 0; }
.newsbox-inner li a::after {
right: 0;
width: 30px;
height: 30px;
}
.news-item-title-news {
width: calc(100% - 20px);
}
.news-item-title-news-date{
width: 20%;
}
.news-item-title-news-title{
width: 75%;
}


.wp-pagenavi span.pages {
padding: 10px 5px 0 5px!important;
height: 25px;
}
.wp-pagenavi a,
.wp-pagenavi span.current {
padding: 10px 5px 0 5px!important;
height: 25px;
width: 25px;
}

#wing,
#flat,
#crane {
margin-top: -50px;
padding-top: 50px;
}
#yoshida,
#kawada,
#koami,
#tarui {
margin-top: -80px;
padding-top: 80px;
}
}

/* Mobile (Portrait) 画面の横幅が767pxまで */
@media only screen and (max-width: 767px) {
p { font-size: 4vw; }

.wrap-inner { margin: 0; }
.wrap-left {
width: 100%;
margin: 0;
padding: 0;
}
.wrap-left-inner {
position: relative;
}
.wrap-right {
width: 100%;
margin: 0;
padding: 0;
}
.wrap-right-inner-white,
.wrap-right-inner-blue {
width: calc(100% - 10%);
padding: 0 5% 50px 5%;
}

.slide-text h2{ font-size:5.5vw; }
.slide-img {
height: calc(100svh - 70px); 
}

.pagetitle-box { margin: 0 0 30px 0; }
.pagetitle { font-size: 6vw; }
.pagesubtitle { font-size: 4vw; }
.midashi-title {
font-size: 4.75vw;
margin: 0 0 10px 0;
}

ul.list1 { font-size: 4.5vw; }
ul.list1 li:before { top: 13px; }
ul.list1 li { padding: 0 0 0 15px; }

ol.list li{ font-size: 5vw; }
ol.list li span{ font-size: 4vw; }

ul.anq-nav{
font-size: 4vw;
justify-content: space-between;
}
ul.anq-nav li{
margin: 0 0 15px 0;
width: 47.5%;
}
ul.anq-nav li a{
width: calc(100% - 40px);
padding: 5px 20px;
}

.about-box { padding: 70px 0 0 0; }
.about-box-middle { padding: 40px 0 0 0; }
.about-box-end { padding: 20px 0 0 0; }
.about-textbox { margin: 0 0 0 0; }
.about-textbox p { font-size: 4.25vw; }
.about-logo {
width: 100%;
max-width: 100%;
}

.strengths-inner-list {
margin: 0;
padding: 30px 0 0 0;
}
.strengths-inner {
height: 650px!important;
padding: 30px 15px;
margin: 0 0 30px 0;
width: calc(100% - 2px) !important;
border-radius: 0;
display: block!important;
align-items: flex-start;
}
.strengths-inner-imgbox {
margin: 0 auto 20px auto;
width: 200px;
height: 200px;
border-radius: 50vh;
background-color: #b1c5de;
align-content: center;
}
.strengths-inner-textbox {
margin: 0 0 0 0;
padding: 0;
width: 100%;
}
.strengths-inner-textbox h3 {
font-size: 4.75vw;
margin: 0 0 10px 0;
}
.strengths-inner-textbox p {
font-size: 4.25vw;
line-height: 1.5;
}

.strengths-inner-list .slick-dots {
position: absolute;
top: -10px;
bottom: 0;
left: 50%;
transform: translate(-50%, 0);
display: block;
width: auto !important;
height: auto;
writing-mode: horizontal-tb;
text-orientation: upright;
}
.strengths-inner-list .slick-dots li {
margin: 0 5px;
}
.strengths-inner-list .slick-dots li button {
font-size: 16px;
width: 27px;
height: 27px;
padding: 1px 0 0 0;
}

.strengths-aboutbox-box {
width: 100%;
padding: 20px;
}
h4.strengths-about-title {
margin: 0 0 20px 0;
padding: 0 0 3px 10px;
font-size: 5vw;
}
.count { font-size: 7vw; }
.tani { font-size: 4.25vw; }

h4.sdgs-title label {
padding: 0 0 0 23px;
font-size: 4.75vw;
}
h4.sdgs-title label::before {
top: 7px;
left: -7px;
margin: 0;
padding: 0;
width: 30px;
height: 10px;
background-size: 20px 8px;
}

.sdgs-hidden_box_waku { padding: 20px 15px; }
h4.sdgs-inner-title {
margin: 0 0 20px 0;
padding: 0 0 3px 10px;
font-size: 4.75vw;
}
ul.sdgs-list li {
margin: 0 0 10px 0;
font-size: 4.25vw;
}
.sdgs-imgbox img { height: 70px; }


.company-box { padding: 70px 0 0 0; }
table.company { font-size: 4vw; }
table.company th {
padding: 15px 5px;
width: calc(100% - 10px);
display: block;
background-color:#fff;
}
table.company td {
padding: 15px 5px;
width: calc(100% - 10px);
display: block;
}
table.history { font-size: 4vw; }
table.history th {
padding: 15px 5px;
width: calc(100% - 10px);
display: block;
background-color:#fff;
}
table.history td {
padding: 15px 5px;
width: calc(100% - 10px);
display: block;
}

.map-box { padding: 70px 0 0 0; }
.map-box-inner { padding: 30px 0; }
.add-area {
width: 100%;
margin: 0 0 20px 0;
padding: 0;
}
.add-area h3 {
font-size: 5vw;
margin: 0 0 30px 0;
}
.add-area p {
font-size: 4vw;
}

.map-area {
width: 100%;
height: 300px;
margin: 0;
padding: 0;
}

.service-box { padding: 70px 0 0 0; }
.service-textbox { margin: 0 0 0 0; }
.service-textbox p { font-size: 4.25vw; }

.service-transport-inner-list {
margin: 0;
padding: 30px 0 0 0;
}
.service-transport-inner {
height: 500px!important;
padding: 30px 15px;
margin: 0 0 30px 0;
width: calc(100% - 2px) !important;
border-radius: 0;
display: block!important;
align-items: flex-start;
}
.service-transport-inner-imgbox {
margin: 0 auto 20px auto;
width: 200px;
height: 200px;
border-radius: 50vh;
background-color: #b1c5de;
align-content: center;
}
.service-transport-inner-textbox {
margin: 0 0 0 0;
padding: 0;
width: 100%;
}
.service-transport-inner-textbox h3 {
font-size: 4.75vw;
margin: 0 0 10px 0;
}
.service-transport-inner-textbox p {
font-size: 4.25vw;
line-height: 1.5;
}

.service-transport-inner-list .slick-dots {
position: absolute;
top: -10px;
bottom: 0;
left: 50%;
transform: translate(-50%, 0);
display: block;
width: auto !important;
height: auto;
writing-mode: horizontal-tb;
text-orientation: upright;
}
.service-transport-inner-list .slick-dots li {
margin: 0 5px;
}
.service-transport-inner-list .slick-dots li button {
font-size: 16px;
width: 27px;
height: 27px;
padding: 1px 0 0 0;
}

.service-area-inner {
margin: -20px auto 50px auto;
width: 100%;
}
.service-warehouse-img {
width: 100%;
margin: 0 0 15px 0;
}
.service-warehouse-img-text { font-size: 4.25vw; }
.service-warehouse-text-box{
width: 100%;
margin: 0 0 0 0;
padding: 0;
}
.service-warehouse-text-box h3{
font-size: 4.5vw;
margin: 0 0 20px 0;
}
.service-warehouse-text-box p{
font-size: 4.25vw;
line-height: 1.8;
}
.slider-se .slick-prev { left: -15px; }
.slider-se .slick-next { right: -15px; }


.vehicle-box { padding: 70px 0 0 0; }
.vehicle-box-inner{
padding: 20px 0 50px 0;
text-align: left;
}
.vehicle-box-inner-end{
padding: 20px 0 20px 0;
text-align: left;
}
.vehicle-box-inner p,
.vehicle-box-inner-end p{
font-size: 4.25vw;
line-height: 1.5;
}
.vehicle-box-inner img,
.vehicle-box-inner-end img{
margin: 0 0 15px 0;
}
.vehicle-box-inner img.width75,
.vehicle-box-inner-end img.width75{
width: 90%;
}
.vehicle-box-inner img.width70,
.vehicle-box-inner-end img.width70{
width: 85%;
}
.vehicle-box-inner img.width60,
.vehicle-box-inner-end img.width60{
width: 80%;
}
.vehicle-box-inner img.width55,
.vehicle-box-inner-end img.width55{
width: 75%;
}


.recruit-box { padding: 70px 0 0 0; }
.recruit-textbox { margin: 0 0 0 0; }
.recruit-textbox p { font-size: 4.25vw; }


.contact-box { padding: 70px 0 0 0; }
.contact-top-box p { font-size: 4.25vw; }
table.contact {
margin: 0 0 25px 0;
font-size: 4vw;
}
table.contact th {
padding: 15px 0 5px 0;
width: 100%;
display: block;
}
table.contact th label{ font-size: 4.25vw; }
table.contact td {
padding: 0 0 15px 0;
width: 100%;
display: block;
}
.contact-end p { font-size: 4.25vw; }
input.sub-btn {
width: 100%;
}
.privacy-box { padding: 50px 0; }
.privacy-box p { font-size: 4.25vw; }
.privacy-box-textbox ul li{ font-size: 4vw; }

.news-box { padding: 70px 0 0 0; }
.newsbox-inner li { padding: 25px 0; }
.newsbox-inner li a::after {
right: 0;
width: 30px;
height: 30px;
}
.news-item-title-news-date{
width: 100%;
}
.news-item-title-news-title{
width: 100%;
}
.news-item-title-news {
width: calc(100% - 40px);
}

.news-title-single {
font-size: 4.5vw;
line-height: 1.6;
}
.date-single {
font-size: 3.5vw;
padding: 0 10px;
}
.news-text-single p{
font-size: 4.25vw;
line-height: 1.8;
}
#next .left a{ font-size: 3.5vw;}
#next .right a{ font-size: 3.5vw;}

.wp-pagenavi span.pages {
padding: 10px 5px 0 5px!important;
height: 25px;
font-size: 3.75vw;
}
.wp-pagenavi a,
.wp-pagenavi span.current {
padding: 10px 5px 0 5px!important;
height: 25px;
width: 25px;
font-size: 3.75vw;
}

#wing,
#flat,
#crane {
margin-top: 0;
padding-top: 0;
}
#yoshida,
#kawada,
#koami,
#tarui {
margin-top: -50px;
padding-top: 50px;
}
}