  @charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/* 2026
----------------------------------------------- */
:root{
	--color-main:#0077CD;
	--color-main-rgb:0,119,205;
	--color-black:#444;
	--bg-blue-light:#EBF1F7;
	--border-radius:15px;

	--px:40px;
	--px-sm:30px;
	--py:80px;
}

/* Bootstrap Reset
----------------------------------------------- */
h1, .h1{margin:0; line-height:1; font-size:30px;}
h2, h3, h4, h5, h6,
.h2, .h3, .h4, .h5, .h6{margin-top:0;}

h2{margin-bottom:60px; line-height:1.4;}
h3,h4{line-height:1.4;}

.lead{font-weight:500;}

.btn-lg{min-width:200px;}
a.btn:hover{
	opacity:1;
}

.btn-skeleton {
	background-color:inherit;
	border:1px solid white;
	color:white;
}
a.btn-skeleton:hover {
	background-color:white;
	color:#007ED9;
}
.btn-primary {
	background-color:#007ED9;
	border:none;
}
.table{border-bottom:1px solid #DDD;}

/* ハンバーガー */
.navbar-default .navbar-nav>li>a{color:#444;}
.navbar-default .navbar-toggle{border-color:transparent; padding:5px;}
.navbar-default .navbar-toggle .icon-bar{background-color:#0077CD;}
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover{
	background-color:white;
}
.navbar-toggle .icon-bar{
	width:30px;
}
.navbar-toggle .icon-bar+.icon-bar{
	margin-top:8px;
}

@media (min-width: 768px){
	.lead{font-size:23px; color:var(--color-main);}
}
@media (max-width: 767px){
	h1{font-size:20px;}
	h2{font-size:21px;}
	h3,.h3{font-size:20px;}
}

/* Font
----------------------------------------------- */
.en01{font-family:'Roboto', sans-serif;}
body{-webkit-font-smoothing: antialiased;}

/* Frame Layout
----------------------------------------------- */
html,body{height:100%;}
body{
	font-family:"Noto Sans JP", sans-serif;
	font-optical-sizing:auto;
	font-weight:400;
	font-style: normal;
	font-size:16px;
	background:url('/jp/sobulogistics/assets/images/common/bg.jpg');
	background-attachment:fixed;
}
#wrapper{
	color:var(--color-black);
	width:100%;
	position:relative;
	background-color:white;
	letter-spacing:0.05em;
}
#container{line-height:1.8; padding-top:70px; overflow:hidden;}
.onContentsNavi #container{padding-top:105px;}
.contents{padding-top:var(--py); padding-bottom:var(--py);}
.contents-top0{padding-top:0 !important;}
.contents-btm0{padding-bottom:0 !important;}


.container-fluid,
.container{padding-left:var(--px); padding-right:var(--px);}
/*
.thin{max-width:1000px; margin-left:auto; margin-right:auto;}
.container.thin{max-width:calc(1000px + var(--container-px) * 2);}
*/

/*
.row:not([class*="g-"]){margin-left:calc(var(--px) * -1); margin-right:calc(var(--px) * -1);}
.row:not([class*="g-"])>[class*="col"]{padding-left:var(--px); padding-right:var(--px);}
*/
.row{margin-left:calc(var(--px) * -1); margin-right:calc(var(--px) * -1);}
.row>[class*="col"]{padding-left:var(--px); padding-right:var(--px);}
.row-sm{margin-left:calc(var(--px-sm) / 2 * -1); margin-right:calc(var(--px-sm) / 2 * -1);}
.row-sm>[class*="col"]{padding-left:calc(var(--px-sm) / 2); padding-right:calc(var(--px-sm) / 2);}
.d-flex.row-sm,
.d-flex.gy-sm{row-gap:var(--px-sm);}

.py-content{padding-top:var(--py); padding-bottom:var(--py);}
.py-content-sm{padding-top:calc(var(--py) / 2); padding-bottom:calc(var(--py) / 2);}
/*
.my-content{margin-top:var(--container-py); margin-bottom:var(--container-py);}
.my-content-sm{margin-top:calc(var(--container-py) / 2); margin-bottom:calc(var(--container-py) / 2);}

.mb-content{margin-bottom:var(--container-py);}
.mb-content-sm{margin-bottom:calc(var(--container-py) / 2);}
.mt-content{margin-top:var(--container-py);}
.mt-content-sm{margin-top:calc(var(--container-py) / 2);}
*/

@media (min-width:768px){
	.pc{display:block;}
}
@media (max-width:991px){
	:root{--px:20px;}
	.container{width:100%;}
	.row-sm{margin-left:calc(var(--px) * -1); margin-right:calc(var(--px) * -1);}
	.row-sm>[class*="col"]{padding-left:var(--px); padding-right:var(--px);}
	.d-flex.row-sm{row-gap:calc(var(--px) * 2);}
}
@media (max-width:767px){
	:root{
		--py:40px;
	}
	.onContentsNavi #container{padding-top:50px;}
/* 	#wrapper{font-size:14px;} */
	#container{padding-top:50px;}
	.mobile{display:block;}
	
	.row.d-flex>[class*="col-sm"]{width:100%;}
}

/* Common
----------------------------------------------- */
p{margin-bottom:1.2em;}

/*Links*/
a{color:#007ED9;}
a:hover, a:focus{text-decoration:none; opacity:0.7;}

a.ablock,
.ablock a{display:block; text-indent:100%; white-space:nowrap; overflow:hidden; outline:0;}/* {display:block; text-indent:-9999px; outline:0;} */

.block{clear:both; margin-bottom:3em;}
.block_line{clear:both; padding-bottom:2.5em; margin-bottom:2.5em; border-bottom:1px solid #DDD;}
.block:after,
.block_line:after{display:block;height:0;visibility:hidden;clear:both;content:'';}

.fl{float:left;}
.fr{float:right;}
.r{text-align:right;}
.c{text-align:center;}
.l{text-align:left;}
img.fl{margin:0 2.5em 1.5em 0;}
img.fr{margin:0 0 2.5em 1.5em;}

@media (min-width:768px){
	.sm-r{text-align:right;}
	.sm-c{text-align:center;}
}
@media (max-width:767px){
	.xs-l{text-align:left;}
	.xs-c{text-align:center;}
	.xs-none{display:none;}
	.xs-full{margin-left:calc(var(--px) * -1); margin-right:calc(var(--px) * -1);}
}

.grid{overflow:hidden;}
.column-2 > *{float:left; width:50%;}
.column-3 > *{float:left; width:33.3333%;}
.column-4 > *{float:left; width:25%;}
.column{float:left;}
.column-r{float:right;}
.column-new{clear:both;}
.grid:after{display:block;height:0;visibility:hidden;clear:both;content:'';}

.column-def > *{box-sizing:border-box; padding:0 16px;}
@media (max-width:767px){/* 767px以下 */
	.column-def > *{padding:0 16px;}
}
@media (max-width:599px){/* 以下 */
	.column-def > *{float:none; width:auto; margin-bottom:3em;}
}

.box,
.boxs > *{
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

/* tableLayout */
.table-like{display:table; width:100%; table-layout:fixed;}
.table-like > * {display:table-cell; vertical-align:middle;}
.cell{display:table-cell;}
.va-top,
.va-top > *{vertical-align:top;}
.va-btm,
.va-btm > *{vertical-align:bottom;}

@media (max-width:767px){
	.table-like,
	.table-like > * {display:block;}
	.table-like-fix{display:table;}
	.table-like-fix > * {display:table-cell;}
}

.corner{
	-moz-border-radius: 5px;	/* FireFox */
	-webkit-border-radius: 5px;	/* Safari and Chrome */
	border-radius: 5px;			/* Opera 10.5+, IE */
}

ul.disc{padding-left:1em; list-style-type:disc; list-style-position:outside;}

.note{color:#666; font-size:93%;}
.hide{text-indent:100%; white-space:nowrap; overflow:hidden;}

img.full{width:100%;}

#loader{
	/* display:none; */
	width:50px;
	height:50px;
	position:absolute;
	top:500px;
	left:50%;

	margin-left:-35px;

	border:5px solid rgba(0,183,229,0.9);
	border-top:5px solid rgba(0,0,0,0);
	border-left:5px solid rgba(0,0,0,0);
	border-radius:50px;

	background-color:rgba(0,0,0,0);
	opacity:.9;

	-moz-animation:spin .8s infinite linear;
	-webkit-animation:spin .8s infinite linear;
	-o-animation:spin .8s infinite linear;
	animation:spin .8s infinite linear;
	z-index:10;
}
/* キーフレームのアニメーション */
@-moz-keyframes spin{0{-moz-transform:rotate(0)}
	100%{-moz-transform:rotate(360deg)}
}
@-webkit-keyframes spin{0{-webkit-transform:rotate(0)}
	100%{-webkit-transform:rotate(360deg)}
}
@-o-keyframes spin{0{-o-transform:rotate(0)}
	100%{-o-transform:rotate(360deg)}
}
@keyframes spin{0{transform:rotate(0)}
	100%{transform:rotate(360deg)}
}


/* Site Common
----------------------------------------------- */
.thin{max-width:960px; margin-left:auto; margin-right:auto;}
.bg-gray{background-color:#F4F4F4;}
.bg-white{background-color:white !important;}
.bg-blue-light{background-color:var(--bg-blue-light);}

.title-def{text-align:center;}
.title-def:after {
	content:"";
	display:block;
	width:40px;
	height:3px;
	background:#0077CD;
	margin: 25px auto 0;
}
.title-line{text-align:center; margin-bottom:1em;}
.title-line span{display:inline-block; padding:.5em 1.5em; border-bottom:1px solid #444;}

.title_bar{padding:20px 0; background-color:#0077CD;}
.title_bar h1{color:white;}

h4.line-tb,
.history h3,
.message_detail h4{padding:0.8em 0.3em; margin-bottom:1em; border-top:1px solid #DDD; border-bottom:1px solid #DDD;}

a.img-linkbox{
	display:block;
	position:relative;
}
a.img-linkbox span{
	display:block;
	color:white;
	text-align:center;
	font-size:24px;
	line-height:30px;
	white-space:nowrap;
	position:absolute;
}
@media (max-width:479px){
	a.img-linkbox span{
		font-size:18px;
	}
}

/* balloon */
.balloon-btns a{
	display:block;
}
.balloon-btns img{
	width:100%;
	aspect-ratio:360/260;
	object-fit:cover;
}
.balloon-btns a span{
	display:block;
	width:100%;
	padding:6% 0;
	text-align:center;
	color:white;
	background-color:rgba(var(--color-main-rgb),.9);
	position:absolute;
	bottom:0;
	left:0;
}
.balloon-btns a>span::before{
	content: '';
	display: inline-block;
	border: 13px solid transparent;
	border-bottom-color:rgba(0,119,205,0.9);
	position:absolute;
	top:-26px;
	left:50%;
	-ms-transform:translate(-50%,0);
	-webkit-transform:translate(-50%,0);
	transform:translate(-50%,0);
}
@media (max-width:767px){
	.balloon-btns a span{
		padding:4% 0;
	}
}

.head-image{
	max-width:1140px;
	margin:0 auto;
}

/* Header
----------------------------------------------- */
#header{background-color:white; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);}
.navbar-default{border:none;}
.navbar-brand{height:auto; line-height:1;}
.navbar-brand img{height:40px;}

.navbar-default
.navbar-nav>.active>a,
.navbar-default
.navbar-nav>.active>a:focus,
.navbar-default
.navbar-nav>.active>a:hover{
	background-color:transparent;
}

#navi a,
.contents_navi a{font-size:15px; color:#444;}

.navbar-nav>li>a{padding:10px; margin:0 25px;}
.contents_navi ul{list-style-type:none; padding:0;}

#navi-sub{position:relative;}
#toggle_navi{
	width:100%;
	background-color:white;
	position:absolute;
	top:0;
	left:0;
	z-index:10;
}
#toggle_navi.active{
	border:1px solid #DDD; border-width:1px 0 1px;
}
#toggle_navi>*{display:none; padding:20px 0;}

#toggle_navi ul{display:flex; justify-content:space-between;}
#toggle_navi ul::before,
#toggle_navi ul::after{content:none;}
#toggle_navi ul li{width:100%; max-width:250px;}
#toggle_navi ul a{color:#444;}
#toggle_navi ul a::before{
	content:'';
	display:block;
	width:100%;
	height:100px;
	background:no-repeat center center/cover;
}
#toggle_navi .arrow:before{color:#0077CD;}

#navi-sub li.concept a::before,
#navi li.concept{background-image:url(/jp/sobulogistics/assets/images/about/btn01.jpg);}
#navi-sub li.bases a::before,
#navi li.bases{background-image:url(/jp/sobulogistics/assets/images/about/btn02.jpg);}
#navi-sub li.effort a::before,
#navi li.effort{background-image:url(/jp/sobulogistics/assets/images/about/btn03.jpg);}
#navi-sub li.dx a::before,
#navi li.dx{background-image:url(/jp/sobulogistics/assets/images/about/btn04.jpg);}

#navi-sub li.transport a::before,
#navi li.transport{background-image:url(/jp/sobulogistics/assets/images/common/navi_biz01.jpg);}
#navi-sub li.distribution a::before,
#navi li.distribution{background-image:url(/jp/sobulogistics/assets/images/common/navi_biz02.jpg);}
#navi-sub li.warehouse a::before,
#navi li.warehouse{background-image:url(/jp/sobulogistics/assets/images/common/navi_biz03a.jpg);}

#navi-sub li.outline a::before,
#navi li.outline{background-image:url(/jp/sobulogistics/assets/images/common/navi_com01a.jpg);}
#navi-sub li.message a::before,
#navi li.message{background-image:url(/jp/sobulogistics/assets/images/common/navi_com02a.jpg);}
#navi-sub li.staff a::before,
#navi li.staff{background-image:url(/jp/sobulogistics/assets/images/common/navi_com03a.jpg);}
#navi-sub li.enkaku a::before,
#navi li.enkaku{background-image:url(/jp/sobulogistics/assets/images/common/navi_com05.jpg);}
#navi-sub li.history a::before,
#navi li.history{background-image:url(/jp/sobulogistics/assets/images/common/navi_com04.jpg);}

@media (min-width:768px){
	.navbar-nav{padding-top:15px;}

	.contents_navi{background-color:#F4F4F4; width:100%; position:fixed; top:70px; left:0; z-index:1; display:none;}
	.contents_navi ul{line-height:15px; display:table; max-width:1140px; width:100%; padding:0; margin:0 auto; table-layout:fixed;}
	.contents_navi ul li{display:table-cell; text-align:center; background:none !important;}
	.contents_navi ul li a{display:inline-block; padding:10px 30px; position:relative;}

	.child_navi_active .contents_navi{display:block;}

	#navi a:before{
		content:'';
		display:inline-block;
		width:0;
		height:3px;
		background-color:#0077CD;
		position:absolute;
		bottom:0;
		left:0;
		-webkit-transition: width 0.3s;
		transition: width 0.3s;
	}
	#navi .contents_navi a:before{
		background-color:#FFDC33;
	}
	#navi a:hover:before{
		width:100%;
	}
	#navi ul li.active>a:before{
		width:100%;
	}
}
@media (max-width:991px){
	.navbar-nav>li>a{margin:0 8px;}
}
@media (max-width:767px){
	.navbar-brand{padding:8px 8px 8px 15px;}
	.navbar-brand img{height:34px;}

	#navi{
		max-height:100vh !important;
		height:-webkit-calc(100vh - 50px);
		height:calc(100vh - 50px);
		padding:0;
	}
	#navi ul{margin:0;}
	#navi>ul>li{border-bottom:1px solid #DDD;}
	#navi>ul>li li{border-top:1px solid #EEE;}
	#navi>ul>li>a{color:#0077CD; margin:0; font-size:18px; padding:1em .5em;}
	#navi a{font-weight:600;}
	#navi a[data-target]:after{
		content: '\f107';
		font-family: FontAwesome;
		float:right;
	}

	#navi-sub{display:none;}
	.navbar-collapse>ul{padding-bottom:80px;}

	.contents_navi{background-color:black; display:none;}
	.contents_navi li{
		background-repeat:no-repeat;
		background-position:center center;
		background-size:cover;
	}
	.contents_navi a{
		display:block;
		font-size:18px !important;
		padding:1em .5em 3em;
		color:white !important;
		background-color:rgba(0,0,0,0.3);
	}
	
}

/* Footer
----------------------------------------------- */
#footer{font-size:14px; padding:30px 0; color:white;}
#footer .col-logo{width:240px;}
#footer .col-logo img.logo{width:126px;}
#footer .col-logo .tel{font-size:32px; font-weight:bold;}
.tel a{color:inherit}

#navi_footer{padding-left:40px;}
#navi_footer > *{min-width:200px; width:25%;}
#navi_footer a{color:white;}
#navi_footer ul{margin-bottom:30px;}
#navi_footer ul a{display:inline-block; padding:8px 0; color:white;}

a.arrow,
span.arrow,
#navi_footer ul a{display:inline-flex; gap:5px; align-items:center;}

a.arrow:before,
span.arrow:before,
#navi_footer ul a:before{
	content: '\f105';
	font-family: FontAwesome;
}

#footer .contents{margin-bottom:30px;}
#copyright{display:block;font-size:12px; padding:0 16px; text-align:center; opacity:0.8;}

/* 767px以下 */
@media (max-width:767px){
	#footer .col-logo{margin-bottom:30px;}
}
@media (max-width:479px){
	#navi_footer{padding-left:0;}
	#navi_footer>*{width:50%;}
}

/* index
----------------------------------------------- */
a.btn-movo{
	display:flex;
	gap:1rem 2rem;
	width:100%;
	max-width:800px;
	padding:1em;
	margin:0 auto;
	color:#0077CD;
	background-color:white;
	border:1px solid #0077CD;
	border-radius: 6px;
	align-items:center;
}
a.btn-movo::before{
	content:'';
	width:100px;
	aspect-ratio:16/10;
	background:url(/jp/sobulogistics/assets/images/movo/logo-movo.webp) no-repeat center center/80%;
}
a.btn-movo>*{flex:1;}
a.btn-movo span{display:block; position:relative; padding-right:1.5em;}
a.btn-movo span::after{
	content: '\f105';
	font-family: FontAwesome;
	font-size:1.5em;
	position:absolute;
	top:50%;
	right:0;
	transform:translateY(-50%);
}

@media (max-width:575px){
	a.btn-movo{flex-direction:column; padding:.5em .5em 1em;}
	a.btn-movo::before{width:80px;}
}


/* biz(biz/index) */
#video01{display:block;}
#biz-index{background:url(/jp/sobulogistics/assets/images/video-a.jpg) no-repeat center bottom/cover;}
#biz-index #slide-in{
	width:100%;
	position:relative;
}

