@charset "UTF-8";

/*****************************************
 共通
******************************************/

/****** ■max-width:1200px■ ******/
@media screen and (max-width:1200px){
	main {
		width: auto !important;
	}

	#bread {
		width: auto;
	}
	
/*** top(index.php) ***/
	#top_header .top.schedule {
		width: 100%;
	}
	.top_menu .nav_menu li {
		margin: 0;
	}
	
/*** sitemap.php ***/
	#sitemap section {
		grid-template-columns: repeat(2, 1fr);
	}

}


/*********************
 ■ width > 1001px（min-width:1001px）
 *********************/
@media screen and (min-width:1001px){
	.none1001 {
		display: none;
	}
	
	/****** contact/cfs ******/
	#cfs .rows3 tbody td .br {
		display: none;
	}
}


/*********************
 ■ width < 1000px（max-width:1000px）
 *********************/
@media screen and (max-width:1000px){

	body {
		font-size: .95em;
	}
	.none1000 {
		display: none;
	}
	
	
	main {
		display: block;
		width: auto;
		margin: 0 5px;
	}
	main .fr {
		float: none;
		width: 100%;
		margin: 10px 0;
	}
	
	section {
		margin-top: 1em;
		margin-right: 0;
		margin-left: 0;
	}
	
	h1 {
		margin: 20px 0px 13px;
		padding: 2px;
		font-size: 1.5em
	}
	h2 {
		padding: 1px 8px;
		font-size: 1.2em;
		border-left: 2px solid #d23e3e;
	}
	
	.side_imp-exp {
		grid-column: span 2;
	
	}
	
	.scrolltable {
		overflow: scroll;
		width: auto;
		max-height: 500px;
		/*-webkit-overflow-scrolling: touch;*/
	}

}
	
	
/*** bread ***/
@media screen and (max-width:1000px){
	#bread {
		width: 100%;
		padding: 2px;
		font-size: 0.7em;
	}
	#bread li:after {
		margin-left: 5px;
	}
}


/****** side menu ******/
@media screen and (max-width:1000px){
	/*** side ***/
	#side {
		width: 100%;
	}
	
	/*** sidebar ***/
	#sidebar {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 5px;
	}
	#sidebar li:first-of-type {
		grid-column-end: span 4;
	}
	
	/*** br ***/
	
	.none_br1000 { display: none; }

	
	/*** dl ***/
	dl.row2 {
		display: block;
		background-color: #edeef0;
	}
	dl.row2 > dt {
		padding: 1px 5px;
		box-sizing: border-box;
		line-height: 1.15rem;
	}
	dl.row2 > dt:first-of-type,
	dl.row2 > dd:first-of-type {
		border: none;
	}
	dl.row2 > dd {
		padding-bottom: 20px;
		line-height: 1.5em;
	}

/*** news アーカイブ ***/
	.side_menu .news dt {
		display: none;
	}
	.side_menu .news dd {
		display: inline-block;
		width: 60px;
		padding: 5px;
		border: 0;
	}
	
/****** top(index.php) ******/
	
	.top_menu .nav_menu {
		grid-template-columns: repeat(4, 1fr);
	}
	
	/*** top schedule-search ***/
	.top.e-services a {
		padding: 8px 10px;
		top: 10px;
		left: 20px;
		transform: translateY(0%);
		font-size: 1.0em;
	}
	#top_header .top.schedule {
		width: 100%;
		left: auto;
		transform: translateX(0%);
		top: 100px;
		right: 10px;
	}
	#top_header .top.schedule p {
		margin-top: .09em/*-.6em*/;
	}
	#top_header .top.schedule > div {
		height: 205px;
	}
	#top_header .top.schedule #searchbox {
		bottom: 0;
	}
	#searchbox > dl {
		grid-template-columns: 0.2fr 1fr;
	}
	#searchbox .searchbtn {
		margin-top: 10px;
	}
	
	.schedule-route li.ribon > div {
		top: auto;
		bottom: -3px;
		right: 0;
		left: 0;
		margin: 0 auto;
	}
	
	#top_imp-exp {
		grid-template-columns: 1fr;
		gap: 0;
	}
	#top_imp-exp,
	#imp_exp,
	#exp_notice {
		margin: 0;
	}
	#imp_exp #imp a,
	#imp_exp #exp a,
	#exp_notice li a {
		padding: .5em 0;
		font-size: 1em;
	}
	
	#news_topics ul {
		display: block;
	}
	
	/*** cy_cfs ***/
	#naccs .terminal {
		grid-template-columns: repeat(5, 1fr);
	}
	#naccs .terminal li {
		margin: 0;
	}
	
	
	/****** detail ******/
	.scrolltable table,
	#detail .scrolltable table {
		min-width: 800px;
		max-height: 500px;
		margin-bottom: 5px;
	}
	.scrolltable table thead th:first-of-type {
		position: flex;
		z-index: 4;
	}
	.scrolltable table thead th {
		position: sticky;
		top: 0;
		/*background: #fff; /* 背景色を付けて後ろの文字と重ならないようにする */
		z-index: 3;
	}
	.scrolltable table tbody th:first-of-type {
		position: sticky;
		left: 0;
		z-index: 2;
	}
	.scrolltable table tbody td {
		z-index: 1;
	}
	
	
