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

/*==============================*/
/* COMPANY */
/*==============================*/
.companyTitle{
	position: relative;
	margin-bottom: 32px;
	font-size: 29px;
	font-weight: 600;
    font-family: 'Roboto', sans-serif; letter-spacing: 0.01em;
}
.companyTitle:before{
	position: absolute; top: 14px; left: -36px;
	content: "";
	width: 22px;
	height: 22px;
	background: url("/common/img/share/icon_title.png") no-repeat;
}
.companyTitle small{
	position: relative; top: -4px;
	margin-left: 12px;
	font-weight: 400;
	font-family: "Noto Sans Japanese"; letter-spacing: -0.01em;
	font-size: 14px;
}

    /* ======= SP =======*/
    @media (max-width: 767px) {
        .companyTitle{
            margin-bottom: 24px;
            font-size: 24px;
            text-align: center;
        }
        .companyTitle:before{
            position: absolute; top: -32px; left: 50%;
            margin-left: -11px;
        }
        .companyTitle small{
            display: block;
            margin-left: 0;
            line-height: 1.3em;
        }
    }


/*==============================*/
/* COMPANY */
/*==============================*/
.company > div > dl{
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
}
.company > div > dl > dt{
	width: 64px;
	font-size: 16px;
	font-weight: 500;
	font-family: "Noto Sans Japanese"; letter-spacing: -0.02em;
	line-height: 1.3em;
}
.company > div > dl > dd{
	width: calc(100% - 64px - 40px);
	padding: 2px 0 24px 40px;
	border-left: 1px solid #ccc;
}
.company > div > dl > dd small{ margin-left: 12px; color: #444; font-size: 14px;}
.company > div > dl:last-child > dd{ padding-bottom: 0;}
.company > div:last-child > dl > dd{ padding-bottom: 0;}

    /* ======= SP =======*/
    @media (max-width: 767px) {
        .company > div > dl{ flex-direction: column; -webkit-flex-direction: column;}
        .company > div > dl:not(:last-child){ margin-bottom: 24px;}
        .company > div > dl > dt{
            width: 100%;
            padding-bottom: 8px;
            margin-bottom: 16px;
            border-bottom: 1px solid #ccc;
            font-size: 17px;
        }
        .company > div > dl > dd{
            width: 100%;
            padding: 0;
            border-left: none;
        }
    }


/*-- アクセス
------------------------- */
.company ul.access li{
	position: relative;
	padding-left: 1em;
	text-indent: 0.1em;
}
.company ul.access li:not(:last-child){ margin-bottom: 12px;}
.company ul.access li:before {
	position: absolute; top: 0.5em; left: 0em;
	content: "";
	width: 0.5em;
	height: 0.5em;
	background: #124D5D;
}

/* 路線 */
.company ul.access li > dl{
	position: relative;
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
}
.company ul.access li > dl:before{
	position: absolute;
	content: "";
	height: 1px;
	background: #ccc;
}
.company ul.access li:nth-child(1) > dl:before{
	top: 10px; left: 164px;
	width: calc(100% - 144px - 156px - 40px);
}
.company ul.access li:nth-child(2) > dl:before{
    top: 10px; left: 148px;
    width: calc(100% - 128px - 156px - 40px);
}
.company ul.access li:nth-child(3) > dl:before{
	top: 10px; left: 90px;
	width: calc(100% - 70px - 156px - 40px);
}
.company ul.access li > dl > dt{ width: calc(100% - 160px);}
.company ul.access li > dl > dd{ width: 160px;}

/* 駅名 */
.company ul.access li > dl dd dl{
	position: relative; top: -2px;
	display: flex; display: -webkit-flex;
}
.company ul.access li > dl dd dl dt{
	margin-right: 12px;
	font-weight: 500;
	font-size: 16px;
	font-family: "Noto Sans Japanese"; letter-spacing: -0.02em;
}
.company ul.access li > dl dd dl dt small{
	position: relative; top: 0px;
	margin-left: 2px;
	font-size: 12px;
}
.company ul.access li > dl dd dl dd{ position: relative; top: -2px;}
.company ul.access li > dl dd dl dd span{
	position: relative; top: -2px;
	margin-left: 4px;
	font-family: 'Roboto', sans-serif; letter-spacing: 0.03em;
	font-weight: 600;
	font-size: 21px;
}

/* ======= SP =======*/
@media (max-width: 767px) {
    .company ul.access li:not(:last-child){ margin-bottom: 4px;}
}


/*==============================*/
/* MEMBER */
/*==============================*/
.member{
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
	margin-bottom: 40px;
}

    /* ======= TB =======*/
    @media screen and (min-width: 768px) and (max-width: 1024px) {
    }
    /* ======= SP =======*/
    @media (max-width: 767px) {
        .member{
            flex-direction: column-reverse; -webkit-flex-direction: column-reverse;
            margin-bottom: 40px;
        }
    }

/*-- 
------------------------- */
.member > p{ width: 400px;}

    /* ======= TB =======*/
    @media screen and (min-width: 768px) and (max-width: 1024px) {
        .member > p{ width: 360px;}
    }

    /* ======= SP =======*/
    @media (max-width: 767px) {
        .member > p{
            width: 100%;
            margin-bottom: 24px;
        }
    }


/*-- 
------------------------- */
.member dl{ width: calc(100% - 400px - 24px);}
.member dl dt{
	margin-bottom: 14px;
	color: #002A3B;
	font-size: 24px;
	font-weight: 500;
	font-family: "Noto Sans Japanese"; letter-spacing: -0.02em;
}
.member dl dt small{
	margin-left: 12px;
	color: #444;
	font-size: 14px;
	font-family: 'Roboto', sans-serif; letter-spacing: 0.03em;
}

    /* ======= TB =======*/
    @media screen and (min-width: 768px) and (max-width: 1024px) {
        .member dl{ width: calc(100% - 360px - 24px)}
        .member dl dt{
            margin-bottom: 14px;
            font-size: 24px;
            font-weight: 500;
        }
        .member dl dt small{
            margin-left: 12px;
            color: #444;
            font-size: 14px;
            font-family: 'Roboto', sans-serif; letter-spacing: 0.03em;
        }
    }
    /* ======= SP =======*/
    @media (max-width: 767px) {
        .member dl{ width: 100%;}
    }


/*==============================*/
/*  */
/*==============================*/
div.memberProfile{
	position: relative;
	display: flex; display: -webkit-flex;
	justify-content: space-between; -webkit-justify-content: space-between;
}
div.memberProfile:before{
	position: absolute; top: 0; left: 50%;
	content: "";
	width: 1px;
	height: 100%;
	background: #ccc;
	margin-left: -1px;
}
div.memberProfile div{ width: calc(50% - 32px); }

    /* ======= SP =======*/
    @media (max-width: 767px) {
        div.memberProfile{
            flex-direction: column; -webkit-flex-direction: column;
            padding: 28px;
            background: #EFF6F8;
        }
        div.memberProfile:before{ display: none;}
        div.memberProfile div{ width: 100%;}
        
        div.memberProfile div:not(:last-child){ margin-bottom: 16px;}
    }