#biz-index h2{
	margin-bottom:20px;
	/* text-shadow:0 0 2px white, 0 0 2px white, 0 0 2px white, 0 0 5px white; */
}

.biz-index{padding-right:30%;}
.biz-index>div{
	float:left;
	padding:20px;
}
.biz-index a{
	width:250px;
	height:250px;
	background-position:center center;
	background-repeat:no-repeat;
	background-size:cover;
}
.biz-index a span{
	top:50%;
	left:50%;
	-ms-transform:translate(-50%,-50%);
	-webkit-transform:translate(-50%,-50%);
	transform:translate(-50%,-50%);
}
.biz-index span.btn-dmy{
	border:1px solid white;
	top:auto;
	bottom:5%;
	font-size:93%;
	padding:1px 8px;
}
.biz-index-1{background-image:url(/jp/sobulogistics/assets/images/home/biz-btn01.png);}
.biz-index-2{background-image:url(/jp/sobulogistics/assets/images/home/biz-btn02.png);}
.biz-index-3{background-image:url(/jp/sobulogistics/assets/images/home/biz-btn03.png);}
.biz-index-4{background-image:url(/jp/sobulogistics/assets/images/home/biz-btn04.png);}

@media (max-width:991px){
	.biz-index a{
		width:220px;
		height:220px;
	}
}
@media (max-width:767px){
	#biz-index{background-position:58% bottom;}
	.biz-index{padding-right:0;}
}
@media (max-width:520px){
	.biz-index>div{
		float:none;
	}
	.biz-index a{
		text-align:center;
		width:100%;
		height:auto;
		padding:1.5em 0;
	}
	.biz-index a span{
		position:relative;
		top:auto;
		left:auto;
		-ms-transform:inherit;
		-webkit-transform:inherit;
		transform:inherit;
	}
	.biz-index span.btn-dmy{
		margin-top:1em;
		top:auto;
		bottom:auto;
		display:inline-block;
	}
}

