@charset "UTF-8";
/* CSS Document */

/********************************************** 
	トップページ
********************************************* */
#menu-button-area a {
	display: block;
	color: #0058a4;
	border: 2px solid #0058a4;
	text-align: center;
	padding-left: 3rem;
	padding-right: 1rem;
	white-space: nowrap;
	position: relative;
	height: 5.4rem;
	border-radius: 6px;
	font-weight: bold;
	font-size: 1.6rem;
	background: rgb(251,252,254);
	background: linear-gradient(180deg, rgba(251,252,254,1) 0%, rgba(215,215,215,1) 100%);
	margin-bottom: 1rem;
	z-index: 0;
}
#menu-button-area a.border-green {
	color: #009e94;
	border: 2px solid #009e94;
}
#menu-button-area a.border-red {
	color: #fb5357;
    border: 2px solid #fb5357;
}
#menu-button-area a::before {
	content:"";
	width:100%;
	height:100%;
	border-radius: 6px;
	position:absolute;
	z-index:-1;
	left:0;
	transition:0.25s;
	background: rgb(251,252,254);
	background: linear-gradient(180deg, rgba(251,252,254,1) 0%, rgba(215,215,215,1) 100%);
}
#menu-button-area a::after {
	content:"";
	width:100%;
	height:100%;
	border-radius: 6px;
	position:absolute;
	z-index:-2;
	left:0;
	background: linear-gradient(180deg, rgba(215,215,215,1) 0%, rgba(251,252,254,1) 100%);
}
#menu-button-area a:hover::before {
	opacity:0;
}
#menu-button-area a img.icon {
	width: 36px;
	position: absolute;
	left: .5rem;
	top: calc(50% - 18px);
}
#news-area h3 {
	margin-bottom: 1rem;
}
#news-area ul {
	margin-right: 1.5rem;
}
#news-area ul li {
	border-bottom: 1px solid #ccc;
    padding: 1.5rem 0; 
}
#news-area ul li .news-txt {
	display: block;
	line-height: 1.5;
	margin-top: 8px;
}
#news-area .news-scroll-area {
	max-height: 460px;
	overflow-y: scroll;
}
.news-scroll-area::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}
.news-scroll-area::-webkit-scrollbar-thumb {
	background-color: #6ea0cb;
	opacity: .5;
	border-radius: 5px;
}
.news-scroll-area::-webkit-scrollbar-track {
	background-color: rgb(220,220,220,.5);
	border-radius: 5px;
}
.news-scroll-area::-webkit-scrollbar-corner {
	display: none;
}
#news-area ul li span.date {
	display: inline-block;
	margin-right: .5em;
}
#news-area ul li span.cat {
	display: inline-block;
    box-sizing: border-box;
    margin-right: 8px;
    padding: 0 7px;
    border-radius: 2px;
    font-size: 1.2rem;
    line-height: 20px;
    background: #999;
    color: #fff;
}

#news-area ul li span.cat.cat-train {
	background: #4082bb;
}
#news-area ul li span.cat.cat-ticket {
	background: #f6b37f;
}
#news-area ul li span.cat.cat-pr {
	background: #fb5357;
}
#news-area ul li span.cat.cat-release {
	background: #009E94;
}
#news-area ul li span.cat.cat-report {
	background: #ffab32;
}
#news-area ul li span.cat.cat-info {
	background: #dbdbdb;
	color:#000000;
}
#news-area ul li span.cat.cat-ticket-b {
	background: #ffff00;
	color:#000000;
}
#news-area ul li span.cat.cat-guide {
	background: #3399ff;
}
#news-area ul li span.cat.cat-recruit {
	background: #6666cc;
}

#news-area ul li a {
	color: #0058a4;
}
#news-area ul li a:hover {
	color: #8cb4d6;
	text-decoration: underline;
}


.special_news {
	border: 2px solid #A8C8E5;
	border-radius: 6px;
	display: table;
	width: 100%;
}

.special_news dl{
    padding	 : 1em;
	margin: 0;
}
.special_news dl dt{
    float: left;
    padding-right	 : 2em ;
	margin: 0;
	font-weight:normal;
	display: table-cell;
}

.special_news dd  {
	margin: 0;
	display: table-cell;

}