/****** contacts/ ******/
	/*** cy ***/
	#cy #japan .rows3 {
		border: 1px solid;
	}
	#cy #japan .rows3 thead {
		display: none;
	}
	#cy #japan .rows3 tbody tr {
		display: flex;
		flex-wrap: wrap;
	}
	#cy #japan .rows3 tbody tr:last-of-type {
		border: none;
	}
	#cy #japan .rows3 tbody td {
		display: block;
		padding: 2px 2px 2px 9rem;
		text-indent: -9rem;
		box-sizing: border-box;
		border: none;
	}
	#cy #japan .rows3 tbody td:nth-of-type(4) {
		text-align: left;
	}
	#cy #japan .rows3 tbody td:nth-of-type(n+1):nth-of-type(-n+4) {
		flex: 0 0 50%;
	}
	#cy #japan .rows3 tbody td:nth-of-type(n+5):nth-of-type(-n+6) {
		flex: 0 0 100%;
	}
	#cy #japan .rows3 tbody td:before {
		content: attr(data-label);
		display: inline-block;
		width: 8.5rem;
		margin-right: .5em;
		padding-right: .5em;
		background-color: #f8fafb;
		text-align: right;
	}
	#cy #japan .rows3 tbody td:nth-of-type(2)::before,
	#cy #japan .rows3 tbody td:nth-of-type(4)::before,
	#cy #japan .rows3 tbody td:nth-of-type(5) br {
		display: none;
	}
	#cy .rows3 tbody td span {
		text-indent: 0;
	}
	#cy .rows3 tbody td span.rf {
		margin-left: 1rem;
	}
	
	#cy .row2 > dt {
		line-height: 1rem;
		padding: .3em;
		font-size: .8rem;
	}
	
	
	/*** cfs ***/
	#cfs .rows3 tbody td .fax {
		margin-left: 0;
	}
	
	
	/*** dr_acl ***/
	#dr_acl .row2 {
		margin-bottom: 1rem;
		border-top: 1px solid;
	}
	#dr_acl .row2 > dt br {
		display: none;
	}
	
	/*** custmer ***/
	#customer .row2 > dt br {
		display: none;
	}
	#customer .row2 > dt span {
		margin-left: 1rem;
	}
	
	
	/*** bl_sur ****/
	#bl_sur dt br {
		display: none;
	}
	
	
/****** about/ ******/
	dl.office {
		background-color: transparent;
	}
	dl.office dt {
		color: navy;
		font-weight: 500;
	}
	dl.office dd {
		background-color: #fff;
	}
}


/*********************
 ■ width > 800px
 *********************/
@media screen and (min-width:800px){}


/*********************
 ■ width < 800px
 *********************/