.com-index a span{
	text-align:left;
	top:0;
	left:0;
	padding:20px 60px 20px 20px;
	background:url('/jp/sobulogistics/assets/images/home/com-btn-bg.png') top right no-repeat; background-size:cover;
}
.com-index span.btn-dmy{
	width:50px;
	height:50px;
	padding:0;
	background:url('/jp/sobulogistics/assets/images/common/arrow_next.png') center center no-repeat;
	background-size:15px auto;
	background-color:rgba(0,0,0,0.45);
	border:none;
	top:auto;
	left:auto;
	bottom:0;
	right:0;
}
@media (max-width:479px){
	.com-index a span{
		padding:10px 60px 10px 20px;
	}
}

/* Home
----------------------------------------------- */
/* slider-contents */
/*
.home .carousel-caption{
	padding:0;
	font-size:36px;
	text-align:left;
	top:40% !important;
	bottom:auto;
	left:12%;
	text-shadow: 0 1px 2px rgba(0,0,0,1);
	-ms-transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	transform:translate(0,-50%);
}
.home h1.carousel-caption{
	line-height:inherit;
	font-weight:normal;
}
*/

.glyphicon:before{
	content:'';
	height:36px;
	width:19px;
	position:absolute;
}
.glyphicon-chevron-left:before{
	background:url('/jp/sobulogistics/assets/images/common/arrow_prev.png') center center no-repeat;
}
.glyphicon-chevron-right{left:0;}
.glyphicon-chevron-right:before{
	background:url('/jp/sobulogistics/assets/images/common/arrow_next.png') center center no-repeat;
}
.carousel-control,
.carousel-control.left,
.carousel-control.right{
	background:none;
	opacity:1;
	width:8%;
}
.carousel-indicators li{
	background-color:white;
	border:none;
	width:36px !important;
	height:5px !important;
	margin:0 2px !important;
	border-radius:0;
}
.carousel-indicators li:hover,
.carousel-indicators .active{
	background-color:#0077CD;
}