.special_news dd a:hover {
	margin: 0;
	text-decoration: underline;

	
}
/********************************************** 
	企業情報
********************************************* */
a.settlement-btn {
	width: 100%;
    background-color: rgba(0,88,164,.1);
    position: relative;
    padding-right: 1.5rem;
    padding-left: 3.5rem;
    text-align: left;
    color: #212121;
    line-height: 1.25;
    position: relative;
    font-weight: bold;
    height: 5.4rem;
    margin-bottom: 1rem;
}
a.settlement-btn i {
    position: absolute;
    color: #4082bb;
    left: 1.5rem;
    top: calc(50% - 0.45em);
    font-size: 2rem;
}
a.settlement-btn:hover,a.settlement-btn:hover i {
	color: rgba(0,88,164,1);
	background-color: rgba(0,88,164,.045);
}
/********************************************** 
	沿革
********************************************* */
#history table.table-border th {
	white-space: nowrap;
	text-align: right;
	font-weight: normal;
	vertical-align: top;
	width: 165px;
}
#history table.table-border th.headding {
	text-align: center;
	font-weight: bold;
}
#history table.table-border th span {
	display: inline-block;
	padding-right: 1em;
}
#history table.table-border td {
	vertical-align: top;
}
/********************************************** 
	プレスリリース
********************************************* */
.press-box span.press-date {
	display: inline-block;
    padding: 0.5rem 1em;
    font-size: 1.4rem;
    color: #fff;
    background-color: #009E94;
    border-radius: 5px;
    font-weight: bold;
    line-height: 1.5;
    margin-right: 1.5em;
}
.press-box {
	padding-bottom: 1rem;
	margin-bottom: 2em;
	border-bottom: 1px solid #4082bb;
}
.press-box > a {
	padding: 1rem 0;
	font-size: 1.6rem;
}
.press-box > a span {
	display: inline-block;
}
.press-box > a span.button {
	display: inline-block;
	 padding: 0.5rem 1em;
    font-size: 1.2rem;
    color: #fff;
    background-color: #0058a4;
    border-radius: 5px;
    font-weight: bold;
    line-height: 1.5;
    margin-left: 1em;
    white-space: nowrap;
    -webkit-transition: 0.25s;
    -moz-transition: 0.25s;
    -o-transition: 0.25s;
    -ms-transition: 0.25s;
    transition: 0.25s;
}
.press-box > a span.button i {
	margin-right: .5em;
}
.press-box > a:hover span.button {
	background-color: #4082bb;
}
.press-box > a:hover .txt {
	text-decoration: underline;
}

/********************************************** 
	よくあるご質問
********************************************* */
#faq-menu a.settlement-btn {
	text-align: center;
	height: 6rem;
	line-height: 1.45;
}
.faq-wrap h3.border2 {
	margin-bottom: 3rem;
}
.faq-block {
	margin-bottom: 5rem;
}
.faq-block .faq-a {
	position: relative;
	font-size: 1.2em;
	font-weight: bold;
	padding: 8px 8px 8px 5.6rem;
	margin-bottom: 2.4rem;
	background: rgb(220,220,220,.4);
}
.faq-block .faq-a::before {
	content: 'Q';
    background-color: #00a3d9;
    width: 3.6rem;
    font-size: 2.2rem;
    line-height: 3.3rem;
    display: inline-block;
    position: absolute;
    top: 8px;
    left: 8px;
    border-radius: 8px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    padding-bottom: 3px;
}
.faq-block .faq-q {
	position: relative;
	padding-left: 5.6rem;
	padding-top: 5px;
}
.faq-block .faq-q::before {
	content: 'A';
    background-color: #fb5357;
    width: 3.6rem;
    font-size: 2.2rem;
    line-height: 3.3rem;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 8px;
    border-radius: 8px;
    font-weight: bold;
    text-align: center;
    color: #fff;
    padding-bottom: 3px;
}



