html, body {
    color: #333;
    font-family: 'Noto Sans JP', sans-serif;
    font-size: 18px;
    font-weight: 500;
    position: relative;
    margin: 0;
    padding: 0;
    width: 100%;
    overflow: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    animation: fadeIn 1.5s ease 0s 1 normal;
    -webkit-animation: fadeIn 1.5s ease 0s 1 normal;
}
@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*--- TITLE OPTION  ---*/
h1, h2, h3, h4 {
    color: #000;
    font-family: roboto, 'Noto Sans JP', sans-serif;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: 0.1em;
    margin: 0 auto;
    padding: 0;
}
h3, h4 {
    font-family: 'Noto Sans JP', sans-serif;
}
h1 { font-size: 50px; }
h2 { font-size: 45px; margin-bottom: 1.5em; }
h3 { font-size: 29px; }
h4 { font-size: 22px; letter-spacing: 0.025em; margin-bottom: 0.6em; }

.tit-bd {
    display: table;
    color: #0B53BA;
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: bold;
    line-height: 1.3;
    letter-spacing: 0.025em;
    margin: 0 0 1.2rem;
    margin-left: -0.2em;
    padding: 10px 2.5rem 12px;
    border: 3px solid #0B53BA;
    border-radius: 1.6rem
}

.tit-bd-l {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: bold;
    line-height: 1.2;
    letter-spacing: 0.04em;
    display: flex;
    align-items: center;
    height: auto;
    min-height: 2.4em;
    margin: 0 auto 1em;
    /*padding: 0 0 0 1em;*/
    padding: 0 0 0 2.3vw;
    border-left: 3px solid #333;
}