@media screen and (max-width:800px){
	/****** table ******/
	/****** row3 ******/
	.rows3 thead tr,
	.rows3 tbody,
	.rows3 tbody tr {
		/*display: block;
		display: flex;
		flex-wrap: wrap;*/
		width: 100%;
	}
	.rows3 thead tr th,
	.rows3 tbody tr th,
	.rows3 tbody tr td {
		padding: .3em .8em;
		font-size: 0.95em;
		line-height: 1.4em;
	}
	.rows3.flex thead tr,
	.rows3.flex tbody,
	.rows3.flex tbody tr {
		display: flex;
		flex-wrap: wrap;
	}
	.rows3.block thead tr,
	.rows3.block tbody,
	.rows3.block tbody tr {
		display: block;
	}
	
	
	/****** contact/ ******/
	#contact {
		grid-template-columns: 1fr 1fr;
		gap: .2rem;
	}
	
	/*** nav ***/
	#nav_index ul.contact {
		grid-template-columns: repeat(2, 1fr);
	}
	
	
	
	/****** contact/cfs ******/
	#cfs .rows3 tbody td br,
	#cfs .rows3 tbody td .br {
		display: none;
	}
	#cfs .rows3 tbody td .tel,
	#cfs .rows3 tbody td .fax {
		margin-left: 1rem;
	}	
	#cfs .rows3 tbody td {
		line-height: 1.4em;
		padding: 4px 10px;
	}
	#cfs .rows3 tbody td.label::before {
		content: attr(data-label);
		display: inline-block;
		width: 5.5rem;
		margin-right: .5rem;
		background-color: #fbf0f0;
		font-size: .8rem;
		text-align: center;
	}
	
	
	/****** contact/bl_sur ******/
	#contacts .rows3 thead,
	#contacts .rows3 tbody td:first-of-type br {
		display: none;
	}
	#contacts .rows3 tbody th {
		padding: 1px;
		line-height: 1rem;
	}
	#contacts .rows3 tbody th,
	#contacts .rows3 tbody td {
		display: block;
		width: 100%;
		border-right: none;
		box-sizing: border-box;
	}
	#contacts #bl_sur .rows3 tbody th {
		padding: 1px;
	}
	#contacts #bl_sur .rows3 tbody td:first-of-type {
		width: 250px;
		margin: 0 auto;
		margin-top: 5px;
		line-height: 1em;
		background-color: #fbe9ed;
		border-radius: 50px;
		text-align: center;
	}
	#contacts #bl_sur .rows3 tbody td:nth-of-type(2) br {
		display: none;
	}
	
	
	/****** contact/dr_acl ******/
	#dr_acl .rows3 tbody td:nth-of-type(1) p {
		margin: 0;
		text-align: left;
	}
	#dr_acl .rows3 tbody td:nth-of-type(1) span {
		display: inline-block;
		margin-left: 1em;
	}
	#contacts #dr_acl .rows3 tbody td {
		position: relative;
		padding-left: 6.5em;
		border-bottom: 2px solid #fff;
	}
	#contacts #dr_acl .rows3 tbody td:last-of-type {
		margin-bottom: .5em;
	}
	#contacts #dr_acl .rows3 tbody td:before {
		position: absolute;
		display: block;
		content: attr(data-label);
		width: 6em;
		height: 100%;
		left: 0;
		background-color: #ebe6e6;
		text-align: center;
	}
	
	
	
	/****** contact/freetime ******/
	#contacts #freetime .rows3 tbody td:last-of-type {
		width: 100%;
		padding-top: 0;
	}
	
	
	/****** tracking ******/
	/*** nav ***/
	#nav_index ul.tracking {
		grid: none;
	}

}


/*********************
 ■ width < 600px
 *********************/
@media screen and (max-width:600px){

	main {
		font-size: .9em;
	}
	
	h3 {
		font-size: 1rem;
	}
	
	p {
		line-height: 1.4em;
	}
	
	.news section > ul,
	.news section > ol {
		margin-left: 1rem;
	}
	
/****** sidebar ******/
	#sidebar {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 5px;
	}
	#sidebar li:first-of-type {
		width: 100%;
		grid-column-end: span 2;
	}
	
	.side_imp-exp {
		grid-column: span 1;

	}
	
/****** top(index.php) ******/
	#top_e-services {
		top: 0;
		padding: 10px 30px;
		font-size: 1rem;
		border: 3px solid;
		box-shadow: none;
	}
	
	#top_header .top.schedule p {
		margin-top: .35em/*-.19em*/;
	}
	#searchbox .searchbtn {
		box-sizing: border-box;
	}

	
	.top_menu .nav_menu {
		grid-template-columns: repeat(2, 1fr);
	}
	
	#imp_exp {
		gap: 3em;
		margin: 1em;
	}
	
	#top #news_topics {
		font-size: .9em;
	}
	#top #news_topics .news {
		padding: 5px;
	}
	#top #news_topics .news > dt,
	#top #news_topics .news > dd,
	#top #news_topics .news > dd a {
		line-height: 1.3em;
	}
	#top #news_topics .news > dt {
		width: 75px;
	}
	#top #news_topics .news > dd {
		padding-left: 80px;
	}
	
	