/********************************************** 
	採用情報
********************************************* */
#recruit01 h3 {
	color: #fff;
	background: #22ac38;
	padding: 1em 1em 1em 6.5rem;
	position: relative;
	margin-bottom: 1rem;
}
#recruit01 h3::before {
	content: "";
	display: block;
	width: 4rem;
	height: 4rem;
	background: url(../images/common/icon_recruit_search.png) center center/cover no-repeat;
	position: absolute;
	left: 12px;
	top: calc(50% - 2rem);
}
#recruit01 h3.orange {
	background: #ec6941;
}
#recruit01 h3.blue {
	background: #0070C0;
}
#recruit01 a.button {
	width: 100%;
	border-radius: 6px;
	background: #528ec1;
	position: relative;
	padding-right: 5rem;
	padding-left: 3rem;
}
#recruit01 a.button:hover {
	background: #0058a4;
}
#recruit01 a.button.button-red {
	background: #fb5357;
}
#recruit01 a.button.button-red:hover {
	background: #d85257;
}
#recruit01 a.button img.icon {
    width: 36px;
    position: absolute;
    right: 1rem;
    top: calc(50% - 18px);
}
.p-1em {
	padding: 1em;
}
#recruit02 h3.circle-icon {
	color: #0058a4;
	margin-bottom: 1em;
}
#recruit02 h3.circle-icon img {
	display: inline-block;
	margin-right: 1rem;
}
/********************************************** 
	個人情報の取扱いに関する方針
********************************************* */
ul.num-list li {
	padding-left: 2em;
    text-indent: -1.75em;
}
ul.num-list li span.num {
	margin-right: 5px;
}
ul.num-list ul.style li {
	text-indent: 0;
	padding-left: 0;
}
/********************************************** 
	リンク集
********************************************* */
.link-sec .col-lg-4 {
	padding-left: 2em;
}
.link-sec a {
	display: inline-block;
	padding-left: 1.5em;
    text-indent: -.75em;
}
.link-sec a i {
    color: rgba(0,88,164,.3);
}
/********************************************** 
	運賃
********************************************* */
/* 駅リスト */
table.station-list {
	width: 100%;
}
table.station-list tr {
	background: rgba(0,88,164,.045);
	overflow: hidden;
}
table.station-list tr:nth-child(odd) {
	background-color: rgba(0,88,164,.1);
}
table.station-list th {
	padding: .6rem 1rem ;
	vertical-align: middle;
	overflow: hidden;
}
table.station-list th span.num {
	display: inline-block;
	position: relative;
	margin-right: 2rem;
	margin-left: 1rem;
	z-index: 2;
}
table.station-list th span.num img {
	position: relative;
	z-index: 3;
}
table.station-list tr:not(:first-child) th span.num::before {
	content: "";
	display: block;
	width: 8px;
	height: 20px;
	background-color: #0058a4;
	position: absolute;
	left: calc(50% - 4px);
	top: -.8rem;
	z-index: 0;
}
table.station-list tr:not(:last-child) th span.num::after {
	content: "";
	display: block;
	width: 8px;
	height: 20px;
	background-color: #0058a4;
	position: absolute;
	left: calc(50% - 4px);
	bottom: -.8rem;
	z-index: 0;
}
table.station-list th a {
	display: inline-block;
	font-size: 1.6rem;
	padding-right: 4rem;
}
table.station-list th a i {
	margin-right: 1rem;
}
table.station-list td.icon {
	padding: .6rem;
	text-align: center;
	vertical-align: middle;
	width: 4.2rem;
}
table.station-list td.icon img {
	width: 28px;
}
table.station-list td.icon:last-child {
	width: 6.2rem;
	padding-right: 2rem;
}
/********************************************** 
	各駅のご案内
********************************************* */
#station-title {
	margin-top: 3rem;
	margin-bottom: 3rem;
	background: #0058a4;
	padding: 2rem 2rem 0;
	color: #fff;
}
.station-title-top {
	border-bottom: 2px solid #fff;
}
.station-title-top h2 {
	font-size: 3.2rem;
}
.station-title-top p {
	font-size: 1.8rem;
	font-weight: bold;
}
.station-title-top p span {
	display: inline-block;
	position: relative;
	padding: 0 .5rem;
}
.station-title-bottom a {
	color: #fff;
}
.station-title-bottom {
	padding: 1.2rem 0;
	font-size: 2rem;
}
.station-title-bottom span.station-num {
	display: inline-block;
	width: 36px;
	height: 36px;
	line-height: 36px;
	text-align: center;
	border-radius: 50%;
	background: #fff;
	color: #0058a4;
	font-weight: bold;
}
.station-title-bottom a i {
	padding: 0 .5em;
}
#station-title .station-title-bottom a:hover {
	opacity: .7;
}

.store-button a.btn {
	width: 100%;
	background: #FF0000;
	color: #fff;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.5;
	margin-bottom: 1rem;
	padding: 1em;
}
.store-button a.btn:hover {
	opacity: .7;
}
/* 運賃下層ページ */
table.table-price {
	min-width: 100%;
	font-size: 1.6rem;
	white-space: nowrap;
}
table.table-price th {
	text-align: center;
	color: #fff;
	background: #4082bb;
	padding: .5em;
}
table.table-price th:not(:first-child) {
	border-left: 1px solid #fff;
}
table.table-price td {
	border: 1px solid rgba(0,88,164,.2);
	text-align: center;
	padding: .5em;
}
table.table-price td:first-child {
	font-size: 1.7rem;
	font-weight: bold;
	text-align: left;
	padding-left: 1em;
}
table.table-price td:first-child img {
	display: inline-block;
	margin-right: 1rem;
}
table.table-price tr.current {
	background: rgba(0,88,164,.3);
}
.border-green {
	padding: .5em 1em;
	border: 2px solid #22ac38;
}

.border-red {
	padding: .5em 1em;
	border: 2px solid #FF0000;
}
.link_100 a{
display: block;
}

/********************************************** 
	時刻表
********************************************* */
.timetable-info {
	border: 4px solid #4082bb;
	border-radius: 6px 6px 0 0;
}
.timetable-info h3 {
	color: #fff;
	padding: .65em 1em .75em;
	background: #4082bb;
}
.timetable-info ul {
	padding: 1em 1.5em;
	margin: 0;
}
.timetable-info ul li a {
	display: inline-block;
	position: relative;
	padding-left: 1em;
}
.timetable-info ul a i {
	position: absolute;
	color: rgba(0,88,164,.3);
    left: 0;
    top: calc(50% - 0.55em);
}