.info_area_bnr{padding:20px;
	font-size: 140%;
	position: relative;
	display: inline-block;
	border: 1px solid #444;
	margin:0 40px 40px;
	}

/*
@media screen and (max-width:767px){
	.home .carousel-caption{font-size:30px;}
}
@media screen and (max-width:479px){
	.home h1.carousel-caption,
	.home .carousel-caption{font-size:19px; line-height:1.3;}
	.home .carousel-caption br{display:none;}
	.carousel-control{display:none !important;}
	.carousel-indicators{bottom:-10px;}
}
*/

/* info
----------------------------------------------- */
#info_list .info{margin-bottom:1em; border-bottom:1px dotted #666;}
#info_list .info .label{display:inline-block; min-width:70px; padding:0; line-height:1.6; margin-right:1em;}
#info_list .info time{display:inline-block; min-width:100px;}
#info_list .info p{line-height:1.5}

.info::after{content:''; display:block; clear:both;}
.tmb-btn-box{float:right; margin:0 0 .5rem 1rem;}
.tmb-btn-box>*{display:inline-block; max-width:120px; cursor:pointer; padding:0; border-radius:0; border:none;}
.tmb-btn-box .small{font-size:12px;}
.tmb-btn-box img{width:100%;}

.w-auto{width:auto !important;}
.gallery{display:flex;}
.gallery .cover img{max-width:100%; width:auto; max-height:82vh;}
.gallery .tmbs{display:flex; flex-direction:column; justify-content:center;}
.gallery .tmbs>*{max-width:80px; padding:0 2px; min-height:0%/* for IE11 */;}
.gallery .tmbs img{width:100%; border:2px solid white;}
.gallery .tmbs img.active{border-color:#0077CD;}
.gallery .tmbs img:hover{border-color:rgba(0,119,205,0.5);}


@media screen and (max-width:567px){
	.gallery{flex-direction:column;}
	.gallery .cover{padding-bottom:6px;}
	.gallery .tmbs{flex-direction:row;}
}

/* About
----------------------------------------------- */
/* concept */
table.kodo{margin:0 auto 1.2em;}
table.kodo th,
table.kodo td{border:1px solid #0077CD; padding:4px 10px; font-size:18px; color:#0077CD; font-weight:bold;}
table.kodo .clr{background-color:#EEE;}

/* effort */
#effort .logo-mark-area>*{
	max-width:360px;
	margin-left:auto;
	margin-right:auto;
}
@media screen and (max-width:767px){
	#effort .logo-mark-area:first-child{
		margin-bottom:30px;
	}
	#effort .logo-mark-area img{
		max-height:160px;
	}
}