/****** contact/ ******/
	/*** cy ***/
	#cy #japan .tablink {
		width: 2rem;
		height: 3.5rem;
		line-height: 1rem;
		vertical-align: bottom;
	}
	#cy #japan .rows3 tbody td:nth-of-type(5) br {
		display: block;
	}
	#cy .rows3 tbody td span.rf {
		margin-left: .5em;
	}
	
	
	/*** cfs ***/
	#contacts #cfs .rows3 tbody td br {
		display: block;
	}
	#contacts #cfs .rows3 tbody td br.br,
	#contacts #cfs .rows3 tbody td:nth-of-type(3) br {
		display: none;
	}
	#contacts #cfs .rows3 tbody td .tel {
		margin-left: 0;
	}	
	
	
/****** schedule/ ******/
	.schedule-route {
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}
	#imp_exp #imp a,
	#imp_exp #exp a {
		padding: 1.2em;
		font-size: 1.2em;
	}
	
	
/****** freetime/ ******/
	#demarage .charge-item {
		padding: 0;
	}
	
/*** sitemap.php ***/
	#sitemap section,
	#sitemap section#imp-exp {
		grid-template-columns: 1fr;
		gap: 1.5em;
	}
	#sitemap section > dl {
		font-size: .95em;
	}
	
	
/****** detail/container.php ******/
	#detail .hanger-image,
	#detail .hanger-image dl,
	#detail .hanger-image dl img {
		width: 100%;
	}

}


/****** ■width<400px■ ******/
@media screen and (max-width:400px){
	
	/****** dl ******/
	dl.small > dt {
		float: none;
		display: block;
	}
	dl.small > dd {
		margin: 0px 0px 10px 8px;
	}
	
	/****** top(index.php) ******/
	.top.dairy > ul {
		display: block;
	}
}

/****** ■max-width:400px■ ******/
@media screen and (max-width:400px){
	/****** row3 ******/
	.rows3 thead tr th,
	.rows3 tbody tr th,
	.rows3 tbody tr td {
		padding: 3px;
		font-size: 0.85em;
		line-height: 1.3em;
	}
	
	/*** tb_th1 ***/
}


/***************************************************
/* ホーム(index.php)
****************************************************/
@media screen and (max-width:1000px){
	#news_topics section {
		width: 100%;
		margin: 5px 0;
	}
}


@media screen and (max-width:600px){
	
	#top-iframe-slide {
		height: 300px;
	}
	
	#news_topics .news {
		font-size: .8rem;
	}
}


@media screen and (max-width:500px){
	#top_header,
	#top-iframe-slide {
		height: 300px;
	}
}

@media screen and (max-width:1200px){
	#pv {
		box-sizing: border-box;
	}
}

/*** index3 ***/
@media screen and (max-width:1000px){
	#top-waku {
		height: 250px;
	}
	#top_e-services {
		width: 90%;
		padding: 8px;
	}
	#pv {
	}
}

@media screen and (max-width:700px){
	#top-waku {
		display: block;
		height: auto;
	}
	#top_e-services {
		display: block;
		margin: 0 auto;
		margin-top: 2em;
	}
	#top #notice {
		grid-template-columns: 1fr;
		gap: 1em;
	}
	#pv {
		margin: 0 auto;
	}
}

@media screen and (max-width: 500px) {
    #top_header, #top-iframe-slide {
        height: 300px;
    }
}



/***************************************************
/* news/
****************************************************/

/****** ■max-width:500px■ ******/
@media screen and (max-width:500px){

/*** index.php, archive.php ***/
	#news .news dt {
		width: 80px;
	}
	#news .news dd {
		padding-left: 90px;
	}
	
/*** year ***/
	.news h2 {
		margin-bottom: 0;
		line-height: 1.4em;
	}
	.news .ki {
		margin: 20px 0;
	}
	
	.news .holiday {}
	.news .holiday tbody tr th,
	.news .holiday tbody tr td {
		padding: 3px 5px;
		font-size: 0.9em;
	}
	
	.news > section > img {
		width: 100%;
	}

}


/***************************************************
/* schedule/
****************************************************/



/***************************************************
 about/　会社概要
****************************************************/




/***************************************************
 privacy/
****************************************************/




/***************************************************
 inquiry/
****************************************************/


/***************************************************
 sitemap.php
****************************************************/
/****** ■max-width:1000px■ ******/
@media screen and (max-width:1000px){

}


/***************************************************
 footer
****************************************************/
/****** ■max-width:1200px■ ******/
@media screen and (max-width:1200px){
}