/********************************************** 
	おトクなきっぷ
********************************************* */
/* blue */
.ticket-button a.btn {
	width: 100%;
	background: #3578C3;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button a.btn:hover {
	opacity: .7;
}

.ticket-button > div:last-child a.btn {
	background: #E076D7;
	color: #ffffff;
} 

/* red */
.ticket-button2 a.btn {
	width: 100%;
	background: #C0504D;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button2 a.btn:hover {
	opacity: .7;
}
.ticket-button2 > div:last-child a.btn {
	background: #C0504D;
	color: #fff;
} 

/* blue */
.ticket-button3 a.btn {
	width: 100%;
	background: #3578C3;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button3 a.btn:hover {
	opacity: .7;
}

/* brown */
.ticket-button4 a.btn {
	width: 100%;
	background: #984807;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button4 a.btn:hover {
	opacity: .7;
}

/* 明るいblue */
.ticket-button5 a.btn {
	width: 100%;
	background: #0099FF;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button5 a.btn:hover {
	opacity: .7;
}


/* green */
.ticket-button6 a.btn {
	width: 100%;
	background: #9BBB59;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button6 a.btn:hover {
	opacity: .7;
}

/* blue */
.ticket-button7 a.btn {
	width: 100%;
	background: #3578C3;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button7 a.btn:hover {
	opacity: .7;
}

/*orange */
.ticket-button8 a.btn {
	width: 100%;
	background: #E26B0A;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.ticket-button8 a.btn:hover {
	opacity: .7;
}


/********************************************** 
	新着情報
********************************************* */
.info-button a.btn {
	width: 100%;
	background: #FF9900;
	color: #fff;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.info-button a.btn:hover {
	opacity: .7;
}

.info-button_g a.btn {
	width: 100%;
	background: #009900;
	color: #fff;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.info-button_g a.btn:hover {
	opacity: .7;
}

.info-button_y a.btn {
	width: 100%;
	background: #FFC000;
	color: #fff;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.info-button_y a.btn:hover {
	opacity: .7;
}


/* blue */
.timetable-button a.btn {
	width: 100%;
	background: #3578C3;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button a.btn:hover {
	opacity: .7;
}

/* red */
.timetable-button2 a.btn {
	width: 100%;
	background: #C0504D;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button2 a.btn:hover {
	opacity: .7;
}

/* orange */
.timetable-button3 a.btn {
	width: 100%;
	background: #E26B0A;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button3 a.btn:hover {
	opacity: .7;
}