/* Business
----------------------------------------------- */
.on-wrap{position:relative;}
.on{position:absolute; top:0; left:0; font-size:14px;}
.popover{z-index:10;}

/* transport 輸送ネットワーク */
#transport .on{top:30%; left:15px;}
#transport .popover{
	border-color:var(--color-main);
	box-shadow:none;

	top:10%;
	left:50%;
	-webkit-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}
.popover.top>.arrow{border-top-color:var(--color-main);}

#transport .map-popover{
	left:47%;
}
#transport .popover-content p{margin:0; text-align:center}

@media screen and (max-width:767px){
	#transport .on{position:relative; top:0; left:0;}
	#transport .popover{top:5%;}
}

/* 拠点 */
#base-map{background:url(/jp/sobulogistics/assets/images/about/map-base.svg) center center no-repeat; background-size:contain;}
@media screen and (min-width:768px){
	#base-map{max-width:600px; margin:0 auto; position:relative; left:65px;}

	#base-map li{position:absolute; width:90px; border:2px solid #0077CD; border-width:2px 0 0;}
	#base-map li .btn{position:absolute;}
	#base-map li[class*="left"] > .btn{top:0; left:0; -webkit-transform:translate(-100%,-50%); transform:translate(-100%,-50%);}
	#base-map li[class*="right"] > .btn{top:0; right:0; -webkit-transform:translate(100%,-50%); transform:translate(100%,-50%);}
	
	#base-map li.left{transform:translate(-100%,0); border-width:2px 2px 0 1px;}
	#base-map li.left-top{-webkit-transform:translate(-100%,-100%);transform:translate(-100%,-100%); border-width:2px 2px 0 0;}
	#base-map li.left-btm{-webkit-transform:translate(-100%,0);transform:translate(-100%,0); border-width:0 2px 2px 0;}
	#base-map li.left-btm > .btn{top:auto; bottom:0; -webkit-transform:translate(-100%,50%);transform:translate(-100%,50%);}
	
	#base-map li.right-top{ -webkit-transform:translateY(-100%); transform:translateY(-100%); border-width:2px 0 0 2px;}
	#base-map li.right-top > .btn{ -webkit-transform:translate(100%,-50%); transform:translate(100%,-50%);}
	#base-map li.right-btm{border-width:0 0 2px 2px;}
	#base-map li.right-btm > .btn{top:auto; bottom:0;-webkit-transform:translate(100%,50%); transform:translate(100%,50%);}

	#base-map li .btn-default{color:white; background-color:#0077CD; border:none;}	
	#base-map li:hover{opacity:0.8;}
/*
	#base-map li.rosybrown{border-color:#B58593;}
	#base-map li.rosybrown .btn-default{background-color:#B58593;}
*/
	#base-map li span{display:block;}
	#base-map li .btn{
		padding:3px 12px;
		line-height:1.7;
		text-align:left;
		font-size:13px;
		position:absolute;
		z-index:100;
	}
	#base-map li .disabled{
		opacity:0.8;
	}
	#base-map li .btn span{
		display:block;
		border-bottom:1px solid white;
	}
	
	#base-map #b01{left:481px; top:110px;}
	#base-map #b02{left:410px; top:295px;}
	#base-map #b04{left:348px; top:377px; height:127px;}
	#base-map #b05{left:356px; top:400px; height:50px;}
		#base-map #b05{left:400px; width:44px;}
	#base-map #b11{left:356px; top:400px;}
	#base-map #b14{left:356px; top:400px; height:40px;}
		#base-map #b14{left:400px; width:44px;}
	#base-map #b06{left:351px; top:410px; height:80px; width:70px;}
	#base-map #b03{left:307px; top:356px; height:80px;}
	#base-map #b13{left:210px; top:422px; height:90px; width:15px;}
	#base-map #b12{left:200px; top:413px; height:60px; width:15px;}
	#base-map #b09{left:185px; top:409px; height:50px; width:48px;}
	#base-map #b10{left:36px; top:443px; height:30px; width:20px;}