/*--- Aタグ OPTION  ---*/
a, a:hover, a:focus { text-decoration: none; outline: none; }
a {
    color: #B82E29;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
a:hover { color: #931915; }
p > a { text-decoration: underline; padding: 0 0.2em; }
p > a:hover { text-decoration: underline; }

::selection {
    /*color: #fff;*/
    background-color: rgba(255, 227, 228, 0.6)
}

/*--- TEXT OPTION ---*/
p {
    margin: 0 auto 1.5em;
	padding: 0;
    line-height: 1.8;
    letter-spacing: 0.02em;
}
.ja-txt {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 500;
}
.en-txt {
    font-family: roboto, 'Noto Sans JP', sans-serif;
    font-weight: 700;
}
.color-wh { color: #fff; }
.color-bk { color: #333; }
.color-bl { color: #0B53BA; }
.color-red { color: #C7254A; }

/*--- background ---*/
.bg-wh { background-color: #fff; }
.bg-bk { background-color: #000; }
.bg-bl { background-color: #3B63D8; }
.bg-gray { background-color: #F0F0F0!important; }

/*--- .box ---*/
.box-wh, .box-gray, .box-ye {
    margin-bottom: 1.5em;
    padding: 3em;
}
.box-wh { background-color: #fff; /*border: 3px solid #000;*/ }
.box-gray { background-color: #FBFBFB; padding: 1.5em; }
.box-ye { background-color: #FBFCD0; }

/*--- .img-clip ---*/
.img-clip {
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 1.6em;
}
.img-clip::before {
    content: "";
    display: block;
    padding-top: 67%;
}
.img-clip img {
    position: absolute;
    width: 100%!important;
    height: 100%!important;
    object-fit: cover;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transition: 1s ease!important;
    -o-transition: 1s ease!important;
    transition: 1s ease!important;
}
.img-rotate30 { border-radius: 0 1.6em 1.6em 0; }
.main-slider .img-clip { border-radius: 0 1.6em 1.6em 0; }


/*--- .btn00 ---*/
.btn00 a {
    color: #3B63D8;
    font-family: roboto, 'Noto Sans JP', sans-serif;
    font-weight: 700;
    font-size: 25px;
    line-height: 1.5;
    letter-spacing: 0.1em;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90%;
    max-width: 425px;
    height: 109px;
    margin: 0 auto;
    padding: 0.6em 1.5em 0.6em 2em;
    background-color: #fff;
    border: 8px solid #3B63D8;
    border-radius: 66px;
    overflow: hidden;
    text-decoration: none;
    outline: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    text-align: center;
    vertical-align: middle;
}
.btn00 span { position: relative; display: flex; align-items: center; }
.btn00 a::after {
    content: "";
    display: block;
    width: 44px;
    height: 44px;
    position: absolute;
    right: 30px;
    z-index: 10;
    background-color: #3B63D8;
    border-radius: 100%;
    -webkit-transition: background-color 0.4s;
    -o-transition: background-color 0.4s;
    transition: background-color 0.4s;
}
.btn00 a::before {
    content: "→";
    color: #fff;
    font-size: 15px;
    letter-spacing: 0;
    line-height: 1.3;
    position: absolute;
    top: 50%;
    right: 43px;
    z-index: 50;
    transform: translateY(-50%);
    -webkit-transition: color 0.4s;
    -o-transition: color 0.4s;
    transition: color 0.4s;
}
.btn00 a:hover { color: #fff; background-color: #3B63D8; }
.btn00 a:hover::after { background-color: #fff; }
.btn00 a:hover::before { color: #3B63D8; }



/* --- flex-box --- */
.flex-box {
    display: flex;
    justify-content: center;
    align-items: center;
    /*flex-wrap: wrap;*/
}
.flex-wrap {
    display: flex;
    justify-content: flex-end;
    flex-flow: column;
}

/*--- grid-box ---*/
.grid-box {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    /*grid-gap: 2.6rem;*/
    grid-gap: 3.6vw;
}
.grid2 { grid-template-columns: 1fr 1fr; }
.grid3 { grid-template-columns: 1fr 1fr 1fr; }
.grid5 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; }
.grid-wrap0 { grid-gap: 0!important; }


/* --------------------------------------------
    header
-------------------------------------------- */
.hd01 {
    position: relative;
    z-index: 50;
    width: 100%;
    height: auto;
    overflow: hidden;
}

/* --------------------------------------------
    コンテンツ
-------------------------------------------- */
section { position: relative; overflow: hidden; }
.sec-inline, .ft-wrap { padding-inline: calc((100vw - 1000px) / 2); }
#content-main {
    width: calc(100% + 30px);
    margin: 0 -15px;
}
/* --- row --- */
.row { margin-right: -1.2vw; margin-left: -1.2vw; }
.col-lg-6, .col-md-6, .col-sm-6 { padding-right: 1.2vw; padding-left: 1.2vw; }

/* --- sec01 --- */
.sec01 {
    margin-top: 6rem;
    padding-bottom: 6rem;
}
.sec01::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: -3.5%;
    z-index: 0;
    width: 33vw;
    height: 33vw;
    background-image: url(../img/person-icon-2photo.png);
    background-position: right bottom;
    background-repeat: no-repeat;
    background-size: contain;
}

.slider-wrap { position: relative; }
.main-slider {
    display: block;
    width: 54.6%;
    margin: 0 0 2.1em;
    /*margin: 0 0 2.94vw;*/
    position: relative;
    z-index: 10;
}

.main-thumbnail-slider {
    display: block;
    width: 74%;
    margin: 0 0 0 auto;
    margin-right: -12.5%;
    position: relative;
    z-index: 10;
}
.main-thumbnail-slider .slick-track {
  position: relative;
  left: calc(-100% / 3);
}
.main-thumbnail-slider .slick-slide {
  /*margin: 0 1.05em; /* スライド同士の間隔を指定する */
  margin: 0 1.47vw; /* スライド同士の間隔を指定する */
}


.sec01-txt {
    position: absolute;
    top: 0;
    left: 59%;
    display: block;
    width: 18em;
    max-width: 40%;
}
.sec01-txt > p { line-height: 1.6; }

.sec01 .slider-arrows {
    position: absolute;
    top: calc(67% - 40px);
    left: 59%;
    z-index: 10;
}

/* --- sec02 --- */
.sec02 { padding-top: 2rem; }
.sec02-hd {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin: 0 auto 2rem;
}
.sec02-hd h2 { white-space: nowrap; margin-bottom: 1.5rem }
.sec02-hd .img-bus {
    width: 92%;
    max-width: 420px;
    margin-left: auto;
}

/* --- tabs --- */
.nav-tabs {
    position: relative;
    z-index: 10;
    width: 100%;
    display: flex;
    justify-content: center;
    border: none;
    padding: 0!important;
    margin: 0!important;
}
.nav-tabs > li { margin-bottom: 0!important; }
.nav-tabs > li a {
    color: #333;
    font-size: 23px;
    font-family: roboto, 'Noto Sans JP', sans-serif;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.1em;
    display: block;
    width: 8.5em;
    background-color: #fff;
    margin-right: 10px;
    border: 8px solid #F0F0F0;
    border-bottom: none;
    border-radius: 13px 13px 0 0;
    padding: 15px 0.5em;
    text-align: center;
}
.nav-tabs li:last-child a { margin-right: 0; }
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background-color: #F0F0F0!important;
    color: #333;
    border: 8px solid #F0F0F0;
    border-bottom: none;
}
.tab-pane:not(.in) { display: none; }

.tab-wrap {
    padding-top: 6em;
    padding-bottom: 6em;
}
/* time content */
.time-start { margin-bottom: 3rem; }
.dl-time {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
}
.dl-time dt {
    color: #0B53BA;
    font-size: 29px;
    font-weight: bold;
    letter-spacing: 0.02em;
    display: block;
    width: 6em;
}
.dl-time dd {
    flex: 1;
    font-size: 22px;
    font-weight: bold;
    line-height: 1.6;
}
.box-item { margin-bottom: 2.5em; }

/* --- sec03 --- */
.sec03 {
    padding-top: 6rem;
    padding-bottom: 6rem;
}
.pickup-box .img-clip { margin-bottom: 1.5rem; }
.pickup-box p { line-height: 1.6; }

/* --- sec04 --- */
.sec04 {
    padding-top: 3rem;
    padding-bottom: 4rem;
}
.sec04 h2 { margin-bottom: 0.5rem; }



/* --------------------------------------------
    sidebtn
-------------------------------------------- */
.sidebtn {
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 999;
}
.sidebtn a {
    position: relative;
    display: flex;
    flex-flow: column;
    justify-content: center;
    width: 76px;
    height: 76px;
    margin: 0 auto;
    padding: 0;
    border: none;
}
.sidebtn a::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: #333;
    border-radius: 38px;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
    -webkit-transition: width 0.4s, height 0.4s;
    -o-transition: width 0.4s, height 0.4s;
    transition: width 0.4s, height 0.4s;
}
.sidebtn a:hover {
    text-decoration: none;
    outline: none;
}
.sidebtn a:hover::before { width: 68px; height: 68px; }



/* --------------------------------------------
    footer
-------------------------------------------- */
#ft01 {
    color: #fff;
    position: relative;
    z-index: 5;
    background-color:#B1B1B1;
}
.ft-cp {
    font-weight: 500;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-align: center;
    margin: 0 auto;
    padding: 15px;
}

/* --------------------------------------------
    Responsive
-------------------------------------------- */
@media screen and (max-width: 1101px) {
    .sec-inline { padding-inline: calc((100vw - 915px) / 2); }
}
@media screen and (max-width: 991px) {
    h1 { font-size:clamp(38px, 4.8vw, 50px); }
    h2 { font-size: clamp(32px, 4.5vw, 45px); }
    h3, .dl-time dt { font-size: clamp(22px, 3.05vw, 29px); }
    h4, .dl-time dd { font-size: clamp(18px, 2.8vw, 22px); }
    .btn00 a { font-size: 23px; }
    .sec-inline, .ft-wrap  { padding-inline: calc((100vw - 725px) / 2); }
    .sec01::before { width: 40vw; }
    .main-slider { width: 50%; }
    .main-thumbnail-slider { width: 80%; }
    .main-slider .img-clip::before,
    .main-thumbnail-slider .img-clip::before { padding-top: 95%; }
    .sec01-txt { left: 55%; }
    .sec01 .slider-arrows { left: 55%; top: calc(65% - 44px); }
    .sec02 .sec02-hd { width: 96%; margin-left: auto; margin-right: auto; }
    .nav-tabs > li a { font-size: 19px; }
    .tab-pane { width: 96%; margin: 0 auto; }
    .sec03 h2 { width: 96%;  margin-left: auto; margin-right: auto; }
    .pickup-box { width: 96%; margin: 0 auto; }

}
@media screen and (max-width: 767px) {
    html, body { font-size: 16px; }
    .btn00 a { font-size: 20px; }
    .sec-inline, .ft-wrap { padding-inline: calc((100vw - 520px) / 2); }
    .sec01 { margin-top: 10vw; padding-bottom: clamp(180px, 32vw, 13em); }
    .sec01::before { width: clamp(260px, 48vw, 420px); height: 60vw; left: -10%; }
    .main-slider { width: 90%; margin-bottom: 2.94vw; }
    .main-thumbnail-slider { width: 100%; margin-bottom: 4vw; }
    .main-slider .img-clip::before,
    .main-thumbnail-slider .img-clip::before { padding-top: 67%; }
    .sec01-txt, .sec01 .slider-arrows { position: relative; top: 0; left: 0; }
    .sec01 .slider-arrows { width: 90%; margin: 0 auto 5vw; }
    .sec01-txt { width: 90%; max-width: 24em; margin: 0 auto; }
    .sec02 { padding-top: 4rem; }
    .sec02 .sec02-hd { display: block; }
    .sec02-hd .img-bus { max-width: 300px; }
    .sec02-hd h2 { margin-bottom: 1rem; }
    .nav-tabs > li a { font-size: 17px; letter-spacing: 0.05em; width: 7em; border: 6px solid #F0F0F0; border-bottom: none; margin-bottom: -2px; }
    .tab-wrap { padding-top: 3em; padding-bottom: 3em; }
    .sidebtn { bottom: 15px; right: 15px; }
}
@media screen and (max-width: 575px) {
    h1, h2, h3, h4, h5, h6 { letter-spacing: 0.05em; }
    h1 { font-size: 32px; }
    h2 { font-size: 27px; }
    h3, .dl-time dt { font-size: 22px; }
    h4, .dl-time dd { font-size: 18px; }
    .grid2 { grid-template-columns: 1fr; }
    .img-clip { border-radius: 1.2em; }
    .main-slider .img-clip { border-radius: 0 1.2em 1.2em 0; }
    .sec02 .sec02-hd, .sec03 h2,
    .tab-pane, .pickup-box { width: 90%; }
    .nav-tabs > li a { font-size: 14px; letter-spacing: 0.03em; width: 5.8em; border: 5px solid #F0F0F0; margin-bottom: -4px; margin-right: -5px; }
}
@media screen and (max-width: 460px) {
    p { margin-bottom: 1rem; }
    .sec-inline, .ft-wrap { padding-inline: calc((100vw - 315px) / 2); }
    .tit-bd { padding: 5px 1.2rem 9px; }
    .tit-bd-l { line-height: 1.4; padding-left: 12px; }
    .sec03 { padding-top: 12vw; padding-bottom: 12vw; }
    .dl-time { display: block; }
    .pickup-box .img-clip { margin-bottom: 1rem; }
}