/* orange */
.timetable-button6 a.btn {
	width: 100%;
	background: #E26B0A;
	color: #fff;
	height: 8rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button6 a.btn:hover {
	opacity: .7;
}

/* green */
.timetable-button4 a.btn {
	width: 100%;
	background: #92D050;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button4 a.btn:hover {
	opacity: .7;
}

/* やまぶきyellow */
.timetable-button5 a.btn {
	width: 100%;
	background: #FFC000;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button5 a.btn:hover {
	opacity: .7;
}

/* green */
.timetable-button6 a.btn {
	width: 100%;
	background: #92D050;
	color: #000;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button6 a.btn:hover {
	opacity: .7;
}

/* pink */
.timetable-button7 a.btn {
	width: 100%;
	background: #FF66CC;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button7 a.btn:hover {
	opacity: .7;
}

/* perple */
.timetable-button8 a.btn {
	width: 100%;
	background: #990099;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button8 a.btn:hover {
	opacity: .7;
}

/* 明るいblue */
.timetable-button9 a.btn {
	width: 100%;
	background: #0099FF;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button9 a.btn:hover {
	opacity: .7;
}
/* 濃いめgreen */
.timetable-button10 a.btn {
	width: 100%;
	background: #00B050;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button10 a.btn:hover {
	opacity: .7;
}
/* 濃いめred */
.timetable-button11 a.btn {
	width: 100%;
	background: #C00000;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button11 a.btn:hover {
	opacity: .7;
}
/* yellow */
.timetable-button12 a.btn {
	width: 100%;
	background: #FFFF00;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button12 a.btn:hover {
	opacity: .7;
}

/* yellow */
.timetable-button13 a.btn {
	width: 100%;
	background: #00B050;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button13 a.btn:hover {
	opacity: .7;
}

/* brown */
.timetable-button14 a.btn {
	width: 100%;
	background: #C0504D;
	color: #fff;
	height: 5rem;
	border-radius: 6px;
	text-align: center;
	font-weight: bold;
	line-height: 1.5;
	font-size: 1.6rem;
	margin-bottom: 1rem;
	padding: 1em;
}
.timetable-button14 a.btn:hover {
	opacity: .7;
}


/********************************************** 
	駐車場
********************************************* */
.parking-map .gmap {
	margin-bottom: 2rem;
}
.parking-map h4.bg {
	font-size: 1.1em;
	background: rgba(0,88,164,.045);
	border: 1px solid rgba(0,88,164,.2);
}
/********************************************** 
	フォトギャラリー
********************************************* */
.photo-box {
    margin-bottom: 2rem;
    position: relative;
    width: 100%;
    overflow: hidden;
    text-align: center;
}
.photo-box::before {
    content: "";
    display: block;
    padding-top: 72%;
}
.photo-box a {
	 display: block;
	position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #f1f1f1;
}
.photo-box a:hover {
	opacity: .7;
}
.photo-box img {
    object-fit: cover;
    height: 100%;
}

/********************************************** 
	お問い合わせ
********************************************* */
#contact01 .border-red {
	border: 2px solid #fb5357;
	padding: 1rem 1.5em 1.5em;
}
#contact01 .border-red h4 {
	color: #fb5357;
	border-bottom: 1px dotted #fb5357;
	padding: .5rem 0;
	margin-bottom: 1em;
}
#contact01 .border-red ul {
	margin-bottom: 0;
}
#contact01 .border-red ul li:not(:last-child) {
	margin-bottom: 1rem;
}
/* 忘れ物 */
.table-contact table.table-simple th,.table-contact table.table-simple td {
	border: none;
	padding: 0;
}
.table-contact table.table-simple span.spacer {
	display: inline-block;
	width: 1em;
}
/********************************************** 
	フォーム
********************************************* */
.table-blue.table-contact {
	margin-bottom: 2rem;
}
.table-blue.table-contact th,.table-blue.table-contact td {
	padding: 1em;
	vertical-align: middle;
}
.table-contact input[type="text"], .table-contact input[type="email"], .table-contact input[type="tel"], .table-contact textarea {
    width: 60%;
    border: 1px solid #ccc;
    padding: 4px 8px;
}
.table-contact select {
	border: 1px solid #ccc;
    padding: 4px 8px;
}
.table-contact input.long, .table-contact textarea {
	width: 100%;
}
.table-contact input.short {
	width: 140px;
}
.table-contact input.x-short {
	width: 80px;
}
input[type=submit], input[type=reset], input[type="button"] {
    border: none;
    width: 240px;
    transition: all 0.3s ease;
    background-color: #4082bb;
    font-weight: bold;
    color: #fff;
    padding: 10px;
    margin: 0 2px 10px;
    border-radius: 400px;
    font-weight: bold;
}
input[type=submit]:hover, input[type=reset]:hover {
	background-color: #0058a4;
}
.confirm input[type="button"] {
	background-color: rgba(0,88,164,.1);
	color: #0058a4;
}
.confirm input[type="button"]:hover {
	color: #fff;
	background-color: #4082bb;
}
.table-contact span.label {
	display: inline-block;
	padding-right: .5em;
}
/********************************************** 
	TOICA
********************************************* */
table.table-pattern {
	width: 100%;
	text-align: center;
	vertical-align: middle;
}
table.table-pattern td {
	padding: 1em;
}
table.table-pattern td.aikan {
	color: #fff;
	background: rgba(0,88,164,1);
	font-weight: bold;
	font-size: 1.2em;
	padding: .75em 1em;
}
table.table-pattern td.jr {
	color: #fff;
	background: #ffab32;
	font-weight: bold;
	font-size: 1.2em;
	padding: .75em 1em;
}

/********************************************** 
	沿線観光・イベント案内
********************************************* */
.event-box {
	margin-bottom: 3rem;
}
.event-box h3 {
	text-align: center;
	color: #0058a4;
	background-color: rgba(0,88,164,.075);
	padding: 1rem 1em;
	margin-bottom: 2rem;
}
.event-box .img img {
	display: inline-block;
	padding: 8px;
	border: 1px solid rgba(0,88,164,.3);
	margin-bottom: 1rem;
}
.event-box .txt {
	padding: 1em;
}

/********************************************** 
	バリアフリー設備
********************************************* */
.barrierfree-menu a.settlement-btn {
	padding-left: 4rem;
	height: 7.2rem;
}
.barrierfree-menu a.settlement-btn i {
	left: auto;
	right: 1.5rem;
}
.barrierfree-menu a.settlement-btn img {
	position: absolute;
	width: 60px;
	left: 0;
	top: calc(50% - 30px);
}
.barrierfree .img {
	background: #f1f1f1;
	padding: 1rem 0;
}
.barrierfree h2.text-center {
    font-size: 3.2rem;
    letter-spacing: .1em;
}
.barrierfree .bg-gray {
	padding: 1em;
}
/********************************************** 
	きっぷの種類とルール
********************************************* */
h4.bg-2 {
    background: #f1f1f1;
    padding: 1rem 1.5em;
    margin-bottom: 1em;
}
#teiki {
	padding-top: 60px;
    margin-top:-60px;
}
.red-border-area {
	padding: 1em;
	border: 2px solid #fb5357;
}

