html {
font-size: 62.5%;
}
html.no_scroll {
width: 100vw;
height: 100vh;
overflow: hidden;
}
body {
font-size: 1.4rem;
overflow-x: hidden;
color: #2b1805;
line-height: 1.75;
padding-top: 19vw;
/* font-family:"Arial","Helvetica Neue","SF Pro","ヒラギノ角ゴ Pro","游ゴシック",sans-serif;*/
}
@media (min-width: 768px) {
body {
font-size: 1.6rem;
}
}
.gold_ratio{
aspect-ratio: 1.618/1;
overflow: hidden;
}
.gold_ratio img{
width: 100%;
object-fit: cover;
height: 100%;
}
@media (min-width: 768px) {
body {
font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic","Arial"," Helvetica Neue", sans-serif;
}
}
@media (max-width: 767px) {
body {
font-family:"SF Pro","ヒラギノ角ゴ Pro",sans-serif;
}
}
@media (min-width: 500px){
body {
padding-top: 90.36px;
}
}
a, a:link {
text-decoration: none;
color: #2b1805;
}
.cont {
max-width: 1140px;
width: 100%;
margin: auto;
padding: 0 2rem;
}
a:hover{
color: #2b1805;
}
/* テキストリンクhover時 */
h1.h1-01 a,
h2.h2-normal a,
h2.h2-normal a,
h2.h2_link a,
h3.h3-01 a,
h4.h4-01 a,
h5.h5-01 a,
.text-link-right a,
.text-link-left a{
}
h1.h1-01 a:hover,
h2.h2-normal a:hover,
h2.h2-normal a:hover,
h2.h2_link a:hover,
h3.h3-01 a:hover,
h3.h3-01 a span:hover,
h4.h4-01 a:hover,
h5.h5-01 a:hover,
.text-link-right a:hover,
.text-link-left a:hover,
.text-link-left a span:hover{
text-decoration: underline #95233B;
}
/* /テキストリンクhover時 */
/* ボタンリンクhover時 */
.img-slide-3clm .slick-list .slick-track img,
.img-slide .slick-list .slick-track img,
.bnr-01_2 .slick-list .slick-track img,
.bnr-01_3 .slick-list .slick-track img,
/*div.linkbox,*/
ul.btn-small li,
ul.btn-normal li,
.bnr-img .row .col a,
a{
transition: 0.2s;
}
.img-slide-3clm .slick-list .slick-track img:hover,
.img-slide .slick-list .slick-track img:hover,
.bnr-01_2 .slick-list .slick-track img:hover,
.bnr-01_3 .slick-list .slick-track img:hover,
/*div.linkbox:hover,*/
ul.btn-small li:hover,
/* ul.btn-normal li:hover, */
.bnr-img .row .col a:hover,
a:hover{
opacity: 0.8;
}
/* /ボタンリンクhover時 */
.under_line{
text-decoration:underline;
}
legend{
position: absolute;
clip-path: inset(100%);
overflow: hidden;
height: 1px;}
.hover_textlink:hover{
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
.hover_textlink_line:hover{
opacity:1!important;
text-decoration: none !important;
border-bottom:none;
}
.img-slide-3clm.slick-initialized .slick-slide{
aspect-ratio: 1.618/1;
}
.img-slide-3clm .slick-list img{
width: 100%;
object-fit: cover;
height: 100%;
}
.letter-space4{
letter-spacing: -0.04em;
}
.popup_icon{
position: relative;
}
.popup_icon::before{
content: url(/common/img/zoom.svg);
position: absolute;
right: 5px;
top: 5px;
}
img.popup{
cursor: pointer;
}
.sp{
display: block;
}
.pc{
display: none;
}
@media (min-width: 768px){
.sp{
display: none;
}
.pc{
display: block;
}
}
img, svg {
vertical-align: middle;
}
.row>* {
padding-right: calc(var(--bs-gutter-x) * 0.5);
padding-left: calc(var(--bs-gutter-x) * 0.5);
margin-top: var(--bs-gutter-y);
}
/* list-01 */
ul.list-01 li,ol.list-01 li {
position: relative;
padding-left: 2rem;
}
ul.list-01 li::before,ol.list-01 li::before {
content: "\25CF";
position: absolute;
left: 5px;
color: #95233B;
font-family: "Arial","Helvetica Neue","SF Pro","ヒラギノ角ゴ Pro","游ゴシック";
}
/* /list-01 */
/* list-02 */
ol.list-02,ul.list-02 {
list-style: none;
counter-reset: list-02_number;
}
ol.list-02 li,ul.list-02 li {
position: relative;
padding-left: 2rem;
}
ol.list-02 li::before,ul.list-02 li::before {
counter-increment: list-02_number;
/*「test02_number」は任意の物でOK*/
content: counter(list-02_number);
color: #95233B;
left: 4px;
position: absolute;
}
/* /list-02 */
/* icon */
.arrow_right, .arrow_left,.arrow_down, .modal_icon, .pdf_icon, .blank_icon, .more_icon {
position: relative;
display: inline-block;
}
.modal_icon, .pdf_icon, .blank_icon, .more_icon{
padding-right:30px;
word-break: break-all;
}
.arrow_left:before {
display: block;
content: "";
position: absolute;
top: -7px;
bottom: 0;
left: 16px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(-45deg);
}
.arrow_left:after {
display: block;
content: "";
position: absolute;
top: 4px;
bottom: 0;
left: 16px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(135deg);
-webkit-transform: rotate(45deg);
}
.arrow_right:before {
display: block;
content: "";
position: absolute;
top: -7px;
bottom: 0;
right: 16px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.arrow_right:after {
display: block;
content: "";
position: absolute;
top: 4px;
bottom: 0;
right: 16px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(135deg);
-webkit-transform: rotate(13 5deg);
}
.arrow_down:before {
display: block;
content: "";
position: absolute;
top: -1px;
bottom: 0;
right: 17px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}
.arrow_down:after {
display: block;
content: "";
position: absolute;
top: 0px;
bottom: 0;
right: 22px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.pdf_icon::before, .pdf_icon::after {
display: block;
content: url(/common/img/bnr-04_pdf_icon.svg);
position: absolute;
right: 5px;
margin: auto;
width: auto;
height: auto;
top: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
}
.modal_icon::before, .modal_icon::after {
display: block;
content: url(/common/img/modal_icon.svg);
position: absolute;
right: 5px;
margin: auto;
width: auto;
height: auto;
top: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
}
.blank_icon::before, .blank_icon::after {
display: block;
content: url(/common/img/blank_icon.svg);
position: absolute;
right: 5px;
margin: auto;
width: auto;
height: auto;
top: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%) translateX(-50%);
}
.long_text.modal_icon, .long_text.pdf_icon, .long_text.blank_icon, .long_text.more_icon{
padding-right: 20px;
}
.long_text.modal_icon::before, .long_text.modal_icon::after,
.long_text.pdf_icon::before, .long_text.pdf_icon::after,
.long_text.blank_icon::before, .long_text.blank_icon::after,
.long_text.more_icon::before, .long_text.more_icon::after
{
right: -5px;
}
.more_icon::before {
display: block;
content: "";
position: absolute;
top: 50%;
right: 15px;
width: 14px;
height: 2px;
background-color: #95233b;
transition: 0.2s;
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transition: all 0.5s;
}
.more_icon::after {
display: block;
content: "";
position: absolute;
top: 50%;
right: 15px;
width: 14px;
height: 2px;
background-color: #95233b;
transition: 0.2s;
}
/* /icon */
#main {
font-size: 1.4rem;
}
@media (min-width: 768px) {
#main {
font-size: 1.6rem;
}
}
.fade {
opacity: 1;
}
.common_styles ul li, .common_styles ol li {
background: no-repeat;
line-height: 1.6;
margin: auto;
padding: auto;
list-style: none;
color: #2b1805;
}
.linkbox img {
border-radius: 0;
}
* {
box-sizing: border-box;
}
a:hover {
text-decoration: none;
}
.common_styles a {
color: #2b1805;
}
.common_styles a:hover {
color: #2b1805;
}
p.news_icon {
border: solid 1px #95233b;
color: #95233b;
border-radius: 100px;
font-size: 1.2rem;
display: inline-block;
padding: 0.2rem 1.2rem;
}
/* main SP */
#main.main_content {
width: 100%;
margin: auto;
padding: 0 2rem;
}
.cont-720 {
max-width: 720px;
width: 100%;
margin: auto;
padding: 0 2rem;
}
.pagewidth {
max-width: 800px;
width: 100%;
margin: auto;
}
section.section_back>.cont, section.area-suggestion>.cont {
width: 100%;
margin: auto;
}
/* /main SP */
/* main PC */
@media (min-width: 768px) {
#main.main_content {
width: 100%;
max-width: 1140px;
}
section.section_back>.cont, section.area-suggestion>.cont {
max-width: 1140px;
width: 100%;
padding: 0 2rem;
}
}
/* /main PC */
/* section_back SP */
section.section_back {
position: relative;
margin: 0 calc(50% - 50vw);
overflow: hidden;
background-color: #f8f6f0;
padding: 3.2rem 0;
}
section.section_back:nth-of-type(even) {
background-color: #fff;
}
/* /section_back SP */
/* section_back PC */
@media (min-width: 768px) {
section.section_back {
padding: 6rem 0;
}
}
/* /section_back PC */
/* area-suggestion （提案エリア全量） SP */
section.area-suggestion {
position: relative;
margin: 0 calc(50% - 50vw);
overflow: hidden;
background-color: #FFFEFC;
padding: 3.2rem 0;
border-top: 1px solid #e0e0e0;
}
/* /area-suggestion （提案エリア全量） SP */
/* area-suggestion （提案エリア全量） PC */
@media (min-width: 768px) {
section.area-suggestion {
padding: 6rem 0;
}
}
/* /area-suggestion （提案エリア全量） PC */
/* slick */
/* Arrows */
.bnr-01_2 .slick-prev,.bnr-01_2 .slick-next,
.bnr-01_3 .slick-prev,.bnr-01_3 .slick-next {
top: 22%;
-webkit-transform:none;
-ms-transform: none;
transform: none;
}
.img-slide-3clm .slick-prev,
.img-slide-3clm .slick-next,
.img-slide .slick-prev,
.img-slide .slick-next{
top: calc(50% - 13px);
transform: translateY(-50%) translateX(-0%);
-webkit- transform: translateY(-50%) translateX(-0%);
}
@media (min-width: 768px) {
.bnr-01_2 .slick-prev,.bnr-01_2 .slick-next {
top: 33%;
-webkit-transform:none;
-ms-transform: none;
transform: none;
}
.bnr-01_3 .slick-prev,.bnr-01_3 .slick-next {
top: 22%;
-webkit-transform:none;
-ms-transform: none;
transform: none;
}
}
.slick-prev, .slick-next {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
transition: all 0.3s ease;
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
z-index: 2;
color: #000000;
background: #fff;
border-radius: 50%;
width: 46px;
height: 46px;
z-index: 2;
opacity: 0.85;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
outline: none;
opacity: 1;
transition: all 0.3s ease;
}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
opacity: 1;
transition: all 0.3s ease;
}
.slick-prev:before, .slick-next:before {
font-family: "slick";
font-size: 20px;
line-height: 1;
opacity: 0.85;
color: white;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
transition: all 0.3s ease;
}
.slick-prev {
left: 1%;
}
[dir="rtl"] .slick-prev {
right: 1%;
left: auto;
}
.slick-next {
right: 1%;
}
[dir="rtl"] .slick-next {
right: auto;
left: 1%;
}
/* /Arrows SP */
/* Arrows PC */
@media (min-width: 768px) {
.slick-prev {
left: 0;
}
[dir="rtl"] .slick-prev {
right: 0;
left: auto;
}
.slick-next {
right: 0;
}
[dir="rtl"] .slick-next {
right: auto;
left: 0;
}
}
@media (min-width: 1180px) {
.slick-prev {
left: calc(((100vw - 1100px) / 2) - 38px);
}
[dir="rtl"] .slick-prev {
right: calc(((100vw - 1100px) / 2) - 38px);
left: auto;
}
.slick-next {
right: calc(((100vw - 1100px) / 2) - 38px);
}
[dir="rtl"] .slick-next {
right: auto;
left: calc(((100vw - 1100px) / 2) - 38px);
}
}
/* /Arrows PC */
.slick-dots {
position: absolute;
bottom: 0px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
ul.slick-dots li {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
ul.slick-dots li:first-child:last-child {
opacity: 0;
}
.slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover, .slick-dots li button:focus {
outline: none;
}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {
opacity: 1;
}
.slick-dots li button:before {
font-family: "slick";
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: "•";
text-align: center;
opacity: 0.25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before {
opacity: 0.75;
color: black;
}
/* /Dots */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track, .slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
display: table;
content: "";
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir="rtl"] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
padding: 0 0.8rem;
background: no-repeat;
letter-spacing: 0.02em;
line-height: 1.6;
margin: auto;
list-style: none;
color: #2b1805;
}
.img-slide-3clm.slick-initialized .slick-slide,
.img-slide.slick-initialized .slick-slide{
padding: 0 2rem;
}
@media (min-width: 768px) {
.img-slide-3clm.slick-initialized .slick-slide,
.img-slide.slick-initialized .slick-slide,.slick-initialized .slick-slide {
display: block;
padding: 0 1.5rem;
background: no-repeat;
letter-spacing: 0.02em;
line-height: 1.6;
margin: auto;
list-style: none;
color: #2b1805;
}
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
/* bnr */
/* slick追加css （bnr系）SP */
.img-slide-3clm,.img-slide, .bnr-01_2, .bnr-01_3, .bnr-02 {
height: fit-content;
position: relative;
margin: 0 calc(50% - 50vw);
overflow: visible;
padding: 0rem;
display: none;
}
.img-slide-3clm.slick-initialized,.img-slide.slick-initialized, .bnr-01_2.slick-initialized, .bnr-01_3.slick-initialized, .bnr-02.slick-initialized{
display: block;
}
.img-slide-3clm .slick-list,.img-slide .slick-list,.bnr-01_2 .slick-list, .bnr-01_3 .slick-list, .bnr-02 .slick-list {
position: relative;
display: block;
overflow: visible;
margin: auto;
padding: 0;
width: 100%;
z-index: 1;
text-align: center;
color: #fff;
}
.bnr-01_2 .slick-list .slick-slide a, .bnr-01_3 .slick-list .slick-slide a {
color: #fff;
}
.bnr-01_2 .slick-list .slick-slide a p, .bnr-01_3 .slick-list .slick-slide a p{
margin-top: 2rem;
}
.bnr-01_2 .slick-list .slick-slide .inner-bg,
.bnr-01_3 .slick-list .slick-slide .inner-bg {
height: 100%;
border-radius: 10px;
background: #fff;
}
.bnr-01_2 .slick-list .slick-slide a:hover,
.bnr-01_3 .slick-list .slick-slide a:hover {
opacity: 1;
}
.bnr-01_2 .slick-list .slick-slide a:hover p,
.bnr-01_3 .slick-list .slick-slide a:hover p{
opacity: 0.8;
}
.img-slide-3clm .slick-list .slick-slide img,.img-slide .slick-list .slick-slide img, .bnr-01_2 .slick-list .slick-slide img, .bnr-01_3 .slick-list .slick-slide img {
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
border-radius: 10px;
background: #fff;
}
.img-slide-3clm.no_back li img,
.img-slide.no_back li img{
background:none;
box-shadow: none;
}
.bnr-01_2.slick-dotted, .bnr-01_3.slick-dotted {
padding-bottom: 60px;
}
.img-slide-3clm.slick-dotted,
.img-slide.slick-dotted {
padding-bottom: 40px;
}
.bnr-01_2 .slick-dots, .bnr-01_3 .slick-dots {
background: #692634;
padding: 100px 0 30px;
z-index: 0;
}
.img-slide-3clm .slick-dots,
.img-slide .slick-dots {
z-index: 0;
}
.bnr-01_2 .slick-dots li button:before, .bnr-01_3 .slick-dots li button:before {
opacity: 1;
color: white;
font-size: 10px;
content: "\3007";
}
.bnr-01_2 .slick-dots li.slick-active button:before, .bnr-01_3 .slick-dots li.slick-active button:before {
opacity: 1;
color: white;
font-size: 16px;
content: "\25CF";
}
.img-slide-3clm .slick-dots li button:before,
.img-slide .slick-dots li button:before {
opacity: 1;
color: #95233B;
font-size: 10px;
content: "\3007";
}
.img-slide-3clm .slick-dots li.slick-active button:before,
.img-slide .slick-dots li.slick-active button:before {
opacity: 1;
color: #95233B;
font-size: 16px;
content: "\25CF";
}
.img-slide-3clm.no_back .slick-dots li button:before,
.img-slide.no_back .slick-dots li button:before {
color: #fff;
}
.img-slide-3clm.no_back .slick-dots li.slick-active button:before,
.img-slide.no_back .slick-dots li.slick-active button:before {
color: #fff;
}
.bnr-02_2 img {
width: 100%;
}
.bnr-02_2 .row .col {
display: flex;
flex: 0 0 auto;
width: 50%;
margin-top: 2rem;
}
.bnr-02_2 .row .col:nth-of-type(-n+2) {
margin-top: 0;
}
.bnr-02_2 .row .col a {
width: 100%;
display: flex;
}
.bnr-02_2 .row .col a>div.linkbox {
width: 100%;
}
/* /slick追加css （bnr系）SP */
/* slick追加css （bnr系）PC */
@media (min-width: 768px) {
.img-slide-3clm .slick-list,.img-slide .slick-list,.bnr-01_2 .slick-list, .bnr-01_3 .slick-list, .bnr-02 .slick-list {
max-width: 1130px;
width: 100%;
overflow: visible;
}
.bnr-02_2 .row .col {
width: 25%;
margin-top: 2rem;
}
.bnr-02_2 .row .col:nth-of-type(-n+4) {
margin-top: 0;
}
}
/* /slick追加css （bnr系）PC */
/* bnr-02 SP */
.bnr-02 {
height: fit-content;
padding: 0;
}
.bnr-02 .slick-list {
padding: 0 20px;
}
.bnr-02.slick-initialized .slick-slide {
padding: 0;
}
.bnr-02 .slick-slide {
margin-right: 1.5rem;
}
.bnr-02 .slick-list .slick-slide a div.linkbox:hover,
.bnr-02 .slick-list .slick-slide a:hover {
opacity: 1;
}
.bnr-02 .slick-list .slick-slide a:hover div.linkbox img,
.bnr-02 .slick-list .slick-slide a:hover div.linkbox p{
opacity: 0.8;
transition: 0.2s;
}
@media (min-width: 768px) {
.bnr-02 .slick-slide {
margin: 0 1.5rem;
}
}
.bnr-02 .col {
flex: 0 0 auto;
width: 50%;
display: flex;
margin-top: 2rem;
}
.bnr-02 .col:nth-of-type(-n+2) {
margin-top: 0;
}
@media (min-width: 768px) {
.bnr-02 .col {
margin-top: 0;
}
}
.bnr-02 .col a {
display: flex;
width: 100%;
}
.bnr-02 .col a div.linkbox {
width: 100%;
}
.bnr-02 li {
margin-right: 15px;
}
/* /bnr-02 SP */
/* bnr-02 PC */
@media (min-width: 768px) {
.bnr-02 .col {
width: 25%;
flex: 0 0 auto;
}
.bnr-02 .col:nth-child(even) {
/* margin-bottom: auto; */
}
.bnr-02 .slick-list {
padding: 0px;
}
}
/* /bnr-02 PC */
/* bnr-03 SP */
.bnr-03 .col {
flex: 0 0 auto;
width: 100%;
margin-top: 2rem;
display: flex;
}
.bnr-03 .col:nth-of-type(-n+1) {
margin-top: 0;
}
.bnr-03 .col a {
display: flex;
width: 100%;
}
.bnr-03 .col a .linkbox {
width: 100%;
}
/* /bnr-03 SP */
/* bnr-03 PC */
@media (min-width: 768px) {
.row.bnr-03 .col {
flex: 0 0 auto;
width: 50%;
}
.row.bnr-03 .col>div {
border-radius: 10px;
overflow: hidden;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
}
.bnr-03 .col {
flex: 0 0 auto;
width: 50%;
}
.bnr-03 .col:nth-of-type(-n+2) {
margin-top: 0;
}
}
/* /bnr-03 PC */
/* bnr-04 SP */
.bnr-04 div.linkbox {
padding: 2rem;
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0;
display: flex;
flex-wrap: wrap;
margin-top: calc(var(--bs-gutter-y) * -1);
}
.bnr-04>.col {
flex: 0 0 auto;
width: 100%;
margin-top: 2rem;
display: flex;
}
.bnr-04>.col:nth-of-type(-n+1) {
margin-top: 0;
}
.bnr-04>.col a {
position: relative;
display: flex;
width: 100%;
}
.bnr-04.bnr-04_news .news_icon {
margin-left: 0;
}
.bnr-04>.col>a>.linkbox {
width: 100%;
}
.bnr-04>.col a.new::after {
position: absolute;
content: url(/common/img/bnr-04_new_icon.svg);
background-repeat: no-repeat;
top: 13px;
left: -4px;
}
.bnr-04.bnr-04_news .news_day, .bnr-04.bnr-04_news .bnr-04_linkbox_txt {
padding-left: 0;
padding-right: 1rem;
}
.bnr-04 .col-md-3 {
flex: 0 0 auto;
width: 40%;
display: flex;
align-items: center;
}
.bnr-04 .col-md-9 {
flex: 0 0 auto;
width: 60%;
}
@media (min-width: 768px) {
.bnr-04 .col-md-3 {
width: 25%;
}
.bnr-04 .col-md-9 {
width: 75%;
}
}
/* /bnr-04 SP */
/* bnr-04 PC */
@media (min-width: 768px) {
.bnr-04>.col {
width: 50%;
}
.bnr-04>.col:nth-of-type(-n+2) {
margin-top: 0;
}
}
/* /bnr-04 PC */
/* bnr-img */
.bnr-img img {
width: 100%;
}
.bnr-img .row .col {
display: flex;
flex: 0 0 auto;
width: 50%;
margin-top: 2rem;
}
.bnr-img .row .col:nth-of-type(-n+2) {
margin-top: 0;
}
.bnr-img .row .col div.linkbox {
width: 100%;
}
.bnr-img .row .col div {
width: 100%;
}
.bnr-img .row .col div img {
border-radius: 6px;
}
.bnr-img .row .col p {
margin-top: 1.5rem;
}
@media (min-width: 768px) {
.bnr-img .row .col {
width: 25%;
margin-top: 0;
}
}
/* /bnr-img */
/* table */
table.table-01{
width: 100%;
}
table.table-01 th {
padding: 1rem;
background: #F8F8F8;
border: solid 1px #E0E0E0;
}
table.table-01 td {
padding: 1rem;
background: #FFFFFF;
border: solid 1px #E0E0E0;
white-space: normal;
}
/* /table */
/* linkbox */
div.linkbox {
border-radius: 10px;
overflow: hidden;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
background: #FFF;
}
div.linkbox p {
font-size: 1.1rem;
padding: 1rem;
margin: 0;
color: #2b1805;
text-align: left;
}
div.linkbox p .linkbox_imgtitle {
font-size: 1.4rem;
}
@media (min-width: 768px) {
div.linkbox p {
font-size: 1.3rem;
padding: 1.6rem;
margin: 0;
color: #2b1805;
text-align: left;
}
div.linkbox p .linkbox_imgtitle {
font-size: 1.6rem;
}
}
div.linkbox p.news_icon {
border: solid 1px #95233b;
color: #95233b;
border-radius: 20px;
font-size: 1.2rem;
display: inline-block;
margin: 0 1rem 1rem;
padding: 0.2rem 1.2rem;
}
div.linkbox p.news_day {
color: #707070;
padding: 0 1rem 1rem;
}
div.linkbox p.bnr-04_linkbox_txt {
padding: 0 0 1rem 1rem;
font-size: 1.4rem;
}
@media (min-width: 768px) {
div.linkbox p.bnr-04_linkbox_txt {
padding: 0 0 1rem 1rem;
font-size: 1.6rem;
}
}
/* /linkbox */
/* /bnr */
.slider {
width: 50%;
margin: 10rem auto;
display: none;
}
.slick-track {
padding: 0 0 1rem 0;
}
.slick-track:nth-of-type(-n+2) {
padding: 0;
}
@media (min-width: 768px) {
.slick-track {
padding: 0;
}
}
.slick-slide {
margin: 0px 2rem;
}
.slick-slide img {
width: 100%;
}
.slick-prev:before {
display: block;
content: "";
position: absolute;
top: -7px;
/* right: 0; */
bottom: 0;
left: 18px;
margin: auto;
width: 8px;
height: 2px;
background-color: #707070;
transition: 0.2s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.slick-prev::after {
display: block;
content: "";
position: absolute;
top: 4px;
/* right: 0; */
bottom: 0;
left: 18px;
margin: auto;
width: 8px;
height: 2px;
background-color: #707070;
transition: 0.3s;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.slick-next:before {
display: block;
content: "";
position: absolute;
top: -7px;
/* right: 0; */
bottom: 0;
left: 18px;
margin: auto;
width: 8px;
height: 2px;
background-color: #707070;
transition: 0.2s;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.slick-next:after {
display: block;
content: "";
position: absolute;
top: 4px;
/* right: 0; */
bottom: 0;
left: 18px;
margin: auto;
width: 8px;
height: 2px;
background-color: #707070;
transition: 0.3s;
transform: rotate(135deg);
-webkit-transform: rotate(13 5deg);
}
.slick-disabled {
transition: all 0.3s ease;
opacity: 0 !important;
}
.slick-slide {
transition: all ease-in-out 0.3s;
opacity: 1;
}
.slick-active {
opacity: 1;
}
.slick-current {
opacity: 1;
}
/* /slick追加css SP*/
/* /slick SP*/
/* btn SP*/
/* btn-page SP*/
.btn-page .pagination li {
padding: 0 1rem;
margin: 0;
line-height: 2rem;
letter-spacing: 0.02em;
}
.btn-page .pagination li:last-child {
padding-right: 0px;
}
.btn-page .pagination .page-item .page-link, .btn-page .pagination .page-item:first-child .page-link {
border-radius: 6px;
}
.btn-page .page-item.active .page-link {
z-index: 2;
color: #fff;
background-color: #95233b;
border-color: #95233b;
}
.btn-page .page-link:hover {
z-index: 2;
color: #95233b;
background-color: #e9ecef;
border-color: #dee2e6;
}
.btn-page .page-link {
position: relative;
display: block;
color: #2b1805;
text-decoration: none;
background-color: #fff;
border: 1px solid #dee2e6;
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
box-shadow: 0px 1px 10px rgb(0 0 0 / 5%);
}
/* /btn-page SP*/
/* btn-small SP*/
.btn-small {
padding: 0;
}
ul.btn-small li {
list-style: none;
margin: 2rem 0 0;
padding-right: calc(var(--bs-gutter-x) * 0.5);
padding-left: calc(var(--bs-gutter-x) * 0.5);
}
ul.btn-small li:nth-of-type(-n+3) {
margin: 0;
}
ul.btn-small li a {
padding: 1rem;
text-align: center;
border-radius: 6px;
display: block;
box-shadow: 0px 1px 10px rgb(0 0 0 / 5%);
border: solid 1px #e0e0e0;
background: #fff;
}
ul.btn-small.row-cols-9>* {
flex: 0 0 auto;
width: 33.3333333333%;
}
/* /btn-small SP*/
/* btn-small PC*/
@media (min-width: 768px) {
ul.btn-small.row-cols-9>* {
width: 11.11111111111111%;
}
ul.btn-small li:nth-of-type(-n+9) {
margin: 0;
}
}
/* /btn-small PC*/
/* btn-normal SP */
ul.btn-normal li {
width: 100%;
margin: 2rem 0 0;
padding-right: calc(var(--bs-gutter-x) * .5);
padding-left: calc(var(--bs-gutter-x) * .5);
}
ul.btn-normal li:nth-of-type(-n+1) {
margin: 0;
}
ul.btn-normal li a {
border-radius: 6px;
display: block;
box-shadow: 0px 1px 10px rgb(0 0 0 / 5%);
border: solid 1px #e0e0e0;
padding: 1.5rem 1.6rem;
text-align: center;
width: 100%;
margin: auto;
background: #fff;
}
ul.btn-normal.cv li a {
color: #fff;
background: #95233b;
}
ul.btn-normal.cv li a.arrow_right::before, ul.btn-normal.cv li a.arrow_right::after {
background: #fff;
}
/* /btn-normal SP */
/* btn-normal PC */
@media (min-width: 768px) {
ul.btn-normal li {
width: 50%;
}
ul.btn-normal.row-cols-3 li {
width: 33.333333333%;
margin: 0;
}
ul.btn-normal li:nth-of-type(-n+2) {
margin: 0;
}
ul.btn-normal li a {
width: 346px;
}
ul.btn-normal.row-cols-3 li a {
width: 95%;
}
}
/* /btn-normal PC */
/* btn-detail5 SP */
ul.btn-normal.btn-detail5>* {
flex: 0 0 auto;
width: 50%;
}
ul.btn-normal.btn-detail5>*:nth-of-type(-n+2) {
margin-top: 0;
}
/* /btn-detail5 SP */
/* btn-detail5 PC */
@media (min-width: 768px) {
ul.btn-normal.btn-detail5>* {
width: 20%;
}
ul.btn-normal.btn-detail5>*:nth-of-type(-n+5) {
margin-top: 0;
}
ul.btn-normal.btn-detail5 li a {
width: 100%;
}
}
/* /btn-detail5 PC */
/* btn-before-after SP */
ul.btn-normal.btn-before-after>* {
flex: 0 0 auto;
width: 50%;
margin-top: 0;
}
/* /btn-before-after SP */
/* btn-before-after PC */
@media (min-width: 768px) {
ul.btn-normal.btn-before-after>* {
flex: 0 0 auto;
width: 50%;
}
}
/* /btn-before-after PC */
/* btn-accordion-01 SP*/
.btn-accordion-01_toggle {
display: none;
}
.btn-accordion-01 {
position: relative;
border-radius: 6px;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
background: #F8F8F8;
border: solid 1px #dddddd;
overflow: hidden;
}
.btn-accordion-01_title, .btn-accordion-01_content {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
transform: translateZ(0);
/* transition: all 0.3s; */
}
.btn-accordion-01 ul.list-01 {
background: #fff;
padding: 2rem;
}
.btn-accordion-01_title {
padding: 1.2rem 2rem;
display: flex;
align-items: center;
cursor: pointer;
font-weight: bold;
}
.btn-accordion-01_title img {
margin-right: 1rem;
}
.btn-accordion-01_title::after, .btn-accordion-01_title::before {
content: "";
position: absolute;
right: 2rem;
top: 50%;
transform: translateY(-50%);
width: 2px;
height: 0.75em;
background-color: #95233b;
transition: all 0.3s;
}
.btn-accordion-01_title::after {
transform: translateY(-50%) rotate(90deg);
}
.btn-accordion-01_content {
/* max-height: 0; */
overflow: hidden;
display: none;
}
.btn-accordion-01_content p {
margin: 0;
padding: 0.5em 1em 1em;
font-size: 0.9em;
line-height: 1.5;
}
.btn-accordion-01_content.open {
max-height: 2000px;
/* transition: all 2s; */
}
.btn-accordion-01:has(.btn-accordion-01_content.open) .btn-accordion-01_title::before {
transform: translateY(-50%) rotate(90deg);
}
/* /btn - accordion - 01 SP*/
/* btn-suggestion */
ul.btn-suggestion li{
display: inline-block;
}
ul.btn-suggestion li a{
display: inline-block;
background: #FFF;
border-radius: 6px;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
padding: 1rem;
margin: 0 1rem 1rem 0;
}
/* /btn-suggestion */
/* /btn */
/* text */
/* text-link-right */
p.text-link-right {
text-align: right;
}
li.text-link-left,p.text-link-left {
text-align: left;
}
p.text-link-right a.arrow_right, p.text-link-left a.arrow_right {
}
li.text-link-right a.arrow_right:before,p.text-link-right a.arrow_right:before,li.text-link-left a.arrow_right:before, p.text-link-left a.arrow_right:before {
top: 8px;
left: -20px;
right: auto;
bottom: auto;
}
li.text-link-right a.arrow_right:after,p.text-link-right a.arrow_right:after, li.text-link-left a.arrow_right:after, p.text-link-left a.arrow_right:after {
top: 13px;
left: -20px;
right: auto;
bottom: auto;
}
/* /text-link-right */
/* text-link-left */
p.text-link-left,li.text-link-left {
padding-left: 2rem;
}
p.text-link-left a span::before, p.text-link-left a span::after {
/* right: -30px;*/
}
/* /text-link-left */
/* text-link-under */
a.text-link-under {
color: #95233b;
text-decoration: underline;
}
a.text-link-under:hover {
text-decoration: none;
opacity:1;
}
/* /text-link-under */
/* text-01 */
p.text-01 {
font-size: 1.4rem;
line-height: 2.4rem;
}
@media (min-width: 768px) {
p.text-01 {
font-size: 1.6rem;
line-height: 2.8rem;
}
}
/* /text-01 */
/* text-color */
.text-color {
font-size: 1.4rem;
}
a.train-red,
.train-red {
color: #DD214B;
}
a.train-yellow,
.train-yellow {
color: #BE5102;
}
a.train-green,
.train-green {
color: #3B741C;
}
.train-red:hover {
color: #DD214B;
}
.train-yellow:hover {
color: #BE5102;
}
.train-green:hover {
color: #3B741C;
}
/* /text-color */
/* note-01 */
.note-01 {
font-size: 1.2rem;
line-height: 2.1rem;
}
@media (min-width: 768px) {
.note-01 {
font-size: 1.4rem;
line-height: 2.4rem;
}
}
/* /note-01 */
/* notice-01 */
.notice-01 {
background: #F8F8F8;
border-radius: 6px;
border: solid 2px #E0E0E0;
padding: 2.4rem;
}
.notice-01 .notice-01_tit {
margin-bottom: 2rem;
font-size: 1.8rem;
font-weight: bold;
}
/* /notice-01 */
/* /text */
/* img */
.img-01.img_contain img,.img-text .col-4.img_contain img{
object-fit: contain;
background: #efefef;
}
/* img - 01 */
.img-01 {
width: 100%;
aspect-ratio: 1.618/1;
/* 黄金比を維持 */
border-radius: 6px;
overflow: hidden;
}
.img-01 img {
width: 100%;
object-fit: cover;
height: 100%;
}
@media (min-width: 768px) {
.img-01 {
max-width: 800px;
}
}
/* /img - 01 */
/* img - 02 */
.img-02 {
width: 100%;
border-radius: 6px;
overflow: hidden;
}
.img-02 img {
width: 100%;
}
@media (min-width: 768px) {
.img-02 {
max-width: 800px;
}
}
/* /img - 02 */
/* img - text */
.img-text {
margin-left: 0;
margin-right: 0;
}
.img-text .col-4 {
aspect-ratio: 1.618/1;
/* 黄金比を維持 */
border-radius: 6px;
overflow: hidden;
padding: 0;
margin-bottom: 2rem;
}
.img-text .col-8 {
padding: 0;
}
.img-text.reverse .col-4 {
padding: 0;
margin:0;
}
.img-text.reverse .col-8 {
margin-bottom: 2rem;
}
.img-text .col-4, .img-text .col-8 {
width: 100%;
}
.img-text img {
width: 100%;
object-fit: cover;
height: 100%;
}
@media (min-width: 768px) {
.img-text .col-4 {
width: 33.33333333%;
padding: 0;
margin-bottom: auto;
}
.img-text .col-8 {
width: 66.66666667%;
padding-left:2rem;
}
.img-text.reverse .col-4 {
width: 33.33333333%;
padding: 0;
margin-bottom: auto;
}
.img-text.reverse .col-8 {
width: 66.66666667%;
padding-right: 2rem;
padding-left: 0;
}
}
/* /img - text */
/* /img */
/* anchor - 01 SP */
.anchor {
background: #f8f8f8;
padding: 2rem 2rem 1rem 2rem;
font-size: 1.4rem;
line-height: 2.1rem;
}
.anchor a {
margin-right: 4rem;
display: inline-block;
}
.anchor a:hover {
text-decoration: underline #95233B;
}
.anchor a .anchor_arrow_icon{
position: relative;
}
.anchor li{
display: inline-block;
list-style: none;
margin-bottom:1rem;
}
.anchor a .anchor_arrow_icon::before{
display: inline-block;
content: "";
position: absolute;
top: 9px;
bottom: 0;
right: -11px;
/* margin: auto; */
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.anchor a .anchor_arrow_icon::after {
display: inline-block;
content: "";
position: absolute;
top: 9px;
bottom: 0;
right: -16px;
/* margin: auto; */
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(135deg);
-webkit-transform: rotate(135deg);
}
/* /anchor - 01 SP */
/* anchor - 01 PC */
@media (min-width: 768px) {
.anchor {
font-size: 1.6rem;
line-height: 2.4rem;
}
}
/* /anchor - 01 PC */
/* tab - 01 （2カラム - 上位階層のタブに使用）SP */
ul.tab-01 li {
width: 50%;
background: no-repeat;
padding: 0;
margin: 0;
line-height: 4.8rem;
}
ul.tab-01.nav-tabs, ul.tab-01.nav-tabs .nav-link {
border: none;
color: #2b1805;
}
ul.tab-01.nav-tabs .nav-link.active, ul.tab-01.nav-tabs .nav-item.show .nav-link {
border-bottom: solid 3px #95233b;
font-weight: bold;
}
ul.tab-01 button {
width: 100%;
}
/* /tab - 01 （2カラム - 上位階層のタブに使用）SP */
/* tab - 04 （下位階層のタブに使用 ※タブの中のタブ）SP */
ul.tab-04 {
margin-bottom: 2rem;
}
ul.tab-04 li {
width: 49%;
background: no-repeat;
padding: 0;
margin: 0;
}
ul.tab-04.nav-tabs {
border: none;
}
ul.tab-04.nav-tabs .nav-link {
border: solid 1px #e0e0e0;
color: #2b1805;
border-radius: 6px;
padding: 1.5rem 0;
}
ul.tab-04.nav-tabs .nav-link.active {
background: #95233b;
font-weight: bold;
color: #fff;
position: relative;
border: none;
}
ul.tab-04.nav-tabs .nav-link.active:before, ul.tab-04.nav-tabs .nav-item.show .nav-link:before {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
border: 5px solid transparent;
border-top: 8px solid #95233b;
}
ul.tab-04 button {
width: 100%;
}
/* /tab - 04 （下位階層のタブに使用 ※タブの中のタブ）SP */
/* 見出しマージンSP */
.mt16-16 {
margin-top: 1.6rem !important;
}
.mt24-28 {
margin-top: 2.4rem !important;
}
.mt24-40 {
margin-top: 2.4rem !important;
}
.mt32-40 {
margin-top: 3.2rem !important;
}
.mt32-48 {
margin-top: 3.2rem !important;
}
.mt32-60 {
margin-top: 3.2rem !important;
}
.mt40-48 {
margin-top: 4rem !important;
}
.mt40-60 {
margin-top: 4rem !important;
}
.mb12-12 {
margin-bottom: 1.2rem !important;
}
.mb16-16 {
margin-bottom: 1.6rem !important;
}
.mb16-20 {
margin-bottom: 1.6rem !important;
}
.mb20-20 {
margin-bottom: 2rem !important;
}
.mb20-28 {
margin-bottom: 2rem !important;
}
.mb24-28 {
margin-bottom: 2.4rem !important;
}
.mb24-30 {
margin-bottom: 2.4rem !important;
}
.mb24-40 {
margin-bottom: 2.4rem !important;
}
.mb32-40 {
margin-bottom: 3.2rem !important;
}
.mb32-60 {
margin-bottom: 3.2rem !important;
}
.mb40-48 {
margin-bottom: 4rem !important;
}
.mb40-60 {
margin-bottom: 4rem !important;
}
/* /見出しマージンSP */
/* 見出しマージンPC */
@media (min-width: 768px) {
.mt24-28 {
margin-top: 2.8rem !important;
}
.mt24-40 {
margin-top: 4rem !important;
}
.mt32-40 {
margin-top: 4rem !important;
}
.mt32-48 {
margin-top: 4.8rem !important;
}
.mt32-60 {
margin-top: 6rem !important;
}
.mt40-48 {
margin-top: 4.8rem !important;
}
.mt40-60 {
margin-top: 6rem !important;
}
.mb16-20 {
margin-bottom: 2rem !important;
}
.mb20-20 {
margin-bottom: 2rem !important;
}
.mb20-28 {
margin-bottom: 2.8rem !important;
}
.mb24-28 {
margin-bottom: 2.8rem !important;
}
.mb24-30 {
margin-bottom: 3rem !important;
}
.mb24-40 {
margin-bottom: 4rem !important;
}
.mb32-40 {
margin-bottom: 4rem !important;
}
.mb32-60 {
margin-bottom: 6rem !important;
}
.mb40-48 {
margin-bottom: 4.8rem !important;
}
.mb40-60 {
margin-bottom: 6rem !important;
}
}
/* /見出しマージンPC */
/* /共通 */
/* H1_SP */
/* H1 - 01 （アイコン付き - 第2階層に使用）_SP */
h1.h1-01 {
font-size: 2.2rem;
font-weight: bold;
text-align: center;
color: #2b1805;
background: no-repeat;
padding: 0;
line-height: 3.3rem;
}
h1.h1-01 img{
display: block;
margin: auto;
}
.h1_arrow2{
position: relative;
}
.h1_arrow2 h1.h1-01{
position: absolute;
left: 50%;
width: 100%;
top: 15px;
transform: translate(-50%,-50%);
padding: 0 10px 0 35px;
}
.h1_arrow2 a{
z-index: 12;
position: relative;
}
/* /H1 - 01 （アイコン付き - 第2階層に使用）_SP */
/* H1 - 01 （アイコン付き - 第2階層に使用）_PC */
@media (min-width: 768px) {
h1.h1-01 {
font-size: 3.2rem;
line-height: 4.8rem;
}
}
/* /H1 - 01 （アイコン付き - 第2階層に使用）_PC */
/* H1 - 02 （戻るボタン付き）_SP */
.h1_arrow {
position: relative;
}
.h1_arrow:before {
display: block;
content: "";
position: absolute;
top: -7px;
/* right: 0; */
bottom: 0;
left: 0;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transition: 0.2s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.h1_arrow:after {
display: block;
content: "";
position: absolute;
top: 4px;
/* right: 0; */
bottom: 0;
left: 0;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transition: 0.3s;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.h1_arrow a {
display: block;
}
/* /H1 - 02 （戻るボタン付き）_SP */
/* H1 - 02 （戻るボタン付き）_PC */
@media (min-width: 768px) {
.h1_arrow:before {
width: 15px;
}
.h1_arrow:after {
top: 13px;
width: 15px;
}
}
/* /H1 - 02 （戻るボタン付き）_PC */
/* H1 - news_SP */
.h1_news h1.h1-01 {
font-size: 2rem;
text-align: left;
}
.news_day {
font-size: 1.4rem;
}
/* /H1 - news_SP */
/* H1 - news_PC */
@media (min-width: 768px) {
.h1_news {
max-width: 800px;
width: 100%;
}
.h1_news h1.h1-01 {
font-size: 2.8rem;
text-align: left;
}
.h1_news_day {
font-size: 1.4rem;
}
}
/* /H1 - news_PC */
/* /H1_SP */
/* H2_SP */
h2.h2-normal {
font-size: 2rem;
background: no-repeat;
padding: 0;
box-shadow: none;
border: none;
line-height: 3rem;
font-weight: bold;
}
h2.h2-normal.tabh2 {
font-size: 2.2rem;
text-align: center;
}
.h2_link a,.h2_blank a {
position: relative;
display: inline-block;
margin-right: 4rem;
}
.h2_link a::after {
content: '';
background-repeat: no-repeat;
background-image: url(/common/img/h2_arrow_circle.svg);
background-size: 36px;
background-position: center center;
display: inline-block;
background-size: 20px;
vertical-align: middle;
width: 20px;
height: 20px;
position: absolute;
right: -40px;
top: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit-transform: translateY(-50%);
}
@media (min-width: 768px) {
.h2_link a::after {
background-size: 30px;
width: 30px;
height: 30px;
}
}
.h2_blank a::after {
content: '';
background-repeat: no-repeat;
background-image: url(/common/img/blank_icon.svg);
background-size: 36px;
background-position: center center;
display: inline-block;
background-size: 20px;
vertical-align: middle;
width: 20px;
height: 20px;
position: absolute;
right: -40px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
@media (min-width: 768px) {
.h2_blank a::after {
background-size: 30px;
width: 30px;
height: 30px;
}
}
/* /H2_SP */
/* H2_PC */
@media (min-width: 768px) {
h2.h2-normal {
font-size: 2.8rem;
line-height: 4.2rem;
}
h2.h2-normal.tabh2 {
font-size: 3.2rem;
}
.h2_link a {
background-size: 30px;
}
.h2_link a[target="_blank"] {
background-size: 30px;
}
}
/* /H2_PC */
/* H3_SP */
h3.h3-01 {
font-size: 1.8rem;
background: no-repeat;
box-shadow: none;
padding: 0;
line-height: 2.7rem;
font-weight: bold;
}
/* /H3_SP */
/* H3_PC */
@media (min-width: 768px) {
h3.h3-01 {
font-size: 2.4rem;
line-height: 3.6rem;
}
}
/* /H3_PC */
/* H4_SP */
h4.h4-01 {
font-size: 1.6rem;
background: no-repeat;
padding: 0;
line-height: 2.4rem;
}
/* /H4_SP */
/* H4_PC */
@media (min-width: 768px) {
h4.h4-01 {
font-size: 2rem;
line-height: 3rem;
}
}
/* /H4_PC */
/* H5_SP */
h5.h5-01 {
font-size: 1.5rem;
line-height: 2.25rem;
}
/* /H5_SP */
/* H5_PC */
@media (min-width: 768px) {
h5.h5-01 {
font-size: 1.8rem;
line-height: 2.7rem;
}
}
/* /H5_PC */
/* その他 */
.common_search {
display: block;
margin: 2rem auto;
padding: 0.8rem;
border: solid #e5e5e5 1px;
border-radius: 6px;
width: 80%;
background: #f9f9f9;
}
/* /その他 */
/* ヘッダー */
html{
scroll-padding-top: 90px;
}
.about_alt{
position: absolute;
clip-path: inset(100%);
overflow: hidden;
height: 1px;
}
#blockSkip a {
display: inline;
font-size: 125%;
font-weight: bold;
left: -1000em;
padding: 5px;
position: absolute;
text-align: center;
text-decoration: none;
top: 0;
width: 300px;
z-index: 99;
}
#blockSkip a:focus, #blockSkip a:active {
background: none repeat scroll 0 0 #fff !important;
border: 2px solid #000;
left: 230px;
position: absolute;
top: 50px;
width: 250px;
}
.blackbox {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: #0000004f;
cursor: pointer;
z-index: 5;
}
#header {
position: fixed;
width: 100%;
top: 0;
left: 0;
height: auto;
margin: 0;
z-index: 10;
box-shadow: 0px 5px 9px #7474740a;
background: none;
}
#header .header_inner {
position: relative;
z-index: 10;
background: #fff;
display: flex;
align-items: center;
justify-content: space-between;
}
#header .header_inner .header_logo {
max-width: 220px;
width: 40%;
display: flex;
align-items: center;
justify-content: center;
}
#header .header_inner .header_logo a {
display: block;
width: 100%;
color: #000;
}
#header .header_inner .header_logo a img {
display: block;
width: 100%;
}
#header .header_inner .header_menu {
display: none;
max-width: 700px;
}
#header .header_inner .header_menu ul {
display: flex;
align-items: center;
justify-content: center;
margin: 0;
padding: 0;
}
#header .header_inner .header_menu ul li:nth-of-type(n + 2) {
margin-left: 25px;
}
#header .header_inner .header_menu ul li a {
font-weight: bold;
color: #000;
}
#header .header_inner .header_menu ul li a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#header .header_inner .header_icon {
max-width: 300px;
width: 60%;
}
#header .header_inner .header_icon ul {
display: flex;
justify-content: center;
margin-bottom: 0;
padding: 0;
}
#header .header_inner .header_icon ul li {
position: relative;
width: 35%;
padding: 4%;
}
#header .header_inner .header_icon ul li:nth-of-type(-n + 2)::before {
content: "";
position: absolute;
width: 1px;
height: 75%;
top: 50%;
left: 0;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
background: #ccc;
}
#header .header_inner .header_icon ul li.hamburger {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
width: 30%;
background: #95233b;
cursor: pointer;
}
#header .header_inner .header_icon ul li.hamburger div {
position: relative;
width: 28px;
height: 28px;
}
#header .header_inner .header_icon ul li.hamburger div span {
position: absolute;
display: block;
background: #fff;
width: 100%;
height: 2px;
transition: all 0.5s;
}
#header .header_inner .header_icon ul li.hamburger div span:nth-of-type(1) {
top: 0;
}
#header .header_inner .header_icon ul li.hamburger div span:nth-of-type(2) {
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
#header .header_inner .header_icon ul li.hamburger div span:nth-of-type(3) {
bottom: 0;
}
#header .header_inner .header_icon ul li.hamburger.active div span:nth-of-type(1) {
transform: translateY(13px) rotate(-45deg);
-webkit-transform: translateY(13px) rotate(-45deg);
}
#header .header_inner .header_icon ul li.hamburger.active div span:nth-of-type(2) {
opacity: 0;
}
#header .header_inner .header_icon ul li.hamburger.active div span:nth-of-type(3) {
transform: translateY(-13px) rotate(45deg);
-webkit-transform: translateY(-13px) rotate(45deg);
}
#header .header_inner .header_icon ul li a {
display: block;
text-align: center;
font-size: 1.2rem;
font-weight: bold;
white-space: nowrap;
color: #000;
}
#header .header_inner .header_icon ul li a img {
display: block;
width: 50%;
margin: 0 auto 6%;
}
#header #hamburger_menu {
position: fixed;
top: 0;
left: 100vw;
width: 100%;
height: 100%;
background: #fff;
transition: all 0.5s;
overflow: auto;
visibility: visible;
z-index: 5;
}
#header #hamburger_menu.active {
left: 0;
}
#header #hamburger_menu .menu_input {
display: block;
padding: 2rem;
border-top: 1px solid #ccc;
}
#header #hamburger_menu .menu_input .menu_input_wrap {
position: relative;
}
#header #hamburger_menu .menu_input .menu_input_wrap input {
width: 100%;
padding: 1.6rem 1.6rem 1.6rem 6rem;
background: #f8f8f8;
border: solid #e5e5e5 1px;
border-radius: 6px;
box-sizing: border-box;
}
#header #hamburger_menu .menu_input .menu_input_wrap input::placeholder {
color: #707070;
}
#header #hamburger_menu .menu_input .menu_input_wrap label {
position: absolute;
clip-path: inset(100%);
overflow: hidden;
height: 1px;
}
#header #hamburger_menu .menu_input .menu_input_wrap button.btn_submit{
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
left: 2rem;
width: 20px;
display: inline-block;
border: none;
padding: 0;
background-color: transparent;
}
#header #hamburger_menu .accordion_menu {
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 800px;
}
#header #hamburger_menu .menu {
width: 100%;
background-color: #fff;
}
#header #hamburger_menu .menu:nth-of-type(n+2) {
margin-top: 2rem;
}
#header #hamburger_menu .menu-item {
margin-bottom: 4px;
width: 100%;
background-color: #f8f8f8;
}
#header #hamburger_menu .menu-item-link {
position: relative;
width: 100%;
padding: 1.5rem;
display: block;
}
#header #hamburger_menu .menu-item-link::before {
content: "";
display: block;
position: absolute;
top: 50%;
right: 15px;
width: 8px;
height: 2px;
background: #95233b;
transform: translateY(-3px) rotate(45deg);
-webkit-transform: translateY(-3px) rotate(45deg);
}
#header #hamburger_menu .menu-item-link::after {
content: "";
display: block;
position: absolute;
top: 50%;
right: 15px;
width: 8px;
height: 2px;
background: #95233b;
transform: translateY(3px) rotate(-45deg);
-webkit-transform: translateY(3px) rotate(-45deg);
}
#header #hamburger_menu .menu-item-label {
position: relative;
width: 100%;
padding: 1.5rem;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
#header #hamburger_menu .menu-item-label::before {
display: block;
content: "";
position: absolute;
top: 50%;
right: 15px;
width: 14px;
height: 2px;
background-color: #95233b;
transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transition: all 0.5s;
}
#header #hamburger_menu .menu-item-label::after {
display: block;
content: "";
position: absolute;
top: 50%;
right: 15px;
width: 14px;
height: 2px;
background-color: #95233b;
transition: all 0.5s;
}
#header #hamburger_menu .menu-item-label.open::before {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
}
#header #hamburger_menu .menu-item__inner {
overflow: hidden;
width: 100%;
height: 0;
transition: all 0.5s;
}
#header #hamburger_menu .menu-item__inner ul li {
position: relative;
border-top: 2px solid #fff;
padding-left: 3rem;
box-sizing: border-box;
display: flex;
align-items: center;
}
#header #hamburger_menu .menu-item__inner ul li a {
display: block;
padding: 1.6rem 1.6rem 1.6rem 0;
}
#header #hamburger_menu .menu-item__inner ul li a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#header #hamburger_menu .menu-item__inner ul li::before {
content: "";
display: block;
position: absolute;
top: 50%;
left: 15px;
width: 8px;
height: 2px;
background: #95233b;
transform: translateY(-3px) rotate(45deg);
-webkit-transform: translateY(-3px) rotate(45deg);
}
#header #hamburger_menu .menu-item__inner ul li::after {
content: "";
display: block;
position: absolute;
top: 50%;
left: 15px;
width: 8px;
height: 2px;
background: #95233b;
transform: translateY(3px) rotate(-45deg);
-webkit-transform: translateY(3px) rotate(-45deg);
}
#header #hamburger_menu .menu-item__inner ul li:nth-of-type(n+2) {
margin-left: 2rem;
}
#header #hamburger_menu .menu_bnr {
padding: 3rem 2rem;
}
#header #hamburger_menu .menu_bnr a {
display: block;
max-width: 300px;
width: 100%;
margin: 0 auto;
}
#header #hamburger_menu .menu_list {
padding: 3rem 2rem;
background: #f8f8f8;
}
#header #hamburger_menu .menu_list ul {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
#header #hamburger_menu .menu_list ul li {
width: 50%;
}
#header #hamburger_menu .menu_list ul li:nth-of-type(2n+1) {
text-align: right;
padding-right: 1rem;
}
#header #hamburger_menu .menu_list ul li:nth-of-type(2n) {
border-left: 1px solid #e2e2e2;
padding-left: 1rem;
}
#header #hamburger_menu .menu_list ul li:nth-of-type(n+3) {
margin-top: 1rem;
}
#header #hamburger_menu .menu_list ul li a {
font-size: 1.4rem;
white-space: normal;
}
#header #hamburger_menu .menu_list ul li a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#header #hamburger_menu .menu_lang {
max-width: 180px;
width: 100%;
margin: 0 auto;
padding: 3.2rem 0;
position: relative;
}
#header #hamburger_menu .menu_lang .menu_lang_select {
display: inline-flex;
align-items: center;
justify-content: center;
position: relative;
margin: 0 auto;
line-height: 1.8rem;
}
#header #hamburger_menu .menu_lang .menu_lang_select::before {
content: "";
position: absolute;
display: block;
top: 0.3rem;
left: 2px;
width: 20px;
height: 20px;
background-image: url(/common/img/lang_icon.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
}
#header #hamburger_menu .menu_lang .menu_lang_select::after {
content: "";
position: absolute;
display: block;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
right: 6px;
width: 0;
height: 0;
border-top: 8px solid #95233b;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
transition: all 0.5s;
}
#header #hamburger_menu .menu_lang .menu_lang_select label {
position: absolute;
clip-path: inset(100%);
overflow: hidden;
height: 1px;
}
#header #hamburger_menu .menu_lang .menu_lang_select select {
appearance: none;
border: none;
cursor: pointer;
padding: 0.4rem 3rem;
background-color: #fff!important;
}
/**
#header #hamburger_menu .menu_lang {
max-width: 180px;
width: 100%;
margin: 0 auto;
padding: 3.2rem 0;
}
#header #hamburger_menu .menu_lang ul {
position: relative;
padding-left: 3.5rem;
}
#header #hamburger_menu .menu_lang ul::before {
content: "";
position: absolute;
display: block;
top: 0;
left: 0;
width: 25px;
height: 25px;
background-image: url(/common/img/lang_icon.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
}
#header #hamburger_menu .menu_lang ul li {
display: flex;
align-items: center;
justify-content: space-between;
}
#header #hamburger_menu .menu_lang ul li:not(:first-of-type) {
display: none;
}
#header #hamburger_menu .menu_lang ul.active li:not(:first-of-type) {
display: flex;
}
#header #hamburger_menu .menu_lang ul li a {
display: block;
text-align: center;
}
#header #hamburger_menu .menu_lang ul li span {
position: relative;
display: block;
margin-left: 1rem;
width: 20px;
height: 20px;
cursor: pointer;
}
#header #hamburger_menu .menu_lang ul.active li span {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
}
#header #hamburger_menu .menu_lang ul li span::before {
display: block;
content: "";
position: absolute;
top: 10px;
right: 8px;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#header #hamburger_menu .menu_lang ul li span::after {
display: block;
content: "";
position: absolute;
top: 10px;
right: 3px;
width: 8px;
height: 2px;
background-color: #95233b;
transition: all 0.5s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
*/
@media (min-width: 767px) {
#header #hamburger_menu.active {
width: 520px;
left: calc(100vw - 520px);
}
#header #hamburger_menu .menu-item__inner{
background: #fff;
}
#header #hamburger_menu .menu-item__inner ul {
display: flex;
flex-wrap: wrap;
margin-left: 2rem;
}
#header #hamburger_menu .menu-item__inner ul li:first-of-type {
width: 100%;
}
#header #hamburger_menu .menu-item__inner ul li:nth-of-type(n+2) {
margin-left: 0;
}
}
@media (min-width: 1180px) {
#header .header_inner .header_menu {
display: block;
}
}
/* /メニュー */
#railinfo_alert ul {
padding-left: 0;
}
#railinfo_alert .alert_list a {
display: block;
padding: 0.8rem 0;
box-sizing: border-box;
color: #000;
}
#railinfo_alert .alert_list a p {
position: relative;
display: flex;
align-items: center;
padding: 0 3rem 0 2rem;
font-size: 1.4rem;
}
#railinfo_alert .alert_list a p::before {
display: block;
content: "";
position: absolute;
top: -6px;
bottom: 0;
right: 2rem;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#railinfo_alert .alert_list a p::after {
display: block;
content: "";
position: absolute;
top: 3px;
right: 0;
bottom: 0;
right: 2rem;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transition: all 0.5s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
#railinfo_alert .alert_list {
border-bottom: 1px solid #fff;
}
#railinfo_alert .alert_list.emergency {
display: block;
}
#railinfo_alert .alert_delay {
background: #f8f6f0;
}
#railinfo_alert .alert_lv1 {
background: #f5edf1;
}
#railinfo_alert .alert_lv2 {
background: #fddd6b;
}
#railinfo_alert img {
display: block;
margin-right: 5px;
max-width: 24px;
width: 100%;
}
#railinfo_alert .alert_delay span {
display: none;
margin: 0 2rem 0 auto;
color: #4D4D4D;
}
@media (min-width: 768px) {
#railinfo_alert .alert_delay span {
display: block;
}
}
/* /ヘッダー */
/* フッター */
#footer {
height: auto;
background: none;
}
#footer .footer_sec01 {
background-color: #f8f8f8;
background-image: url(/common/img/train_line_img.svg);
background-position: bottom;
background-repeat: repeat-x;
}
#footer .footer_sec01 .footer_sec01_inner {
padding: 3rem 2rem 6rem;
background-image: url(/common/img/train_img.svg);
background-position: bottom 10px right 40px;
background-repeat: no-repeat;
}
#footer .footer_sec01 .footer_sec01_inner>ul {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li {
padding: 3.2rem 2rem;
width: 100%;
background: #fff;
border-radius: 10px;
box-sizing: border-box;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
}
#footer .footer_sec01 .footer_sec01_inner>ul>li:first-of-type {
margin-bottom: 2rem;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt01 {
max-width: 300px;
width: 100%;
margin: 0 auto 2.6rem;
display: flex;
align-items: center;
justify-content: center;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt01 figure {
max-width: 65px;
width: 28%;
margin: 0 4% 0 0;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt01 h2 {
font-size: 2rem;
width: 70%;
font-weight: bold;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt01 h2 span {
display: block;
margin-bottom: 1.6rem;
font-size: 1.4rem;
white-space: nowrap;
font-weight: normal;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li p {
text-align: center;
max-width: 400px;
width: 100%;
margin: 0 auto 1.6rem;
font-size: 1.4rem;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li>ul {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 400px;
width: 100%;
margin: 0 auto;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li>ul>li:first-of-type {
width: 43%;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li>ul>li:last-of-type {
width: 53%;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li>ul>li a, #footer .footer_sec01 .footer_sec01_inner>ul>li>ul>li a img {
display: block;
width: 100%;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02 h2 {
font-size: 2rem;
line-height: 1.6;
text-align: center;
max-width: 400px;
width: 100%;
margin: 0 auto 2rem;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02 h2 span {
display: block;
font-size: 1.4rem;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul {
max-width: 400px;
width: 100%;
margin: 0 auto;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li:first-of-type>ul>li {
margin-bottom: 1.6rem;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li>ul>li a {
display: flex;
align-items: center;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li>ul>li a figure {
max-width: 40px;
width: 20%;
margin: 0 1.6rem 0 0;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li>ul>li a p {
max-width: none;
margin: 0 auto;
text-align: left;
}
@media (min-width: 768px) {
#footer .footer_sec01 .footer_sec01_inner>ul {
flex-direction: row;
align-items: stretch;
justify-content: space-between;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li {
width: 49%;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li:first-of-type {
margin: 0;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul {
max-width: 430px;
display: flex;
align-items: flex-start;
justify-content: space-between;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li:first-of-type>ul>li a p {
white-space: nowrap;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li:last-of-type {
width: 55%;
padding: 0;
}
#footer .footer_sec01 .footer_sec01_inner>ul>li .footer_sec01_inner_cnt02>ul>li>ul>li a figure {
width: 100%;
}
}
/*パンクズ*/
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs{
display: flex;
align-items: center;
justify-content: start;
flex-direction: row;
flex-wrap: wrap;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li{
position: relative;
width: auto;
padding: 0.4rem 2rem 0.4rem 0;
background: none;
box-shadow: none;
border-radius: 0;
font-size: 1.4rem;
line-height: 1.2;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:first-of-type{
margin: 0;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:not(:last-of-type)::before{
content: "";
display: block;
position: absolute;
top: 50%;
right: 0.8rem;
width: 6px;
height: 1px;
background: #909090;
transform: translateY(-2px) rotate(45deg);
-webkit-transform: translateY(-2px) rotate(45deg);
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:not(:last-of-type)::after{
content: "";
display: block;
position: absolute;
top: 50%;
right: 0.8rem;
width: 6px;
height: 1px;
background: #909090;
transform: translateY(2px) rotate(-45deg);
-webkit-transform: translateY(2px) rotate(-45deg);
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li a{
display: block;
padding: 0 1rem;
font-size: 1.4rem;
line-height: 1.2;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li a:hover{
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:first-of-type a{
color: #95233b;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:first-of-type a:hover{
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#footer .footer_sec01 .footer_sec01_inner .footer_breadcrumbs li:last-of-type a:hover{
opacity: 1;
}
/*/パンクズ*/
#footer .footer_sec02 .footer_sec02_inner {
padding: 0;
}
#footer .footer_sec02 .footer_sec02_inner>ul {
display: flex;
flex-direction: column;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li {
border-bottom: 2px solid #e2e2e2;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a {
position: relative;
display: inline-block;
padding: 1.2rem 2rem 1.2rem 4rem;
font-weight: bold;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a::before {
display: block;
content: "";
position: absolute;
top: -6px;
bottom: 0;
left: 2rem;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a::after {
display: block;
content: "";
position: absolute;
top: 3px;
bottom: 0;
left: 2rem;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transition: all 0.5s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li .menu_inner {
display: none;
margin-bottom: 2rem;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li .menu_inner a {
padding: 0.6rem 0;
display: inline-block;
font-size: 1.4rem;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li .menu_inner a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li:last-of-type {
padding: 3.2rem 2rem;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt01 {
padding: 3.2rem 2rem;
background: #f8f8f8;
margin-bottom: 2rem;
border-radius: 10px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt01 h2 {
margin: 0 auto 3.2rem;
text-align: center;
font-size: 1.8rem;
font-weight: bold;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt01>ul {
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
max-width: 400px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt01>ul>li {
width: 21%;
box-sizing: border-box;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt01>ul>li a {
display: block;
width: 40px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 {
padding: 3.2rem 2rem;
background: #f8f8f8;
border-radius: 10px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 .footer_sec02_inner_cnt02_ttl {
max-width: 300px;
width: 100%;
margin: 0 auto 2.6rem;
display: flex;
align-items: center;
justify-content: center;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 .footer_sec02_inner_cnt02_ttl figure {
max-width: 65px;
width: 28%;
margin: 0 4% 0 0;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 .footer_sec02_inner_cnt02_ttl h2 {
font-size: 2rem;
font-weight: bold;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 .footer_sec02_inner_cnt02_ttl h2 span {
display: block;
margin-top: 1.6rem;
font-size: 1.4rem;
white-space: nowrap;
font-weight: normal;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 ul {
display: flex;
align-items: center;
justify-content: space-between;
max-width: 400px;
width: 100%;
margin: 0 auto;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 ul li:first-of-type {
width: 43%;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 ul li:last-of-type {
width: 53%;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 ul li a, #footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_cnt02 ul li img {
display: block;
width: 100%;
}
@media (min-width: 768px) {
#footer .footer_sec02 .footer_sec02_inner {
padding: 3.2rem 2rem;
}
#footer .footer_sec02 .footer_sec02_inner>ul {
flex-direction: row;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li:first-of-type {
width: 56%;
margin-right: 4%;
border-right: 2px solid #e2e2e2;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li:last-of-type {
width: 40%;
padding: 0;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu {
display: flex;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul {
width: 190px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li {
border: none;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a {
padding: 1rem 1.6rem;
white-space: nowrap;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a::before {
left: 0;
top: -4px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li>a::after {
left: 0;
top: 6px;
}
#footer .footer_sec02 .footer_sec02_inner>ul>li .footer_sec02_inner_menu>ul>li .menu_inner{
display: block;
}
}
#footer .footer_sec03 {
background: #f8f8f8;
}
#footer .footer_sec03 .footer_sec03_inner {
padding: 3.2rem 2rem;
}
#footer .footer_sec03 .footer_sec03_inner ul {
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
}
#footer .footer_sec03 .footer_sec03_inner ul li {
width: 50%;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(n+3) {
margin-top: 1rem;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(2n+1) {
text-align: right;
padding-right: 1rem;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(2n) {
border-left: 1px solid #e2e2e2;
padding-left: 1rem;
}
#footer .footer_sec03 .footer_sec03_inner ul li a {
font-size: 1.4rem;
white-space: normal;
}
#footer .footer_sec03 .footer_sec03_inner ul li a:hover {
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
@media (min-width: 768px) {
#footer .footer_sec03 .footer_sec03_inner ul li {
width: 25%;
text-align: center;
padding: 0 1rem;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(n+3) {
margin-top: 0;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(n+5) {
margin-top: 2rem;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(2n) {
border: none;
}
#footer .footer_sec03 .footer_sec03_inner ul li:not(:nth-of-type(4n + 1)) {
border-left: 1px solid #e2e2e2;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(2n+1) {
text-align: center;
}
}
@media (min-width: 1025px) {
#footer .footer_sec03 .footer_sec03_inner ul li {
width: auto;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(n+5) {
margin-top: 0;
}
#footer .footer_sec03 .footer_sec03_inner ul li:nth-of-type(n+2) {
border-left: 1px solid #e2e2e2;
}
}
#footer .footer_sec04 .footer_sec04_inner {
padding: 3.2rem 2rem;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang {
max-width: 180px;
width: 100%;
margin: 0 auto 3.2rem;
}
footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang .select_lang {
display: inline-flex;
align-items: center;
position: relative;
line-height: 1.8rem;
}
footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang .select_lang::before {
content: "";
position: absolute;
display: block;
top: 0.3rem;
left: 2px;
width: 20px;
height: 20px;
background-image: url(/common/img/lang_icon.svg);
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
}
footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang .select_lang::after {
content: "";
position: absolute;
display: block;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
right: 6px;
width: 0;
height: 0;
border-top: 8px solid #95233b;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
transition: all 0.5s;
}
footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang .select_lang label {
position: absolute;
clip-path: inset(100%);
overflow: hidden;
height: 1px;
}
footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang .select_lang select {
appearance: none;
border: none;
cursor: pointer;
padding: 0.4rem 3rem;
background-color: #fff!important;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy {
text-align: center;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li:not(:first-of-type){
margin-top: 1.6rem;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li.copy{
font-size: 1.2rem;
color: #707070;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li .h3_link a{
position: relative;
display: inline-block;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li .h3_link a:hover{
opacity:1!important;
text-decoration: underline #95233b !important;
text-underline-offset:5px;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li .h3_link a::before {
display: block;
content: "";
position: absolute;
top: -6px;
bottom: 0;
left: -15px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li .h3_link a::after {
display: block;
content: "";
position: absolute;
top: 3px;
bottom: 0;
left: -15px;
margin: auto;
width: 8px;
height: 2px;
background-color: #95233b;
transition: all 0.5s;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li span.blank_icon02::after{
content: '';
background-repeat: no-repeat;
background-image: url(/common/img/blank_icon.svg);
background-position: center center;
display: inline-block;
background-size: 16px;
vertical-align: middle;
width: 16px;
height: 16px;
position: absolute;
right: -20px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
@media (min-width: 768px) {
#footer .footer_sec04 .footer_sec04_inner {
display: flex;
justify-content: space-between;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_lang {
max-width: none;
width: 25%;
margin: -0.6rem 0 0 0;
display: flex;
align-items: flex-start;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy {
width: 31rem;
text-align: right;
display: flex;
align-items: center;
margin-left: auto;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_copy ul li .h3_link{
padding-right: 20px;
}
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop {
text-indent: -9999px;
z-index: 1;
margin-top: 1.6rem;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop a {
position: relative;
margin-left: auto;
display: block;
width: 40px;
height: 40px;
background: #95233B;
transition: opacity .3s ease;
border-radius: 100%;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop a:hover {
opacity: .3;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop a::before {
position: absolute;
top: 5px;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 10px;
height: 10px;
margin: auto;
content: '';
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
border-top: 1px solid #FFF;
border-right: 1px solid #FFF;
}
@media screen and (min-width:768px) {
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop {
margin-top: 0.4rem;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop a {
width: 46px;
height: 46px;
}
#footer .footer_sec04 .footer_sec04_inner .footer_sec04_pagetop a::before {
top: 7px;
width: 12px;
height: 12px;
}
}
/* /フッター */
/* 駅を探すアラート */
#station_suggest_cnt {
display: none;
position: fixed;
max-width: 300px;
width: 100%;
padding: 2rem;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: #fff;
border-radius: 6px;
box-shadow: 0px 1px 10px rgb(0 0 0 / 13%);
z-index: 5;
}
#station_suggest_cnt .station_suggest_ttl {
margin-bottom: 2rem;
text-align: center;
font-weight: bold;
}
#station_suggest_cnt .station_suggest_link {
display: flex;
align-items: center;
justify-content: space-between;
}
#station_suggest_cnt .station_suggest_link li {
width: 48%;
border-radius: 5px;
border: 1px solid #e0e0e0;
background: #95233b;
text-align: center;
cursor: pointer;
}
#station_suggest_cnt .station_suggest_link li.station_suggest_reset {
padding: 1rem;
background: #fff;
}
#station_suggest_cnt .station_suggest_link li a {
display: block;
padding: 1rem;
color: #fff;
text-align: center;
}
.ui-front{
z-index: 2;
}
#suggest_station_cookie {
width: 100%;
top: 100%;
}
#suggest_station_cookie::before {
content: "履歴";
display: block;
margin-left: 1rem;
padding: 0.5rem;
font-weight: 700;
border-bottom: 1px solid #c5c5c5;
}
#suggest_station_cookie li a{
display: block;
padding: 0.4rem 0.8rem;
}
#suggest_station_cookie li a:hover,#suggest_station_cookie li a:focus{
background: #007fff;
color: #fff;
opacity: 1;
}
/* /駅を探すアラート */
/* お問い合わせメニュー */
.lang_ja_view:not(:lang(ja)){
display:none!important;
}
#fix_menu.footer_fix_menu.lang_ja_view {
position: fixed;
bottom: 0;
width: 100%;
z-index: 2;
display: flex;
justify-content: flex-end;
}
#fix_menu.footer_fix_menu.lang_ja_view>span {
content: "";
display: block;
position: absolute;
top: -13px;
right: 10px;
width: 25px;
height: 25px;
cursor: pointer;
}
#fix_menu.footer_fix_menu.lang_ja_view ul {
background: rgba(248, 246, 240, 0.7);
padding: 8px;
width: 50%;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li {
background: #95233B;
border-radius: 6px;
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.05);
}
#fix_menu.footer_fix_menu.lang_ja_view ul li:first-of-type {
border-right: initial;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li a {
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li a img {
display: block;
max-width: 32px;
width: 40%;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li a span {
display: block;
margin-left: 1.8rem;
color: #fff;
font-size: 1.2rem;
}
@media (min-width: 768px) {
#fix_menu.footer_fix_menu.lang_ja_view {
right: 0;
width: 200px;
z-index:2;
display: initial;
}
#fix_menu.footer_fix_menu.lang_ja_view>span {
left: -13px;
}
#fix_menu.footer_fix_menu.lang_ja_view ul {
background: #95233b;
flex-direction: column;
border-radius: 6px 0px 0px 0px;
box-shadow: -1px -2px 20px rgba(0, 0, 0, 0.2);
padding: initial;
width: initial;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li {
background: initial;
border-radius: initial;
width: 100%;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li:first-of-type {
border-right: none;
}
#fix_menu.footer_fix_menu.lang_ja_view ul li a span {
width: 54%;
font-size: 1.3rem;
}
}
/* /お問い合わせメニュー */