/*
	#base-map #b10{left:36px; top:443px; width:20px;}
	#base-map #b07{left:322px; top:395px; height:115px; width:74px;}
	#base-map #b08{left:319px; top:376px;}
*/
	#base-map #b15{left:11px; top:460px; width:20px;}

}
@media screen and (max-width:767px){
	#base-map{padding:40px 0;}
	#base-map img{display:none;}
	#base-map li .btn{
		display:block;
		text-align:left;
		margin-bottom:0.5em;
		background-color:rgba(255,255,255,0.5)
	}
}

/* 倉庫 */
#map-warehouse{width:100%; height:500px; margin-bottom:3em;}

.col-warehouse{width:calc(100% - 180px - 40px);}
.warehouse-list{width:180px;}
.warehouse-list ul li{margin-bottom:10px;}
.warehouse-list .btn{text-align:left;}
.warehouse-list .btn-rental{border-color:#0077CD;}
.warehouse-list .btn span.rental{float:right; color:#444; background-color:#FFDC33; font-size:90%; top:0;}

@media screen and (max-width:991px){
	.col-warehouse,
	.warehouse-list{width:100%;}
}


/* company
----------------------------------------------- */
/* outline */
.table-outline .btn{margin-left:3em;}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
	padding: 25px;
	line-height: 1.7;
	font-weight:normal;
}
@media screen and (max-width:767px){
	table.responsive-table>tbody>tr,
	table.responsive-table>tbody>tr>th,
	table.responsive-table>tbody>tr>td{display:block; border:none;}
	table.responsive-table>tbody>tr{border-top:1px solid #DDD;}
	table.responsive-table>tbody>tr>th{padding-bottom:10px;}
	table.responsive-table>tbody>tr>td{padding-top:0;}
}

/* staff */
.staff-header{position:relative;}
.staff-header .inner{
	font-size:21px;
	line-height:2.2;
	padding:100px 20px 0;
	width:100%;
	color:white;
	text-align:center;
	position:absolute;
	top:0;
	left:0;
}

/* staff */
.staff-list a{color:#444;}
.staff-list img{margin-bottom:0.5em;}
.staff-list .column{display:block; text-align:center; width:25%; padding:20px;}
.staff_detail h4{padding:.75em .3em; margin-bottom:1em; border-top:1px solid #DDD; border-bottom:1px solid #DDD; line-height:1.5;}
.staff_detail h4 .no{color:#0077CD;}

.staff_lead{margin:2em 0; text-align:center;}
.staff_names{line-height:1.5; text-align:center; margin-bottom:2em;}

@media screen and (max-width:991px){
	.staff-list .column{width:33.3333%;}
}
@media screen and (max-width:767px){
	.staff-header .inner{
		font-size:16px;
		line-height:inherit;
		padding:30px 30px 0;
	}
}
@media screen and (max-width:575px){
	.staff-header img{
		display:block;
		width:100%;
		aspect-ratio:16/9;
		object-position:bottom;
		object-fit:cover;
	}
	.staff-header .inner{
		padding:2rem var(--px) 0;
		position:relative;
		color:var(--color--black);
		text-align:left;
	}
	.staff-header .inner br{display:none;}
}
@media screen and (max-width:529px){
	.staff-list .column{width:50%;}
}

/* enkaku */
.table-enkaku th,
.table-enkaku td.r{white-space:nowrap;}
.table-enkaku tr.add-row>*{padding-top:0; border:none;}

@media screen and (max-width:767px){
	table.table-enkaku>tbody>tr>td{margin-left:80px; padding-right:0;}
	table.table-enkaku>tbody>tr>td:not(.r){padding-left:0;}
	table.table-enkaku>tbody>tr>td.r{float:left; text-align:left; width:80px; margin:0;}
	table.table-enkaku>tbody>tr.add-row{border:none;}
}


/* history */
.history-box h3{line-height:1.5;}
.history-box .text-area{max-width:500px; padding:0 30px;}
.history-box .text-area.col-left{float:right;}

.history-box .carousel-inner{
	padding-bottom:55px;
}
.history-box .carousel-indicators{
	bottom:45px;
}
.history-box .carousel-caption{
	height:3.5em;
	line-height:1.5;
	font-size:14px;
	bottom:-60px;
	padding:0;
	color: inherit;
	text-shadow:none;
}
.history-box .carousel.slide img{
	width:100%;
}

@media screen and (max-width:767px){
	.history-box .text-area{max-width:none; padding:0;}
	.history-box .text-area.col-left{float:none;}
}

/* contact
----------------------------------------------- */
#contact img{width:200px;}
#contact .tel{font-size:32px;}
#contact .tel a{color:#337ab7;}

.cover_ceo{
	position:relative;
	margin-bottom:3em;
}
.cover_ceo .inner{
	width:65%;
	text-align:center;
	position:absolute;
	top:50%;
	-ms-transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	transform:translate(0,-50%);
}
.cover_ceo h2{margin:0;}
.ceo-sign{padding:30px 0;}
.ceo-sign img{display:inline-block; padding:5px;}
@media screen and (max-width:767px){
	.cover_ceo h2{font-size:19px;}
	.ceo-sign img{max-width:160px;}
}
@media screen and (max-width:575px){
	.ceo-sign{padding:.5em 0;}
	.ceo-sign img{display:block; margin:0 auto;}
}

/* bnr
----------------------------------------------- */
a.bnr{display:block; position:relative;}
a.bnr p{margin-bottom:0;}
a.bnr h2{margin-bottom:30px;}

a.bnr-ceo .inner{
	width:60%;
	text-align:center;
	position:absolute;
	top:50%;
	-ms-transform:translate(0,-50%);
	-webkit-transform:translate(0,-50%);
	transform:translate(0,-50%);
}
a.bnr-ceo h2.title-def{color:black;}

@media screen and (max-width:767px){
	a.bnr-ceo .title-def{margin-bottom:10px;}
	a.bnr-ceo .title-def::after{margin-top:10px;}
}
@media screen and (max-width:478px){
	a.bnr-ceo .title-def{font-size:20px;}
	a.bnr-ceo .title-def::after{content:none;}
	a.bnr-ceo p{display:none;}
}

/* googlemap
----------------------------------------------- */
.map-base{width:100%; height:270px;}

/* base-box */
.base-box section{
	text-align:left;
	margin-bottom:1em;
}
.base-box h3{
	padding:6px 12px;
	color:white;
	background-color:#0077CD;
	border-radius:4px;
}

.base-box h3 span{margin-right:1em;}
.base-box .map-base{width:100%; height:270px;}

.base-box dl{line-height:1.5; text-align:left;}
.base-box dl dt{width:4em; padding-top:0.5em;}
.base-box dl dd{margin:-1.5em 0 0 0; padding:0 0 0.5em 4em; border-bottom:1px solid #DDD;}

/* modal */
.modal{
	display:flex !important;
	overflow-y:auto;
	padding:80px 15px !important;
	pointer-events:none;
}
.modal.in{
	pointer-events: auto;
}
.modal-dialog{
	margin:auto !important;
	flex-shrink: 0;
	transform:scale(1.05) !important;
	width:1000px;
	max-width:100%;
}
.modal.in .modal-dialog{
	transform: scale(1) !important;
}
.modal.fade {
	transition:opacity .3s ease;
}
.modal-content{
	border-radius:0;
	box-shadow:none;
	border:none;
}
.modal-content>*{
	padding:30px var(--px);
}
.modal .close{
	display:block;
	width:50px;
	aspect-ratio:1/1;
	padding:0;
	background-color:rgba(0,0,0,.5);
	border:2px solid white;
	border-radius:50%;
	opacity:1;
	
	font-size:0;
	line-height:1;
	white-space:nowrap;
	text-indent:100%;
	overflow:clip;

	position:fixed;
	top:30px;
	right:30px;
}
.modal .close::before,
.modal .close::after{
	content:'';
	display:block;
	width:60%;
	height:2px;
	background-color:white;
	position:absolute;
	top:50%;
	left:50%;
	z-index:1;
}
.modal .close::before{transform:translate(-50%, -50%) rotate(45deg);}
.modal .close::after{transform:translate(-50%, -50%) rotate(-45deg);}

.modal-gallery .modal-dialog{width:auto;}
.modal-typeA .modal-content{background-color:var(--bg-blue-light);}
@media (max-width:1199px){
	.modal .close{top:15px; right:15px;}
}

/* form
----------------------------------------------- */
/*
form ul.list-inline li{vertical-align:top;}
form textarea{min-height:200px;}
form .help-block{font-size:12px;}
@media (min-width: 768px){
	span.conf{
		display:inline-block;
		padding-top: 7px;
	}
}
*/

/* 2026
----------------------------------------------- */
.bold{font-weight:500;}
.mb-p{margin-bottom:1.2em;}
.mb-block{margin-bottom:3em;}
.mb-0{margin-bottom:0 !important;}
.pt-0{padding-top:0;}
.pb-0{padding-bottom:0;}
.d-flex{display:flex;}
.d-inline-block{display:inline-block;}
.row.d-flex{display:flex; flex-wrap:wrap;}
.row.d-flex::before,
.row.d-flex::after{content:none;}
.px-05{padding-left:.5em; padding-right:.5em;}
.py-2{padding-top:2em; padding-bottom:2em;}
.d-flex.gx-2{column-gap:2em;}
.d-flex.gy-2{row-gap:2em;}


.align-items-center{align-items:center;}
.justify-content-center{justify-content:center;}
.flex-cc{justify-content:center; align-items:center;}

.col-auto{flex:0 0 auto; width:auto; max-width:100%; padding-left:15px; padding-right:15px;}

.d-none{display:none;}


@media (min-width:768px){
	.d-md-block{display:block;}
	.d-md-none{display:none;}
}

.card{
	padding:1em;
	border-radius:var(--border-radius);
}

.normal{font-weight:normal;}
.c-main{color:var(--color-main);}

.label.label-md{
	display:inline-block;
	font-size:1em;
	line-height:1.4;
	text-align: center;
	padding:.75em 1em;
	background-color:var(--color-main);
	border-radius:6px;
}
p.label-md,
div.label-md{width:100%;}

/* business/dx.html */
.frame-anime img{max-width:100%;}