/********************************************** 
	駅・車内広告
********************************************* */
table.table-border.ads-table {
	text-align: center;
	line-height: 1.65;
}
table.table-border.ads-table th {
	color: #fff;
	background-color: #4082bb;
	padding: .25em .5em;
	white-space: nowrap;
}
table.table-border.ads-table td {
	padding: .25em .5em;
}
td.bg {
	color: #fff;
	position: relative;
	font-weight: bold;
	white-space: nowrap;
}
td.bg::before {
	content: "";
	display: inline-block;
	width: calc(100% - 10px);
	position: absolute;
	height: calc(100% - 10px);
	top: 5px;
	left: 5px;
	z-index: -1;
} 
.bg.pink-bg::before  {
	background: #C04187;
}
.bg.blue-bg::before  {
	background: #218BBE;
}
.bg.green-bg::before  {
	background: #6CB361;
}
.bg-gray inner {
	display: block;
	padding: 1em;
}
table.table-simple.v-middle td {
	vertical-align: middle;
}
table.table-simple td.bg {
	min-width: 90px;
	z-index: 99;
	text-align: center;
	vertical-align: middle;
	padding: .5em 1em;
}
.ads-heading {
	width: 100%;
	background: #dfebf8;
	padding: 1rem 1em;
	line-height: 1.5;
	margin-bottom: 1.5rem;
}
.ads-heading .nowrap {
	font-size: 3rem;
	color: #0081cc;
	padding-right: 2em;
}
.ads-heading .txt {
	font-size: 1.3rem;
}
.ads-heading.heading-green {
	background: #ddecde;
}
.ads-heading.heading-green .nowrap {
	color: #00873c;
}
.ads-heading.heading-green .icon {
	width: 4.2rem;
	margin-right: 1em;
}
a.button.w-100 {
	width: 100%;
	height: auto;
	padding: .5em;
}
/********************************************** 
	瀬戸市駅ビル
********************************************* */
.tenant {
	padding: 2rem 0;
}
.tenant-logo-border {
	border: 1px solid #ccc;
}
.tenant .row-1 {
	margin-bottom: 2rem;
}
.tenant-name {
	font-size: 1.8rem;
	font-weight: bold;
}
.tenant-name h4 {
	margin: 0;
}
.tenant .tenant-name span.icon {
	display: inline-block;
    padding: 0.75rem 1em;
    font-size: 1.5rem;
    color: #fff;
    background-color: #ec6941;
    border-radius: 5px;
    font-weight: bold;
    line-height: 1.5;
    margin-right: 1.5em;
    text-align: center;
    width: 170px;
}
.tenant a.button {
	margin: 1rem 1rem 0;
}
.tenant a.button i {
	right: auto;
	left: 1rem;
}
.tenant table.table-blue th {
	text-align: center;
}
#tenants h2.text-center {
    font-size: 3.2rem;
    letter-spacing: .1em;
}
#tenants h4,bg {
	font-size: 1.2em;
}
@media (max-width: 767px) {
	#tenants h2.text-center {
	    font-size: 2.4rem;
	    letter-spacing: .05em;
	    line-height: 1.35;
	}
}
#tenants table.table-blue th {
	text-align: center;
}

/********************************************** 
	ページまたぎアンカーリンク
********************************************* */
#handicapped {
	margin-top: -60px;
	padding-top: 60px;
}

@media (min-width: 768px) {
	.ws-normal {
		white-space: normal;
	}
/********************************************** 
	駐車場
********************************************* */
	.parking-map .gmap {
		padding-bottom: 40%;
	}
	
/********************************************** 
	お問い合わせ
********************************************* */
	.confirm .table-blue.table-contact th {
	    width: 300px;
	}
}
@media (max-width: 1199px) {
	
}
@media (max-width: 991px) {
/********************************************** 
	トップページ
********************************************* */


}
@media (max-width: 767px) {
/********************************************** 
	トップページ
********************************************* */
	#menu-button-area .row-10{
	    margin-left: -3px;
	    margin-right: -3px;
	}
	#menu-button-area  .row-10 > div{
	    padding-right: 3px;
	    padding-left: 3px;
	}

	#menu-button-area a {
		padding-left: 3rem;
		padding-right: 1rem;
		height: 4rem;
		font-size: 1.2rem;
		margin-bottom: .5rem;
	}
	#menu-button-area a img.icon {
		width: 20px;
		left: .4rem;
		top: calc(50% - 10px);
	}
	#menu-button-area a span img {
		width: 50px;
	}
	#news-area ul li {
	    padding: 1rem 0; 
	}
	#news-area ul li .news-txt {
		margin-top: 5px;
	}
	#news-area .news-scroll-area {
		max-height: 100%;
		height: auto !important;
		overflow-y: auto;
	}
	#news-area ul li span.cat {
	    font-size: 1.1rem;
	}
	.display-more-button {
		text-align: center;
		position: relative;
	}
	.display-more-button::before {
		content: "";
		display: block;
		width: 100%;
		height: 70px;
		position: absolute;
		top: -70px;
		left: 0;
		background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0.8) 50%, #fff 100%);
		background: linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0.8) 50%, #fff 100%);
	}
	.display-more-button.open::before {
		display: none;
	}
	.display-more-button a {
		display: inline-block;
		color: #fff;
		background-color: rgba(0,88,164,1);
		padding: .2em;
		width: 180px;
		border-radius: 4px;
	}
	.display-more-button a span {
		color: #fff;
		font-size: 1.2rem;
		font-weight: bold;
	}
/********************************************** 
	沿革
********************************************* */
#history table.table-border th {
	width: 135px;
}

/********************************************** 
	個人情報の取扱いに関する方針
********************************************* */
/********************************************** 
	採用情報
********************************************* */
	#recruit01 h3 {
		padding: .65em .65em .65em 5rem;
		position: relative;
		margin-bottom: 1rem;
	}
	#recruit01 h3::before {
		width: 3rem;
		height: 3rem;
		left: 8px;
		top: calc(50% - 1.5rem);
	}
	#recruit01 a.button {
		padding-right: 4rem;
		padding-left: 2rem;
	}
	#recruit01 a.button img.icon {
	    width: 26px;
	    top: calc(50% - 13px);
	}
	#recruit01 .p-1em {
		padding: 0;
	}
	#recruit02 .col-md-4 {
		margin-bottom: 1em;
	}
/********************************************** 
	よくあるご質問
********************************************* */
	#faq-menu a.settlement-btn {
		height: 4.6rem;
	}
	.faq-wrap h3.border2 {
		margin-bottom: 2rem;
	}
	.faq-block {
		margin-bottom: 3.6rem;
	}
	.faq-block .faq-a {
		font-size: 1.4rem;
		padding: 7px 7px 7px 4.2rem;
		margin-bottom: 1.6rem;
	}
	.faq-block .faq-a::before {
	    width: 2.7rem;
	    font-size: 1.7rem;
	    line-height: 2.7rem;
	    top: 4px;
	    left: 6px;
	}
	.faq-block .faq-q {
		padding-left: 4.2rem;
		padding-top: 0;
	}
	.faq-block .faq-q::before {
	    width: 2.7rem;
	    font-size: 1.7rem;
	    line-height: 2.7rem;
	    top: -4px;
	    left: 6px;
	}


/********************************************** 
	運賃
********************************************* */
/* 駅リスト */
	table.station-list th {
		padding: .6rem 1rem ;
	}
	table.station-list th span.num {
		margin-right: 1rem;
		margin-left: 0;
	}
	table.station-list th span.num img {
		width: 26px;
		height: 26px;
	}
	table.station-list tr:not(:first-child) th span.num::before {
		width: 6px;
		height: 20px;
		left: calc(50% - 3px);
		top: -1rem;
	}
	table.station-list tr:not(:last-child) th span.num::after {
		width: 6px;
		height: 20px;
		left: calc(50% - 3px);
		bottom: -1rem;
	}
	table.station-list th a {
		font-size: 1.4rem;
		padding-right: 2rem;
	}
	table.station-list th a i {
		margin-right: .5em;
	}
	table.station-list td.icon {
		padding: .6rem .4rem;
		width: 3rem;
	}
	table.station-list td.icon img {
		width: 20px;
	}
	table.station-list td.icon:last-child {
		width: 3.6rem;
		padding-right: 0;
		text-align: left;
	}
	.side-button-area p {
		margin-bottom: .8rem;
	}
/* 運賃下層ページ */
	table.table-price {
		font-size: 1.4rem;
		margin-bottom: 2rem;
	}
	table.table-price th {
		font-size: 1.4rem;
		padding: 0.6rem 0.4rem;
	}
	table.table-price td {
		padding: 0.6rem 0.4rem;
	}
	table.table-price td:first-child {
		font-size: 1.4rem;
		padding: 0.6rem 0.4rem;
	}
	table.table-price td:first-child img {
		width: 26px;
		height: 26px;
		margin-right: .7rem;
	}
table.table-price tr.current {
	background: rgba(0,88,164,.3);
}
/********************************************** 
	企業情報
********************************************* */
	a.settlement-btn {
	    padding-right: 1rem;
	    padding-left: 2rem;
	    height: 4.2rem;
	    margin-bottom: .6rem;
	}
	a.settlement-btn i {
	    left: .8rem;
	    font-size: 1.5rem;
	    top: calc(50% - 0.5em);
	}
/********************************************** 
	プレスリリース
********************************************* */
	.press-box span.press-date {
	    padding: 0.4rem 1em;
	    font-size: 1.2rem;
	    margin-right: 0;
	}
	.press-box {
		padding-bottom: .5rem;
		margin-bottom: 1em;
	}
	.press-box > a {
		display: block;
		padding: 1rem 0;
		font-size: 1.3rem;
	}
	.press-box > a .txt {
		margin-bottom: .5rem;
	}
	.press-box > a div:last-child {
		text-align: right;
	}
	.press-box > a span.button {
		padding: 0.4rem 1em;
	    font-size: 1.2rem;
	    margin-left: 0;
	}

/********************************************** 
	各駅のご案内
********************************************* */
	#station-title {
		margin-top: 1rem;
		margin-bottom: 2rem;
		    padding: 1rem 1rem 0;
	}
	.station-title-top h2 {
		font-size: 2.4rem;
	}
	.station-title-top p {
		font-size: 1.4rem;
	}
	.station-title-bottom {
		font-size: 1.4rem;
	}
	.station-title-bottom span.station-num {
		width: 24px;
		height: 24px;
		line-height: 24px;
		font-size: 1.3rem;
	}
/********************************************** 
	時刻表
********************************************* */
	.timetable-info h3 {
		padding: .5em 1em .65em;
	}
	.timetable-info ul {
		padding: 1rem;
		margin: 0;
	}
	.timetable-info ul li {
		margin-bottom: .5rem;
	}
	.timetable-info ul li a {
		padding-left: .75em;
	}
/********************************************** 
	おトクなきっぷ
********************************************* */
	.ticket-button a.btn {
		height: 7rem;
		font-size: 1.4rem;
	}
/********************************************** 
	フォトギャラリー
********************************************* */
	.photo-box {
	    margin-bottom: 1rem;
	}
	.row-20.gallery {
	    margin-left: -5px;
	    margin-right: -5px;
	}
	.row-20.gallery  > div{
	    padding-right: 5px;
	    padding-left: 5px;
	}	
/********************************************** 
	お問い合わせ
********************************************* */
	#contact01 .border-red {
		border: 2px solid #fb5357;
		padding: 1rem 1.5rem 1rem;
	}
	#contact01 .border-red h4 {
		padding: 0;
	}
	#contact01 .border-red ul li:not(:last-child) {
		margin-bottom: .6rem;
	}
/********************************************** 
	フォーム
********************************************* */
	.table-blue.table-contact {
		margin-bottom: 1rem;
		border-top: 1px solid rgba(0,88,164,.2);
	}
	.table-blue.table-contact th {
		display: block;
		width: 100%;
		padding: .75em;
		border-top: none;
	}
	.table-blue.table-contact td {
		display: block;
		width: 100%;
		padding: .75em;
		border-top: none;
	}
	.table-contact input[type="text"], .table-contact input[type="email"], .table-contact input[type="tel"], .table-contact textarea {
	    width: 100%;
	}
	.table-contact input.short {
	    width: 120px !important;
	}
	.table-contact input.x-short {
	    width: 60px !important;
	}
/********************************************** 
	沿線観光・イベント案内
********************************************* */
	.event-box {
		margin-bottom: 2rem;
	}
	.event-box h3 {
		margin-bottom: 1rem;
	}
	.event-box .img img {
		max-width: 280px;
		padding: 5px;
		margin-bottom: 0;
	}
	.event-box .txt {
		padding: 0;
	}
/********************************************** 
	バリアフリー設備
********************************************* */
	.barrierfree-menu a.settlement-btn {
		padding-left: 4rem;
		height: 6rem;
	}
	.barrierfree-menu a.settlement-btn i {
		right: 1rem;
	}
	.barrierfree-menu a.settlement-btn img {
		width: 40px;
		top: calc(50% - 20px);
	}
	.barrierfree h2.text-center {
	    font-size: 2.4rem;
	    letter-spacing: .05em;
	    line-height: 1.35;
	}
/********************************************** 
	駅・車内広告
********************************************* */
	.ads-heading {
		padding: .5rem 1rem;
		margin-bottom: 1rem;
	}
	.ads-heading .nowrap {
		font-size: 1.8rem;
		padding: 0;
		white-space: normal;
	}
	.ads-heading .txt {
		font-size: 1.2rem;
		padding-top: .5rem;
	}
	.ads-heading.heading-green .nowrap {
		color: #00873c;
	}
	.ads-heading.heading-green .icon {
		width: 3rem;
		margin-right: 1rem;
	}
	a.button.w-100 {
		line-height: 1.35;
	}
/********************************************** 
	瀬戸市駅ビル
********************************************* */
	.tenant .row-1 {
		margin-bottom: 1rem;
	}
	.tenant-logo {
		margin-bottom: .8rem;
	}
	.tenant-name {
		font-size: 1.6rem;
		text-align: center;
	}
	.tenant .tenant-name span.icon {
	    padding: 0.5rem 1em;
	    font-size: 1.5rem;
	    margin-right: 0;
	    text-align: center;
	    width: 100%;
	    margin-bottom: 5px;
	}
	.tenant a.button {
		margin: .5rem .5rem 0;
		width: 165px;
	}



}
@media (max-width: 575px) {
}