@charset "utf-8";

/*-----------------------------フォント*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Zen+Kaku+Gothic+New:wght@300;400;500;700;900&display=swap');/*
*/

/*-----------------------------リセットCSS*/
html {
	box-sizing: border-box;
	-ms-overflow-style: scrollbar;
    overflow-x: hidden;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Remove default padding */

ul[class],
ol[class] {
	padding: 0;
}

/* Remove default margin */

body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul[class],
ol[class],
figure,
blockquote,
dl,
dd {
	margin: 0;
}

/* Set core root defaults */

html {
	scroll-behavior: smooth;
}

/* Set core body defaults */

body {
	min-height: 100vh;
	text-rendering: optimizeSpeed;
	line-height: 100%;
}

/* Remove list styles on ul, ol elements with a class attribute */

ul[class],
ol[class] {
	list-style: none;
    padding: 0;
    margin: 0;
}

ul,
ol {
	list-style: none;
    padding: 0;
    margin: 0;
}

/* A elements that don't have a class get default styles */

a:not([class]) {
	-webkit-text-decoration-skip: ink;
	text-decoration-skip-ink: auto;
}

/* Make images easier to work with */

img {
	max-width: 100%;
	display: block;
}

/* Natural flow and rhythm in articles by default */

article > * + * {
	margin: 0;
}

/* Inherit fonts for inputs and buttons */

input,
button,
textarea,
select {
	font: inherit;
}

/* Blur images when they have no alt attribute */

/* Remove all animations and transitions for people that prefer not to see them */


img {
	height: auto;
}

picture {
    display: block;
}

address,
em {
	font-style: normal;
}

table {
	border-collapse: collapse;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea {
	-webkit-appearance: none;
	border-radius: 0;
}

input[type="search"],
input[type="submit"],
input[type="button"] {
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
	box-sizing: border-box;
	cursor: pointer;
}

input[type="search"]::-webkit-search-decoration,
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
	display: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	clear: both;
	font-weight: normal;
}

/*-----------------------------初期値CSS*/
body {
    font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
    font-weight: 500;
	line-height: 1.8;
    position: relative;
    background: #fff;
    color: #000000;
    overflow-x: hidden;
}

a {
	text-decoration: none;
    color: #000000;
	display: block;
	cursor: pointer;
    -webkit-text-decoration: none;
}

ul {
	margin: 0;
	padding: 0;
}

li {
	list-style: none;
}

.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

a[href*="tel:"] {
    display: inline;
}

/*スマホ時電話リンク*/
@media (min-width: 599px) {
	a[href*="tel:"] {
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	}
}

/*iPhoneで画面サイズに合わせる*/
@supports (-webkit-touch-callout: none) {
    html {
      height: -webkit-fill-available;
    }
    body {
      min-height: 100vh;
      min-height: -webkit-fill-available;
    }
}

@media screen and (max-width: 1023px){

    body {
        font-size: 15px;
    }

    .fs16 {
        font-size: 16px;
    }

}

/*-----------------------------共通CSS*/
.mb16 {
    margin-bottom: 16px;
}

span.kai {
	display: inline-block;
}

.flex {
    display: flex;
    flex-wrap: wrap;
}

.inner,
ul.inner {
    max-width: 1200px;
    width: calc(100% - 32px);
    margin: 0 auto;
    box-sizing: border-box;
}

main.page {
    margin-top: 90px;
}

.sp {
    display: none;
}

.bold {
    font-weight: 700;
}

.yellow {
    color: #F5FF00;
}

.blue {
    color: #13457D;
}

.center {
    text-align: center;
}

/*page*/
.pageSection {
    margin-top: 70px;
    margin-bottom: 145px;
}

.page .section {
    margin-bottom: 80px;
}

.page .sectionMb64 {
    margin-bottom: 64px;
}

.page .sectionMb56 {
    margin-bottom: 56px;
}

.page .sectionMb48 {
    margin-bottom: 48px;
}

/*mainImg*/
.mainImg img {
    margin: 44px auto 48px auto;
}

/*map*/
.map {
    margin: 32px auto 56px auto;
}

.map iframe {
    width: 100%;
    min-height: 230px;
    max-height: 460px;
    height: 61.33333333333333vw;
}

/*card*/
.card img {
    width: 100%;
    max-width: 840px;
}

/*modBtn1,modBtn2*/
.modBtn1,
.modBtn2 {
    width: 90px;
    height: 90px;
}

.modBtn1 a,
.modBtn2 a {
    font-size: 15px;
    line-height: 1.266666666;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: top 6px center;
    background-size: 34px;
    color: #fff;
    transition: .2s;
    padding-top: 42px;
    text-align: center;
}

.modBtn1 a {
    background-image: url(../img/common/icon_06.png);
    background-color: #5DB7E8;
}

.modBtn2 a {
    background-image: url(../img/common/icon_07.png);
    background-color: #13457D;
}

.modBtn1 a:hover,
.modBtn2 a:hover {
    background-color: #323232;
}

.modBtn1 a:hover {
    background-image: url(../img/common/icon_06-hover.png);
}

.modBtn2 a:hover {
    background-image: url(../img/common/icon_07-hover.png);
}

/*modBtn3,modBtn7*/
.modBtn3 {
    width: 100%;
    max-width: 160px;
}

.modBtn7 {
    margin-top: 24px;
    max-width: 347px;
}

.pageAbout .modBtn7 {
    max-width: 366px;
}

.modBtn3.center {
    margin-left: auto;
    margin-right: auto;
}

.modBtn3.right {
    margin-left: auto;
}

.modBtn3 a {
    position: relative;
    height: 41px;
    width: 100%;
    border-radius: 50px;
    overflow: hidden;
    background-color: #F5F5F5;
    display: flex;
    align-items: center;
    transition: .2s;
    text-align: left;
}

.modBtn7 a {
    height: 56px;
}

.modBtn3.white a {
    background-color: #fff;
}

.modBtn3.border {
    position: relative;
    height: 41px;
    width: 100%;
    border-radius: 100px;
    overflow: hidden;
    border: 1px solid #fff;
    display: flex;
    align-items: center;
    transition: .2s;
    text-align: left;
    margin-top: 31px;
}

.modBtn3 a:hover {
    background-color: #323232;
}

.modBtn3 a .btnInner,
.modBtn3.border .btnInner {
    display: block;
    width: 100%;
    position: relative;
    font-size: 13px;
    background: url(../img/common/icon-right.svg) no-repeat center right 17px;
    background-size: 24px;
    padding-left: 17px;
    transition: .2s;
}

.modBtn7 a .btnInner {
    font-size: 16px;
}

.modBtn3.border .btnInner {
    color: #fff;
}

.modBtn3 a:hover .btnInner {
    color: #fff;
    background-image: url(../img/common/icon-right-hover.svg);
}

.bannerTop .box:hover .btnInner {
    background-image: url(../img/common/icon-right-yellow.svg);
}

/*modBtn4*/
.modBtn4 {
    width: 100%;
    margin: 13px 0;
}

.modBtn4 a {
    position: relative;
    height: 80px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .2s;
    background: url(../img/common/icon-right-white.svg) no-repeat center right 30px;
    background-size: 24px;
    background-color: #5DB7E8;
}

.modBtn4 a:hover {
    background-image: url(../img/common/icon-right-hover.svg);
    background-color: #323232;
}

.modBtn4 a .btnInner {
    position: relative;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    padding: 0 73px;
    display: block;
    background: url(../img/common/icon-flight.png) no-repeat center left 30px;
    background-size: 34px;
    transition: .2s;
}

.modBtn4 a:hover .btnInner {
    background-image: url(../img/common/icon-flight-hover.png);
}

/*modBtn5*/
.modBtn5List {
    justify-content: space-between;
    column-gap: min(20px,1.4285714285714286vw);
}

.modBtn5 {
    width: calc(100% / 4 - min(15px,1.0714285714285714vw));
    height: 106px;
}

.modBtn5 a {
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-position: top 16px center;
    background-size: 50px;
    color: #fff;
    transition: .2s;
    padding-top: 70px;
    text-align: center;
}

.modBtn5.bus a,
.modBtn5.car a,
.modBtn5.rentalCar a,
.modBtn5.taxi a {
    background-color: #13457D;
}

.modBtn5.bus a {
    background-image: url(../img/top/bus.png);
    background-color: #13457D;
}

.modBtn5.car a {
    background-image: url(../img/top/car.png);
}

.modBtn5.rentalCar a {
    background-image: url(../img/top/rental-car.png);
}

.modBtn5.taxi a {
    background-image: url(../img/top/taxi.png);
}

.modBtn5.bus a:hover,
.modBtn5.car a:hover,
.modBtn5.rentalCar a:hover,
.modBtn5.taxi a:hover {
    background-color: #323232;
}

.modBtn5.bus a:hover {
    background-image: url(../img/top/bus-hover.png);
}

.modBtn5.car a:hover {
    background-image: url(../img/top/car-hover.png);
}

.modBtn5.rentalCar a:hover {
    background-image: url(../img/top/rental-car-hover.png);
}

.modBtn5.taxi a:hover {
    background-image: url(../img/top/taxi-hover.png);
}

/*modBtn6*/
.modBtn6 a {
    position: relative;
    height: 64px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .2s;
    background: url(../img/common/icon-right-white.svg) no-repeat center right 20px;
    background-size: 24px;
    background-color: #5DB7E8;
}

.modBtn6 a:hover {
    background-image: url(../img/common/icon-right-hover.svg);
    background-color: #323232;
}

.modBtn6 a .btnInner {
    position: relative;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    padding: 0 50px;
    display: block;
}

/*sectionTitle*/
.sectionTitle {
    position: relative;
}

.sectionTitle .title {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    padding: 1px 22px 2px 22px;
    background-color: #fff;
    border-radius: 100px;
    color: #13457D;
    display: inline-block;
    margin-bottom: 15px;
}

.sectionTitle .title.icon {
    background-repeat: no-repeat;
    background-position: center left 16px;
    background-size: 27px;
    padding-left: 46px;
}

.flowTop .sectionTitle .title.icon {
    background-image: url(../img/top/beginner.png);
}

.campaignTop .sectionTitle .title.icon {
    background-image: url(../img/top/person.png);
}

.sectionTitle .ja {
    font-size: 28px;
    font-weight: 700;
}

.sectionTitle .en {
    font-family: "Roboto", serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
    color: #5DB7E8;
}

.sectionTitle.white,
.sectionTitle.white .en {
    color: #fff;
}

/*subTitle*/
.subTitle {
    font-weight: 700;
    font-size: 18px;
    line-height: 1.666666666;
    padding-left: 30px;
    background: url(../img/common/subTitle.svg) no-repeat center left;
    background-size: 22px;
    color: #F5711E;
    margin-bottom: 10px;
}

/*タイトル*/
.content h2 {
    position: relative;
    font-size: 30px;
    font-weight: 600;
    padding-bottom: 12px;
    margin-bottom: 44px;
    line-height: 1.4;
    border-bottom: 2px solid #CCCCCC;
}

.content h2::before {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 64px;
    height: 2px;
    background-color: #5DB7E8;
}

.content h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.4;
    padding: 15px 14px;
    background-color: #F5F5F5;
    margin-bottom: 36px;
    border-bottom: 2px solid #5DB7E8;
    margin-top: 48px;
}

.content h4 {
    position: relative;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.4;
    padding-left: 32px;
    margin-bottom: 24px;
    margin-top: 32px;
}

.content h4::before {
    content: "";
    position: absolute;
    top: 6px;
    left: 0;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background-color: #EAF4FF;
    border: 5px solid #5DB7E8;
}

.content h5 {
    position: relative;
    font-size: 19px;
    font-weight: 600;
    padding-left: 24px;
    margin-top: 40px;
    margin-bottom: 12px;
}

.content h5::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    width: 12px;
    height: 12px;
    background: #13457D;
}

.content h5::after {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    width: 6px;
    height: 12px;
    background: #5DB7E8;
}

/*link*/
.link {
    display: inline;
    color: #13457D;
    text-decoration: underline;
}

.link:hover {
    text-decoration: none;
}

/*ol*/
.content ol {
    counter-reset: item;
    margin: 14px 0 20px 0;
}

.content ol li {
    position: relative;
    text-indent: -1.0em;
    padding-left: 20px;
    margin-bottom: 3px;
}

.content ol li::before {
    counter-increment: item;
    content: counter(item)'.';
    padding-right: .5em;
}

/*ul*/
.content ul {
    margin-top: 16px;
}

.content ul li {
    position: relative;
    padding-left: 22px;
}

.content ul li::before {
    content: "・";
    position: absolute;
    top: 0;
    left: 0;
}

/*documentList*/
.documentList {
    display: flex;
    flex-direction: column;
    row-gap: 12px;
}

.modBtnDocument,
.content ul .modBtnDocument {
    position: relative;
    padding-left: 31px;
}

.modBtnDocument::before,
.content ul .modBtnDocument::before {
    content: "";
    position: absolute;
    top: 1px;
    left: 0;
    width: 19px;
    height: 26px;
    background-repeat: no-repeat;
    background-size: 19px;
    background-position: center;
}

.modBtnDocument.pdf::before {
    background-image: url(../img/common/pdf.png);
}

.modBtnDocument.xlsx::before {
    background-image: url(../img/common/xlsx.png);
}

.modBtnDocument a,
.content ul .modBtnDocument a {
    display: inline-block;
    text-decoration: underline;
}

.modBtnDocument a:hover,
.content ul .modBtnDocument a:hover {
    color: #13457D;
}

/*pageMv*/
.pageMv {
    height: 200px;
    background: url(../img/common/page-bg-pc.jpg) no-repeat center;
    background-size: cover;
    margin-bottom: 15px;
}

.pageMv .inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

.pageMv .sub {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    padding: 3px 0 5px 40px;
    background-repeat: no-repeat;
    background-size: 34px;
    background-position: center left;
}

.pageMv .sub.subFlight {
    background-image: url(../img/common/sub-flight.png);
}

.pageMv .sub.subCampaign {
    background-image: url(../img/common/sub-campaign.png);
}

.pageMv .title {
    font-size: 35px;
    font-weight: 700;
    line-height: 1.5;
    color: #fff;
}

/*パンくず*/
ul.breadcrumb {
    column-gap: 23px;
    margin: 0 auto;
}

.breadcrumb li {
    position: relative;
    font-size: 13px;
    font-weight: 400;
    color: #333;
}

.breadcrumb li:not(:last-of-type)::before {
    content: "＞";
    position: absolute;
    top: 0;
    right: -20px;
}

.breadcrumb li a {
    text-decoration: underline;
    color: #333;
}

.breadcrumb li a:hover {
    opacity: .7;
    text-decoration: none;
}

/*table*/
.table,
.table th,
.table td {
	border-collapse: collapse;
}

.table {
    width: 100%;
}

/*table1*/
.table1 tr {
    border-left: 1px solid #ccc;
}

.table1 th,
.table1 td {
    text-align: center;
    vertical-align: middle;
    padding: 10px 0;
    border-right: 1px solid #ccc;
    width: calc(100% / 5);
}

.table1 th {
    font-weight: 600;
    line-height: 1.4;
	background-color: #13457D;
    color: #fff;
    padding: 13px 0;
}

.table1 .bg {
    background-color: #EAF4FF;
}

/*table2*/
.table2 {
    margin-top: 24px;
}

.table2 tr {
    width: 50%;
    align-items: center;
}

.table2 .th,
.table2 .td {
    width: 50%;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.788888888;
    padding: 23px 10px;
    text-align: center;
    display: flex;
    justify-content: center;
}

.table2 .th {
    background-color: #EAF4FF;
}

.table2 .td {
    background-color: #13457D;
    color: #fff;
}

/*table3*/
.table3 {
    border-top: 1px solid #707070;
    margin-top: 24px;
}

.table3 th,
.table3 td {
    border-bottom: 1px solid #707070;
    text-align: left;
    vertical-align: middle;
}

.table3 th {
    font-weight: bold;
	background: #F5F5F5;
    width: 27.5%;
    padding: 27px 20px;
    min-width: 288px;
}

.table3 td {
    width: 72.5%;
    padding: 27px 20px;
}

@media screen and (max-width: 1023px){

    .mb16 {
        margin-bottom: 12px;
    }

    .innerTablet {
        max-width: 568px;
    }

    main.page {
        margin-top: 60px;
    }

    .pageSection {
        margin-top: 38px;
        margin-bottom: 84px;
    }

    .page .section {
        margin-bottom: 56px;
    }

    .page .sectionMb64 {
        margin-bottom: 40px;
    }

    .page .sectionMb56,
    .page .sectionMb48 {
        margin-bottom: 32px;
    }

    /*mainImg*/
    .mainImg img {
        margin: 32px auto 32px auto;
    }

    /*modBtn1,modBtn2*/
    .modBtn1,
    .modBtn2 {
        width: 100%;
        height: auto;
    }

    .modBtn1 a,
    .modBtn2 a {
        background-position: center left 20px;
        padding: 16.5px 0;
    }
    
    /*modBtn4*/
    .modBtn4 {
        margin: 0;
    }

    .modBtn4 a {
        height: 56px;
        background-position: center right 12px;
        background-size: 22px;
    }

    .modBtn4 a .btnInner {
        font-size: 18px;
        padding: 0 32px;
        background-position: center left;
        background-size: 26px;
    }

    /*modBtn5*/
    .modBtn5List {
        justify-content: space-between;
        column-gap: 6px;
    }

    .modBtn5 {
        width: calc(100% / 4 - 5px);
        height: 73px;
    }

    .modBtn5 a {
        font-size: 13px;
        background-position: top 9px center;
        background-size: 36px;
        padding-top: 48px;
    }

    /*modBtn6*/
    .modBtn6 a {
        height: 48px;
    }

    .modBtn6 a:hover {
        background-image: url(../img/common/icon-right-white.svg);
        background-color: #5DB7E8;
    }

    .modBtn6 a .btnInner {
        font-size: 15px;
    }

    /*sectionTitle*/
    .sectionTitle .title {
        font-size: 17px;
        padding: 1px 18px 3px 18px;
        margin-bottom: 10px;
    }

    .sectionTitle .title.icon {
        background-position: center left 18px;
        padding-left: 48px;
    }

    .sectionTitle .ja {
        font-size: 24px;
    }

    .sectionTitle .en {
        font-size: 12px;
    }

    /*subTitle*/
    .subTitle {
        font-size: 13px;
        padding-left: 22px;
        background-size: 16px;
        margin-bottom: 6px;
    }

    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    /*タイトル*/
    .content h2 {
        font-size: 27px;
        margin-bottom: 32px;
        line-height: 1.451851851;
    }

    .content h3 {
        font-size: 20px;
        padding: 11.5px 12px;
        margin-bottom: 24px;
        margin-top: 40px;
    }

    .index .content h3 {
        font-size: 18px;
    }
    
    .content h4 {
        font-size: 19px;
        padding-left: 26px;
        margin-bottom: 12px;
    }

    .content h4::before {
        top: 5px;
        width: 18px;
        height: 18px;
    }

    .content h5 {
        font-size: 18px;
        padding-left: 18px;
        margin-top: 32px;
    }
    
    .content h5::before {
        top: 13px;
        width: 10px;
        height: 10px;
    }

    .content h5::after {
        top: 13px;
        width: 4px;
        height: 10px;
    }

    /*table2*/
    .table2 .th,
    .table2 .td {
        font-size: 15px;
    }

    /*documentList*/
    .documentList {
        row-gap: 4px;
    }

    .modBtnDocument,
    .content ul .modBtnDocument {
        padding-left: 24px;
    }

    .modBtnDocument::before,
    .content ul .modBtnDocument::before {
        top: 2px;
        width: 16px;
        height: 23px;
        background-size: 16px;
    }

}

@media screen and (max-width: 599px){

    /*pageMv*/
    .pageMv {
        height: 180px;
        background-image: url(../img/common/page-bg-sp.jpg);
    }

    .pageMv .sub {
        font-size: 15px;
        padding: 5px 0 4px 36px;
        background-size: 30px;
    }

    .pageMv .title {
        font-size: 28px;
    }

    /*modBtn6*/
    .modBtn6 a {
        background-position: center right 12px;
        background-size: 22px;
        justify-content: flex-start;
    }

    .modBtn6 a .btnInner {
        padding: 0 10px;
    }

    /*table1*/
    .table1 th,
    .table1 td {
        padding: 8px 0;
        width: auto;
        font-size: 13px;
    }

    .table1 th {
        padding: 6px 0;
    }

    .table1 th:nth-child(2) {
        width: 52px;
    }

    .table1 .kai {
        display: block;
    }

    /*table2*/
    .table2 tr {
        width: 100%;
    }

    .table2 .th,
    .table2 .td {
        width: 100%;
        padding: 0 16px;
        height: 80px;
        text-align: left;
        justify-content: flex-start;
    }

    /*table3*/
    .table3 {
        margin-top: 16px;
    }

    .table3 tr {
        border-bottom: 1px solid #707070;
    }

    .table3 th,
    .table3 td {
        display: block;
        border-bottom: none;
        padding: 25px 10px;
        width: 100%;
        min-width: auto;
    }

    .table3 th {
        padding: 17px 10px;
    }

    /*mainImg*/
    /*card*/
    #bus .mainImg img,
    .card img {
        width: 100%;
        max-width: 343px;
    }

    /*modBtn3,modBtn7*/
    .modBtn3 {
        max-width: 138px;
        margin-left: auto;
    }

    .modBtn7 {
        max-width: 330px;
        margin-right: auto;
    }

    .pageAbout .modBtn7 {
        max-width: 297px;
    }

    .modBtn3.border {
        margin-top: 16px;
    }

    .modBtn3 a,
    .modBtn3.border {
        height: 36px;
    }

    .modBtn7 a {
        height: auto;
        min-height: 46px;
    }

    .modBtn3 a .btnInner,
    .modBtn3.border .btnInner {
        background-position: center right 13px;
        background-size: 22px;
        padding-left: 15px;
    }

    .modBtn7 a .btnInner {
        font-size: 15px;
        background-position: center right 19px;
        padding: 8px 51px 9px 19px;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

ヘッダー

--------------------------------------------------------------------------------------------------------------------*/
.header {
	position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #fff;
    z-index: 500;
    height: 90px;
    width: 100%;
    transition: .2s;
    justify-content: flex-end;
}

/*-----------------------------左ロゴ*/
.header .logo {
    position: absolute;
    top: 50%;
    left: min(40px,2.857142857142857vw);
    transform: translateY(-50%);
    margin: auto;
    width: 24%;
}

.header .logo a {
    transition: .2s;
}

.header .logo a:hover {
    opacity: .5;
}

.header .logo a img {
    width: 100%;
    max-width: 338px;
}

.header .logo a .text {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
  
/*-----------------------------メニュー*/
.header .nav {
    justify-content: flex-end;
}

/*navBtnBox*/
.header .navBtnBox {
    width: 180px;
}

/*navListBox*/
.header .navListBox {
    margin-right: 15px;
}

.header .navListBox li {
    position: relative;
    display: flex;
}

.header .navListBox li .main {
    position: relative;
    height: 100%;
    padding: 50px 15px 0 15px;
    text-align: center;
    transition: .2s;
    background-repeat: no-repeat;
    background-position: top 16px center;
    background-size: 34px;
}

.header .navListBox li:nth-child(1) .main {
    background-image: url(../img/common/icon_01.png);
}

.header .navListBox li:nth-child(2) .main {
    background-image: url(../img/common/icon_02.png);
}

.header .navListBox li:nth-child(3) .main {
    background-image: url(../img/common/icon_03.png);
}

.header .navListBox li:nth-child(4) .main {
    background-image: url(../img/common/icon_04.png);
}

.header .navListBox li:nth-child(5) .main {
    background-image: url(../img/common/icon_05.png);
}

.header .navListBox li:hover .main {
    color: #5DB7E8;
}

.header .navListBox li:hover:nth-child(1) .main {
    background-image: url(../img/common/icon_01-hover.png);
}

.header .navListBox li:hover:nth-child(2) .main {
    background-image: url(../img/common/icon_02-hover.png);
}

.header .navListBox li:hover:nth-child(3) .main {
    background-image: url(../img/common/icon_03-hover.png);
}

.header .navListBox li:hover:nth-child(4) .main {
    background-image: url(../img/common/icon_04-hover.png);
}

.header .navListBox li:hover:nth-child(5) .main {
    background-image: url(../img/common/icon_05-hover.png);
}

.header .navListBox a {
    position: relative;
}

/*ドロップダウン*/
.header .nav .subMenu {
    width: 100%;
    position: absolute;
    top: 85px;
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    transition: .2s;
    background: #F5F5F5;
    height: auto;
    border-radius: 5px;
    opacity: 0;
    pointer-events: none;
    padding: 15px 0 15px 20px;
}

.header .nav .subMenu1 {
    width: 174px;
}

.header .nav .subMenu2 {
    width: 220px;
}

.header .nav .subMenu3 {
    width: 173px;
}

.header .nav .subMenu4 {
    width: 260px;
}

.header .navListBox li.sub:hover .subMenu {
	opacity: 1;
    z-index: 1;
    pointer-events: all;
}

.subMenu li {
    display: block;
}

.subMenu li a {
    position: relative;
    font-size: 15px;
    padding: 5px 0 5px 14px;
    line-height: 1.4444444;
}

.subMenu li:first-child a {
    border-top: none;
}

.subMenu li a:hover {
    color: #5DB7E8;
}

.subMenu li a::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    margin: auto;
    width: 10px;
    height: 2px;
    border-radius: 6px;
    background-color: #5DB7E8;
}

@media screen and (max-width: 1023px){

    .header {
        height: 60px;
    }    

    .header .nav {
        display: none;
    }

    .header .logo {
        left: 16px;
        width: 100%;
    }
    
    .header .logo a img {
        max-width: 100%;
        width: 244px;
    }

    .navBtnBox {
        flex-direction: column;
        row-gap: 12px;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

ハンバーガーメニュー

--------------------------------------------------------------------------------------------------------------------*/
.hamburger {
	display: none;
}

/*----------------------------------------------------------------------三本ライン*/
.hamburger .line {
    position: fixed;
    top: 0;
    right: 0;
    display: flex;
    height: 60px;
    width: 60px;
    justify-content: center;
    align-items: center;
    z-index: 999999;
	cursor: pointer;
    background-color: #5DB7E8;
}

.hamburger .line::before {
    content: "Menu";
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    padding-top: 30px;
}

.hamburger .line.is-activeLine::before {
    content: "Close";
}

.hamburger .line span,
.hamburger .line span:before,
.hamburger .line span:after {
    content: '';
    display: block;
    height: 2px;
    width: 30px;
    background-color: #fff;
    position: absolute;
}

.hamburger .line span {
    top: 21px;
    right: 15px;
}

/*.line1*/
.hamburger .line span.line1:before {
    bottom: 8px;
    left: 0;
}

.hamburger .line span.line1:after {
    top: 8px;
    left: 0;
}

/*open*/
.hamburger .line.is-activeLine span.line1 {
    background-color: rgba(255, 255, 255, 0);/*メニューオープン時は真ん中の線を透明にする*/
}

.hamburger .line.is-activeLine span.line1::before {
    bottom: 0;
    width: 30px;
    transform: rotate(45deg);
}

.hamburger .line.is-activeLine span.line1::after {
    top: 0;
    width: 30px;
    transform: rotate(-45deg);
}

/* アニメーション前のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: auto;
    opacity: 1;
}

/* アニメーション後のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: none;
    opacity: 0;
}

.hamburger .line.is-activeLine span.line1 {
    pointer-events: none;
    opacity: 0;
}

/* アニメーション後のメニューの状態 */
.hamburger .line.is-activeLine span.line1 {
    pointer-events: auto;
    opacity: 1;
}

@media screen and (max-width: 1023px){

	.hamburger {
		display: block;
	}
		
}

/*-----------------------------------------------------------------------中のメニュー*/
.hamburger .menu {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box; /* 追加 */
    z-index: 80;
    background: #F7F6F2;
    padding: 78px 0 83px 0;
}

.hamburger .menu ul.menuList {
    margin-bottom: 18px;
    display: flex;
    flex-direction: column;
    row-gap: 12px;
    margin-bottom: 16px;
} 

.hamburger .menu ul.menuList .main {
    font-weight: 700;
    position: relative;
    width: 100%;
    padding: 12.5px 0 0 44px;
    background-repeat: no-repeat;
    background-position: top 9px left;
    background-size: 34px;
    background-color: #fff;
} 

.hamburger .menu ul.menuList li:nth-child(1) .main {
    background-image: url(../img/common/icon_01.png);
}

.hamburger .menu ul.menuList li:nth-child(2) .main {
    background-image: url(../img/common/icon_02.png);
}

.hamburger .menu ul.menuList li:nth-child(3) .main {
    background-image: url(../img/common/icon_03.png);
}

.hamburger .menu ul.menuList li:nth-child(4) .main {
    background-image: url(../img/common/icon_04.png);
}

.hamburger .menu ul.menuList li:nth-child(5) .main {
    background-image: url(../img/common/icon_05.png);
}

/*動き*/
/* アニメーション前のメニューの状態 */
.hamburger .menu {
    pointer-events: none;
    opacity: 0;
    transition: .2s;
    background-color: #F5F5F5;
}

/* アニメーション後のメニューの状態 */
.hamburger .menu.is-active {
    pointer-events: auto;
    opacity: 1;
}

/*---------------アコーディオン*/
.hamburger .menu ul.menuList > li {
    position: relative;
    background-color: #fff;
    padding: 0 20px 12.5px 20px;
}

.hamburger .menu ul.menuList li .toggleBtn {
    display: block;
    position: absolute;
    top: 16px;
    cursor: pointer;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    right: 20px;
    background-image: url(../img/common/icon_bottom-white.svg);
    background-repeat: no-repeat;
    background-position: top 8px center;
    background-size: 8px;
    background-color: #5DB7E8;
}

.hamburger .child {
	display: none;
}

.hamburger .menu ul.menuList li .toggleBtn.toggleBtn.is-active { /* アイコン縦棒なし（開いてるとき） */
    background-image: url(../img/common/icon_top-white.svg);
    background-position: top 7px center;
}

.hamburger .subMenu {
    background: #F5F5F5;
    padding: 15px 0 15px 20px;
    margin: 13px 0 6px 0;
}

/*btnrecruitTop*/
.btnRecruit {
    margin-bottom: 14px;
}

.btnRecruit a {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 44px;
    border-radius: 22px;
    background-color: #147DE1;
    text-align: center;
}

.btnRecruit a .btnInner {
    position: relative;
    font-size: 16px;
    font-weight: 700;
    padding-left: 25px;
    color: #fff;
    display: inline-block;
    background: url(../img/common/recruit.png) no-repeat center left;
    background-size: 17px;
}

/*btnContact*/
.btnContact {
    margin-bottom: 14px;
}

.btnContact a {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 44px;
    border-radius: 22px;
    background-color: #F5911E;
    text-align: center;
}

.btnContact a .btnInner {
    position: relative;
    font-size: 16px;
    font-weight: 700;
    padding-left: 28px;
    color: #fff;
    display: inline-block;
    background: url(../img/common/contact.png) no-repeat center left;
    background-size: 20px;
}

/*btnCompany*/
.btnCompany {
    text-align: right;
}

.btnCompany a {
    display: inline-block;
    font-size: 15px;
    font-weight: 700;
    color: #0E3B73;
    padding: 10px 12px 4px 42px;
    background-image: url(../img/common/company.png), url(../img/common/icon-right-link.svg);
    background-repeat: no-repeat, no-repeat;
    background-size: 40px, 5px;
    background-position: center left, top 20px right;
}

/*--------------------------------------------------------------------------------------------------------------------

フッター
--------------------------------------------------------------------------------------------------------------------*/
.footer {
    position: relative;
    padding-top: 3.9vw;
    background-image: url(../img/common/oki-islands-global-geopark-airport.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: top center;
}

.index .footer {
    background-color: #F5F5F5;
}

/*footer-top*/
.footer .top {
    background-color: #5DB7E8;
    padding: 59px 0 70px 0;
}

.footer .top .inner {
    max-width: 860px;
    text-align: center;
}

.footer .top .text {
    margin: 19px 0 40px 0;
    color: #fff;
}

.footer .top .telBox {
    justify-content: space-between;
    column-gap: 36px;
    row-gap: 16px;
}

.footer .top .telBox .box {
    width: calc(100% / 2 - 18px);
    background-color: #fff;
    border-radius: 10px;
    padding: 28px 0 30px 0;
    text-align: center;
}

.footer .top .telBox .box .title {
    font-size: 18px;
    font-weight: 700;
    padding: 1px 22px 2px 22px;
    border-radius: 50px;
    color: #fff;
    display: inline-block;
}

.footer .top .telBox .box1 .title {
    background-color: #5DB7E8;
}

.footer .top .telBox .box2 .title {
    background-color: #13457D;
}

.footer .top .telBox .box .tel a {
    font-family: "Roboto", serif;
    font-weight: 700;
    font-size: 34px;
    line-height: 1;
    display: inline-block;
    padding-left: 34px;
    margin: 16px 0 3.5px 0;
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 34px;
}

.footer .top .telBox .box1 .tel a {
    background-image: url(../img/common/icon_tel_01.png);
}

.footer .top .telBox .box2 .tel a {
    background-image: url(../img/common/icon_tel_02.png);
}

.footer .top .telBox .box .cm {
    font-size: 13px;
}

/*footer-bottom*/
.footer .bottom {
    position: relative;
    background-color: #F5F5F5;
}

.footer .bottom .inner {
    max-width: 1224.5px;
}

/*logoBox*/
.footer .bottom .logoBox {
    padding: 50px 0 30px 0;
    justify-content: center;
    align-items: center;
    column-gap: 30px;
    row-gap: 10px;
}

.footer .bottom .logoBox .logo {
    font-size: 24px;
    font-weight: 700;
    padding: 9px 0 11px 72px;
    background: url(../img/common/image-character.png) no-repeat center left;
    background-size: 56.72px;
    transition: .2s;
}

.footer .bottom .logoBox .logo:hover {
    opacity: .5;
}

.footer .bottom .logoBox .text {
    font-size: 14px;
}

/*menuBox*/
.footer .menuBox {
    justify-content: space-between;
    border-top: 1px solid #CCD0DB;
    border-bottom: 1px solid #CCD0DB;
    padding: 30px 0;
    row-gap: 30px;
}

.footer .menuBox .menuList {
    padding: 0 13px;
}

.footer .menuBox .menuList:last-child {
    display: flex;
    align-items: flex-end;
    max-height: 110px;
}

.footer .menuBox .menuList .main {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 14px;
}

.footer .menuBox .menuList .sub .main {
    margin-bottom: 3px;
}

.footer .menuBox .menuList .subMenu li a {
    font-size: 13px;
    padding: 4px 0 4px 14px;
}

.footer .menuBox .menuList .subMenu li a::before {
    top: 13px;
    transform: none;
    margin: 0;
}

.footer .menuBox .menuList a.main:hover {
    color: #5DB7E8;
}

/*bannerBox*/
.footer .bannerBox {
    padding: 30px 0;
    column-gap: 30px;
    row-gap: 5px;
    justify-content: center;
}

.footer .bannerBox a {
    position: relative;
}

.footer .bannerBox a img {
    position: relative;
    transition: .2s;
}

.footer .bannerBox a:hover img {
    opacity: .5;
}

.footer .bannerBox li a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    transition: .2s;
}

/*copy*/
.footer .copy {
    font-family: "Roboto", serif;
    font-size: 13px;
    font-weight: 400;
    background-color: #323232;
    color: #fff;
    padding: 20px 0;
    text-align: center;
}

.footer .copy .inner {
    display: block;
}

/*pageTop*/
.footer .pageTopInner {
   position: fixed;
   bottom: 40px;
   right: 40px;
   z-index: 10;
}

.footer .pageTop {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 26px;
    height: 95px;
    font-family: "Roboto", sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 26px;
    writing-mode: vertical-rl;
    transition: .2s;
    background-image: url(../img/common/icon_page-top.svg);
    background-repeat: no-repeat;
    background-size: 8.27px;
    background-position: top 11px center;
    padding-top: 28px;
    background-color: #fff;
    border-radius: 50px;
    color: #323232;
    cursor: pointer;
}

.pageTop {
    opacity: 0;
    visibility: hidden; /* 非表示時はフォーカスやクリックを無効化 */
    transition: opacity 0.3s ease, visibility 0.3s ease;
}
  
.pageTop.show {
    opacity: 1;
    visibility: visible; /* 表示時はクリック可能に */
}
  
.footer .pageTop:hover {
    background-color: #323232;
    color: #fff;
}

@media screen and (max-width: 1023px){

    /*copy*/
    .footer .copy {
        font-size: 12px;
        line-height: 1.583333333;
        padding: 17px 0;
    }

    /*footer-top*/
    .footer .top .inner {
        max-width: 100%;
    }

    .footer .top .telBox {
        column-gap: 16px;
    }

    .footer .top .telBox .box {
        width: calc(100% / 2 - 8px);
    }

    .footer .top .telBox .box .title {
        font-size: min(17px, 2.4vw);
    }

    /*footer-bottom*/
    .footer .logoBox .sp {
        display: none;
    }

    .footer .menuBox .menuList {
        width: calc(100% / 3);
    }

    /*pageTop*/
    .footer .pageTopInner {
        bottom: 57px;
        right: 19px;
    }

    .footer .pageTop {
        width: 24px;
        height: 89px;
        font-size: 12px;
        line-height: 24px;
        padding-top: 25px;
    }  

    .footer .pageTop:hover {
        background-color: #fff;
        color: #323232;
    }

}

@media screen and (max-width: 709px){
    
    .footer .bottom .logoBox .text {
        text-align: center;
    }

}

@media screen and (max-width: 599px){

    .footer {
        padding-top: 27.3vw;
        background-image: url(../img/common/oki-islands-global-geopark-airport-sp.svg);
    }

    /*footer-top*/
    .footer .top {
        padding: 41px 0 50px 0;
    }

    .footer .top .text {
        margin: 12px 0 31px 0;
    }

    .footer .top .telBox .box {
        width: 100%;
        padding: 21px 0 17px 0;
    }

    .footer .top .telBox .box .title {
        font-size: 17px;
        padding: 2px 28px 2.5px 28px;
    }

    /*footer-bottom*/
    /*logoBox*/
    .footer .bottom .logoBox {
        padding: 30px 0;
        border-bottom: 1px solid #CCD0DB;
    }

    .footer .bottom .logoBox .logo {
        font-size: 21px;
        padding: 9px 0 11px 64px;
        background: url(../img/common/image-character.png) no-repeat center left;
        background-size: 50.39px;
    }

    .footer .bottom .logoBox .text {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .footer .bottom .logoBox .sp {
        display: block;
        width: 100%;
        text-align: center;
    }

    .footer .bottom .logoBox .subMenu li a {
        display: inline-block;
        font-size: 13px;
    }

    /*menuBox*/
    .footer .menuBox {
        display: none;
    }

    /*bannerBox*/
    .footer .bannerBox li {
        width: 100%;
        text-align: center;
    }

    .footer .bannerBox li a {
        display: inline-block;
    }

}

/*--------------------------------------------------------------------------------------------------------------------

共通

--------------------------------------------------------------------------------------------------------------------*/
/*linkBox*/
.linkBox {
    position: relative;
    column-gap: 40px;
    max-width: 724px;
    margin-left: auto;
    margin-right: auto;
}

.linkBox .modBtn6 {
    width: calc(100% / 2 - 20px);
}

@media screen and (max-width: 1023px) {

    .linkBox {
        column-gap: 13px;
    }

    .linkBox .modBtn6 {
        width: calc(100% / 2 - 6.5px);
    }
    
}

/*--------------------------------------------------------------------------------------------------------------------

トップページ

--------------------------------------------------------------------------------------------------------------------*/
/*-----------------------------MV*/
.mv {
    position: relative;
    min-height: 680px;
    height: 48.57142857142857vw;
}

.mv .textBox {
    position: absolute;
    top: calc(50% - min(11px,0.7857142857142858vw));
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    margin: auto;
    width: 504px;
    height: 150px;
    z-index: 10;
}

.mv .mvSwiper {
    z-index: 9;
    height: 100%;
}

.mv .mvSwiper .swiper-slide img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.mv .mvSwiper .swiper-pagination {
    bottom: max(129px,9.214285714285714vw);
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    text-align: left;
    width: calc(100% - 176px);
}

.mv .mvSwiper .swiper-pagination .swiper-pagination-bullet {
    display: block;
    width: 2px;
    height: 20px;
    background-color: #fff;
    opacity: 1;
    border-radius: 0;
    margin-top: 4px;
    transition: .5s;
}

.mv .mvSwiper .swiper-pagination .swiper-pagination-bullet-active {
    position: relative;
}

.mv .mvSwiper .swiper-pagination .swiper-pagination-bullet-active {
    background-color: #F5FF00;
}

@media screen and (max-width: 1023px){

    .mv {
        min-height: 510px;
        height: 136vw;
        max-height: 680px;
    }
    
    .mv .textBox {
        min-width: 282px;
        width: 75.2vw;
        max-width: 504px;
        max-height: 150px;
        min-height: 84px;
        height: 22.400000000000002vw;
    }

    .mv .mvSwiper .swiper-pagination {
        bottom: min(109px,29.06666666666667vw);
        width: calc(100% - 32px);
    }

    .mv .mvSwiper .swiper-pagination .swiper-pagination-bullet {
        height: 13px;
        margin-top: 3px;
    }

}

/*topMenu*/
.topMenu {
    position: relative;
    background-color: #F5F5F5;
    padding: 206px 0 42px 0;
}

/*mapService*/
.mapService .box {
    width: 50%;
    border-right: 1px solid #CCD0DB;
    text-align: center;
}

.mapService .box1  {
    border-left: 1px solid #CCD0DB;
}

.mapService .box a {
    padding: 34px 0 37px 140px;
    display: inline-block;
    text-align: left;
    background-repeat: no-repeat, no-repeat;
    background-position: center left 31px, center right 30px;
    background-size: 90px, 24px;
}

.mapService .box1 a {
    background-image: url(../img/top/floor-map.png), url(../img/common/icon-right.svg);
    padding-right: 90px;
}

.mapService .box1 a:hover {
    background-image: url(../img/top/floor-map.png), url(../img/common/icon-right-hover.svg);
}

.mapService .box2 a {
    background-image: url(../img/top/service.png), url(../img/common/icon-right.svg);
    padding-right: 70px;
}

.mapService .box2 a:hover {
    background-image: url(../img/top/service.png), url(../img/common/icon-right-hover.svg);
}

.mapService .box a:hover .ja {
    color: #5DB7E8;
}

.mapService .box a:hover .en {
    color: #13457D;
}

/*infoAccess*/
.infoAccess {
    position: absolute;
    top: -94px;
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    justify-content: space-between;
    column-gap: 36px;
    row-gap: 16px;
    z-index: 1;
}

.infoAccess .box {
    position: relative;
    width: calc(50% - 18px);
    background-color: #fff;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .10);
    padding: 34px 40px 36px 40px;
    justify-content: space-between;
    align-items: center;
    row-gap: 19px;
}

.infoAccess .box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
    width: calc(100% - 80px);
    height: 10px;
}

.infoAccess .box1::before {
    background-color: #5DB7E8;
}

.infoAccess .box2::before {
    background-color: #13457D;
}

.infoAccess .box .btn {
    width: 100%;
}

@media screen and (max-width: 1023px){

    .topMenu {
        padding: 330px 0 33px 0;
    }

    /*infoAccess*/
    .infoAccess {
        top: -84px;
    }

    .infoAccess .box {
        width: 100%;
        box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .15);
        padding: 20px 16px 24px 16px;
        row-gap: 18px;
    }

    .infoAccess .box::before {
        width: calc(100% - 32px);
        height: 6px;
    }

}

@media screen and (max-width: 789px){

    .topMenu {
        padding: 305px 0 33px 0;
    }

    .mapService .box {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #CCD0DB;
    }

    .mapService .box1  {
        border-left: none;
    }

    .mapService .box a {
        display: block;
        padding: 24px 0 24px 86px;
        background-position: center left 6px, center right 6px;
        background-size: 66px, 22px;
    }

    .mapService .box1 a,
    .mapService .box2 a {
        padding-right: 0;
    }

}

/*flowTop*/
.flowTop {
    position: relative;
    background-color: #5DB7E8;
}

.flowTop .inner {
    max-width: 1225px;
    background-image: url(../img/top/flow-1.png), url(../img/top/flow-2.png);
    background-repeat: no-repeat, no-repeat;
    background-position: center left, center right 62px;
    background-size: 322px, 240px;
    padding: 45px 0;
}

.flowTop .sectionTitle {
    margin-bottom: 21px;
}

@media screen and (max-width: 1023px) {

    .flowTop .inner {
        background-position: center left, center right;
        background-size: 28vw, 22.142857vw;
    }

}

@media screen and (max-width: 599px) {

    .flowTop .inner {
        background-image: url(../img/top/flow-sp.png);
        background-repeat: no-repeat;
        background-position: center bottom 23px;
        background-size: 284px;
        padding: 32px 0 154px 0;
    }

    .flowTop .sectionTitle {
        margin-bottom: 15px;
    }

}

/*bannerTop*/
.bannerTop {
    position: relative;
    padding: 90px 0;
    column-gap: 35px;
    row-gap: 16px;
}

.bannerTop .box {
    width: calc(100% / 2 - 17.5px);
    padding: 10px;
    transition: .2s;
}

.bannerTop .box1 {
    background-color: #5DB7E8;
}

.bannerTop .box1:hover {
    background-color: #2B9CD8;
}

.bannerTop .box2 {
    background-color: #13457D;
}

.bannerTop .box2:hover {
    background-color: #022D58;
}

.bannerTop .box .boxInner {
    border: 1px solid #fff;
    padding: 26px 0;
    background-repeat: no-repeat, no-repeat;
}

.bannerTop .box1 .boxInner {
    background-image: url(../img/top/banner1-1.png), url(../img/top/banner1-2.png);
    background-position: bottom left 27px, bottom right 29px;
    background-size: min(141px,10.071428571428571vw), min(145px,10.357142857142858vw);
}

.bannerTop .box2 .boxInner {
    background-image: url(../img/top/banner2-1.png), url(../img/top/banner2-2.png);
    background-position: bottom left 21px, bottom right 15px;
    background-size: min(142px,10.142857142857142vw), min(140px,10vw);
}

.bannerTop .box .sectionTitle .title {
    background-color: #EAF4FF;
}

@media screen and (max-width: 1023px){

    .bannerTop {
        padding: 55px 0;
    }

    .bannerTop .box {
        width: 100%;
    }

    .bannerTop .box1 .boxInner {
        background-position: bottom left 5px, bottom right 3px;
        background-size: min(141px,23.466666666666665vw), min(145px,22.933333333333334vw);
    }

    .bannerTop .box2 .boxInner {
        background-position: bottom left 7px, bottom right 4px;
        background-size: min(142px,21.333333333333336vw), min(140px,20.533333333333335vw);
    }

    .bannerTop .box2 .sectionTitle .ja {
        letter-spacing: -.03em;
    }

}

/*feature*/
.pickUp {
    background-color: #F5F5F5;
    padding: 67px 0 130px 0;
}

.pickUp .title {
    text-align: center;
    margin-bottom: 43px;
}

.pickUp .title .en {
    font-size: 30px;
    font-weight: 700;
    color: #5DB7E8;
    padding: 0 180px;
    background-image: url(../img/top/wave-pc.svg), url(../img/top/wave-pc.svg);
    background-repeat: no-repeat;
    background-size: 152px, 152px;
    background-position: top 17px left, top 17px right;
}

.swiperTop {
    position: relative;
}

.pickUp .pickUpSwiper .swiper-wrapper,
.pickUp .pickUpSwiper .swiper-wrapper .swiper-slide {
    /* wrapperのサイズを調整 */
    width: 100%;
}

.pickUp .pickUpSwiper .swiper-wrapper .swiper-slide {
    transition: .2s;
}

.pickUp .pickUpSwiper .swiper-wrapper .swiper-slide:hover {
    opacity: .5;
}

.pickUp .pickUpSwiper .swiper-wrapper .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiperTop .swiper-button {
    position: absolute;
    top: -74px;
    left: 50%;
    transform: translateX(-50%);
    margin: auto;
}

.swiperTop.swiperNewsCampaign .swiper-button {
    display: none;
}

.swiperTop .swiper-button .swiper-button-prev,
.swiperTop .swiper-button .swiper-button-next {
    margin-top: 0;
    top: 0;
    bottom: auto;
    left: auto;
    width: 24px;
    height: 24px;
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    transition: .2s;
}
  
.swiperTop .swiper-button .swiper-button-prev {
    right: 34px;
    background-image: url(../img/common/icon-left.svg);
}

.swiperTop .swiper-button .swiper-button-prev:hover {
    background-image: url(../img/common/icon-left-hover.svg);
}

.swiperTop .swiper-button .swiper-button-next {
    right: 0;
    background-image: url(../img/common/icon-right.svg);
}

.swiperTop .swiper-button .swiper-button-next:hover {
    background-image: url(../img/common/icon-right-hover.svg);
}


@media screen and (max-width: 1023px) {

    .swiperTop .swiper-button {
        top: auto;
        bottom: -20px;
        text-align: center;
        width: auto;
        margin-left: 35px;
    }

    .swiperTop.swiperNewsCampaign .swiper-button {
        display: block;
        text-align: left;
        bottom: 30px;
        left: 32px;
    }

    .swiperTop.swiperNewsCampaign.newsSwiper .swiper-button {
        left: 48px;
    }

    .swiperTop .swiper-button .swiper-button-prev {
        right: 42px;
    }

    .swiperTop .swiper-button .swiper-button-prev:hover {
        background-image: url(../img/common/icon-left.svg);
    }

    .swiperTop .swiper-button .swiper-button-next:hover {
        background-image: url(../img/common/icon-right.svg);
    }

}

@media screen and (max-width: 599px) {

    .pickUp {
        padding: 40px 0 112px 0;
    }

    .pickUp .title {
        margin-bottom: 26px;
    }

    .pickUp .title .en {
        font-size: 24px;
        padding: 0 85px;
        background-image: url(../img/top/wave.svg), url(../img/top/wave.svg);
        background-size: 65.69px, 65.69px;
        background-position: top 13px left, top 13px right;
    }

}

/*campaignTop + newsTop*/
.NewsCampaign {
    padding: 72px 0;
}

.newsTop {
    padding-top: 87px;
}

.newsTop .inner {
    position: relative;
}

.campaignTop {
    background-color: #EAF4FF;
}

.campaignTop .sectionTitle {
    margin-bottom: 29px;
}

.newsTop .sectionTitle {
    position: absolute;
    top: -15px;
    left: 0;
}

.swiperNewsCampaign .modBtn3 {
    margin-top: 30px;
}

@media screen and (max-width: 1023px) {

    .newsTop {
        padding-top: 72px;
    }

    .newsTop .inner {
        width: 100%;
    }

    .newsTop .sectionTitle {
        width: calc(100% - 32px);
        margin-left: auto;
        margin-right: auto;
    }

    .newsTop .sectionTitle {
        position: relative;
        top: auto;
        left: auto;
        margin-bottom: 18px;
    }

    .swiperNewsCampaign .modBtn3 {
        margin: 21px 0 0 auto;
    }

    .newsTop .modBtn3 {
        margin: 21px 16px 0 auto;
    }

}

@media screen and (max-width: 599px) {

    .NewsCampaign {
        padding: 60px 0;
    }

    .campaignTop .sectionTitle {
        margin-bottom: 19px;
    }

    .swiperNewsCampaign .modBtn3 {
        margin-top: 21px;
    }

}

/*pagination*/
.pagination {
    margin-top: 70px;
}

.pagination .flex {
    justify-content: center;
    align-items: center;
    column-gap: 10px;
    row-gap: 10px;
}

.pagination .button a {
    width: 8.49px;
    height: 16.97px;
    margin: 0 auto;
}

.pagination .button.prev a {
    background: url(../img/common/prev.png) no-repeat center;
    background-size: 100% auto;
}

.pagination .button.prev a:hover {
    background: url(../img/common/prev-hover.png) no-repeat center;
    background-size: 100% auto;
}

.pagination .button.next a {
    background: url(../img/common/next.png) no-repeat center;
    background-size: 100% auto;
}

.pagination .button.next a:hover {
    background: url(../img/common/next-hover.png) no-repeat center;
    background-size: 100% auto;
}

.pagination .num a {
    font-weight: 400;
    width: 40px;
    height: 40px;
    text-align: center;
    border: 2px solid #13457D;
    padding-top: 4px;
    color: #333;
}

.pagination .num a:hover {
    background-color: #13457D;
    color: #fff;
}

@media screen and (max-width: 599px){

    .main.page .pagination {
        width: 100%;
        margin-top: 24px;
        max-width: 240px;
    }

    .pagination .button {
        width: 100%;
    }

}

/*campaignList*/
.pageCampaign .campaignList,
.pageNews .newsList {
    column-gap: 36px;
    row-gap: 32px;
}

.campaignList a {
    transition: .2s;
}

.pageCampaign .campaignList a,
.pageNews .newsList a {
    width: calc(100% / 4 - 27px);
}

.index .campaignList a:hover {
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .15);
}

.campaignList .img {
    display: block;
    max-height: 180px;
    height: 14.2vw;
    overflow: hidden;
}

.pageCampaign .campaignList .img {
    display: block;
    max-height: 180px;
    height: 14.5vw;
    overflow: hidden;
}

.campaignList .img img {
    object-position: top center;
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition: .3s;
}

.campaignList a:hover .img img {
    transform: scale(1.2);
}

.index .campaignList .text {
    min-height: 127px;
    background-color: #fff;
    padding: 15px 26px;
}

.campaignList .date {
    display: block;
    font-size: 15px;
    margin-bottom: 7px;
    color: #5DB7E8;
}

.pageCampaign .campaignList .date {
    margin-bottom: 5px;
    margin-top: 9px;
}

.campaignList .title {
    font-size: 16px;
    font-weight: 500;
}

.campaignList a:hover .title {
    text-decoration: underline;
}

.index .campaignList .title {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 制限したい行数が3の場合 */
  overflow: hidden;
}

.pageNews .tabs .tabHeader {
    width: 100%;
}

@media screen and (max-width: 1023px){

    .index .campaignList .img {
        max-height: 100%;
        height: 26.9vw;
    }

    .pageCampaign .campaignList,
    .pageNews .newsList {
        column-gap: 24px;
        row-gap: 24px;
    }

    .pageCampaign .campaignList a,
    .pageNews .newsList a {
        width: calc(100% / 3 - 16px);
    }

    .pageCampaign .campaignList .img,
    .pageNews .newsList .img {
        max-height: 100%;
        height: 20vw;
    }

}

@media screen and (max-width: 699px){

    .pageCampaign .campaignList .img,
    .pageNews .newsList .img {
        height: 30vw;
    }

    .pageCampaign .campaignList a,
    .pageNews .newsList a {
        width: calc(100% / 2 - 16px);
    }

}

@media screen and (max-width: 599px){

    .index .campaignList .img {
        height: 47.5vw;
    }

    .index .campaignList .text {
        min-height: 124px;
        padding: 16px 26px;
    }

    .campaignList .date {
        font-size: 14px;
        margin-bottom: 11px;
    }

    .pageCampaign .campaignList .date {
        font-size: 15px;
    }

    .campaignList .title {
        font-size: 15px;
    }

    .pageCampaign .campaignList a,
    .pageNews .newsList a {
        width: 100%;
    }

    .pageCampaign .campaignList .img,
    .pageNews .newsList .img {
        height: 60vw;
    }

}

/*newsList*/
.newsList a {
    border-bottom: 1px solid #CCD0DB;
}

.newsList .img {
    display: block;
    max-height: 180px;
    height: 14.2vw;
    overflow: hidden;
}

.newsList .img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition: .3s;
}

.newsList a:hover .img img {
    transform: scale(1.2);
}

.newsList .text {
    min-height: 163px;
    padding: 22px 10px 15px 10px;
}

.newsList .text .flex {
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.newsList .date {
    font-size: 14px;
    opacity: .5;
}

.newsList .category {
    text-align: center;
    font-size: 13px;
    color: #13457D;
    background-color: #EAF4FF;
    min-width: 95px;
    padding: 2px;
}

.newsList .category.red {
    color: #fff;
    background-color: #FF726C;
}

.newsList .title {
    font-size: 16px;
    font-weight: 500;
    transition: .2s;
}

.newsList a:hover .title {
    color: #5DB7E8;
}

@media screen and (max-width: 1023px){

    .index .newsList .img {
        max-height: 100%;
        height: 26.9vw;
    }

}

@media screen and (max-width: 599px){

    .index .newsList .img {
        height: 45.5vw;
    }

    .newsList .text {
        min-height: 149px;
        padding: 14px 17px;
    }

    .index .newsList .text {
        min-height: 160px;
        padding: 14px 10px;
    }

    .newsList .text .flex {
        margin-bottom: 14px;
    }

    .newsList .date {
        font-size: 14px;
    }

    .index .newsList .title {
        font-size: 15px;
    }

}

/*single*/
.single .singleTitle {
    margin-bottom: 16px;
}

.single .date {
    display: inline-block;
    margin-right: 22px;
    vertical-align: middle;
    font-size: 16px;
    opacity: 1;
}

.single .newsList .category {
    display: inline-block;
    text-align: center;
    font-size: 13px;
    color: #13457D;
    background-color: #EAF4FF;
    min-width: 110px;
    padding: 2px;
    margin-bottom: 0;
}

.single .singleImg {
    text-align: center;
}

.single .singleImg a {
    display: inline-block;
    transition: .2s;
}

.single .singleImg a:hover {
    opacity: .5;
}

.single .singleImg img {
    margin: 44px auto 48px auto;
}

.single .content p {
    font-size: 16px;
    margin-bottom: 40px;
}

.single .return {
    margin-top: 56px;
}

@media screen and (max-width: 599px){

    .single .singleTitle {
        margin-bottom: 12px;
    }

    .single .date {
        margin-right: 16px;
    }

    .single .singleImg img {
        margin: 32px auto;
    }

    .single .content p {
        margin-bottom: 32px;
    }

    .single .return {
        margin-top: 40px;
    }

}

/*pageNews*/
.tabs .tabHeader {
    justify-content: flex-end;
    row-gap: 10px;
}

.tabs .tabHeader li a {
    font-size: 13px;
    font-weight: 500;
    background-color: #fff;
    padding: 1px;
    text-align: center;
    display: block;
    border: 1px solid #5DB7E8;
    color: #5DB7E8;
    transition: .2s;
    cursor: pointer;
    margin-left: 14px;
    width: 110px;
}

.tabs .tabHeader li a:hover {
    color: #fff;
    background-color: #5DB7E8;
}

.tabs .tabHeader li a.red {
    border: 1px solid #FF726C;
    color: #FF726C;
}

.tabs .tabHeader li a.red:hover {
    color: #fff;
    background-color: #FF726C;
}
    
.tabs .tabContent {
    position: relative;
    padding: 43px 0 0 0;
}

.tabs .tabHeader li a.current {
    background-color: #5DB7E8;
    color: #fff;
    /*pointer-events: none;*/
}

.tabs .tabHeader li a.red.current {
    background-color: #FF726C;
    color: #fff;
    /*pointer-events: none;*/
}

@media screen and (max-width: 1023px){

    /*タブ切り替えの中身のスタイル*/
    .tabs .tabContent {
        padding: 24px 0 0 0;
    }

    .tabs .tabHeader {
        width: calc(100% - 32px);
        margin: 0 auto;
        column-gap: 8px;
    }

    .tabs .tabHeader li a {
        padding: 1px 9px;
        margin-left: 0;
        width: auto;
    }

}

@media screen and (max-width: 460px){

    .tabs .tabHeader {
        justify-content: flex-start;
    }

}

/*flexBox1*/
.flexBox1 {
    row-gap: 24px;
}

.flexBox1 .text {
    width: 64.17%;
    padding-right: 4%;
}

.flexBox1 .img {
    width: 35.83%;
}

/*flexBox2*/
.flexBox2 {
    column-gap: 27px;
    row-gap: 32px;
}

.flexBox2 .box {
    width: calc(100% / 4 - 20.5px);
}

.flexBox2 .img {
    margin-bottom: 8px;
}

.flexBox2 .img img {
    width: 100%;
}

/*flexBox3*/
.flexBox3 {
    column-gap: 24px;
    row-gap: 24px;
}

.flexBox3 .box {
    width: calc(100% / 6 - 20px);
    background-color: #EAF4FF;
    padding: 19px 0 17px 0;
    text-align: center;
}

.flexBox3 .img {
    margin-bottom: 6px;
}

.flexBox3 .img img {
    margin: 0 auto;
}

.flexBox3 p {
    font-weight: bold;
    color: #13457D;
}

/*flexBox4*/
.flexBox4 {
    row-gap: 24px;
    margin-bottom: 48px;
}

.flexBox4 .text {
    width: 61.67%;
    padding-left: 4.66%;
}

.flexBox4 .img {
    width: 38.33%;
}

@media screen and (max-width: 1023px){

    /*flexBox2*/
    .flexBox2 .box {
        width: calc(100% / 3 - 18px);
    }

    /*flexBox3*/
    .flexBox3 .box {
        width: calc(100% / 3 - 20px);
    }

}

@media screen and (max-width: 599px){

    /*flexBox1*/
    .flexBox1 .text {
        width: 100%;
        padding-right: 0;
    }

    .flexBox1 .img {
        width: 100%;
    }

    .flexBox1 .img img {
        margin: 0 auto;
    }

    /*flexBox2*/
    .flexBox2 {
        column-gap: 13px;
        row-gap: 16px;
    }

    .flexBox2 .box {
        width: calc(100% / 2 - 10px);
    }

    .flexBox2 .img {
        margin-bottom: 6px;
    }

    .flexBox2 .box p {
        font-size: 14px;
    }

    /*flexBox3*/
    .flexBox3 {
        column-gap: 12px;
        row-gap: 16px;
    }

    .flexBox3 .box {
        width: calc(100% / 2 - 6px);
        padding: 17px 0 14px 0;
    }

    .flexBox3 .img {
        margin-bottom: 4px;
    }

    .flexBox3 .img img {
        width: 83px;
        height: 83px;
    }

    /*flexBox4*/
    .flexBox4 {
        margin-bottom: 32px;
    }

    .flexBox4 .text {
        width: 100%;
        padding-left: 0;
    }

    .flexBox4 .img {
        width: 100%;
    }

    .flexBox4 .img img {
        margin: 0 auto;
    }

}

/*bannerLink*/
.bannerLink {
    position: relative;
    border-radius: 5px;
    max-width: 1000px;
    border: 1px solid #CCCCCC;
    height: 199px;
    margin: 0 auto;
    transition: .2s;
    overflow: hidden;
}

.bannerLink:hover {
    border: 1px solid #5DB7E8;
}

.bannerLink::before {
    content: "";
    position: absolute;
    top: 0;
    right: -5px;
    width: 50%;
    height: 100%;
    border-radius: 5px 5px 0 0;
    background: url(../img/flight/flight-pc.jpg) no-repeat center;
    background-size: auto 100%;
    transition: .3s;
    z-index: -1;
}

.bannerLink:hover::before {
    background-size: auto 110%;
}

.bannerLink .text {
    position: relative;
    width: calc(50% + 10px);
    text-align: center;
    background-color: #F5F5F5;
    height: 197px;
    padding-top: 55px;
    border-radius: 4px 0 0 4px;
}

.bannerLink .text::before {
    content: "";
    position: absolute;
    top: 0;
    right: -75px;
    width: 76px;
    height: 100%;
    text-align: center;
    background: url(../img/flight/flight-bg-pc.png) no-repeat center right;
    background-size: auto 100%;
}

.bannerLink .text .sub {
    font-size: 17px;
    line-height: 1.647058823;
    margin-bottom: 8px;
}

.bannerLink .text .title {
    position: relative;
    font-size: 27px;
    font-weight: 700;
    line-height: 1.555555555;
    display: inline-block;
}

.bannerLink .text .title .line {
    position: relative;
    padding-bottom: 8px;
}

.bannerLink .text .title .line::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background-color: #CC0000;
}

.bannerLink .text .title .line1 {
    padding-right: 13px;
}

.bannerLink .text .title .line2 {
    padding-right: 36px;
    background: url(../img/common/icon-right.svg) no-repeat center right;
    background-size: 24px;
    transition: .2s;
}

.bannerLink:hover .text .title .line2 {
    background-image: url(../img/common/icon-right-hover.svg);
}

@media screen and (max-width: 1023px){

    .bannerLink .text {
        padding-top: 35px;
    }

    .bannerLink .text .sub {
        font-size: 15px;
    }

    .bannerLink .text .title {
        font-size: 22.5px;
    }

    .bannerLink .text .title .line1 {
        display: inline-block;
        padding-right: 0;
        margin-bottom: 8px;
    }

    .bannerLink .text .title .line2 {
        display: block;
    }

}

@media screen and (max-width: 599px){

    .bannerLink {
        height: 180px;
    }

    .bannerLink::before,
    .bannerLink:hover::before {
        width: calc(50% + 17px);
        background: url(../img/flight/flight-sp.jpg) no-repeat center right;
        background-size: cover;
    }

    .bannerLink::after {
        content: "";
        position: absolute;
        bottom: 7px;
        right: 7px;
        width: 24px;
        height: 24px;
        background: url(../img/common/icon-right.svg) no-repeat center;
        background-size: auto 100%;
    }

    .bannerLink .text {
        width: calc(50% - 10px);
        height: 178px;
        padding-top: 30px;
        padding-left: 16px;
    }

    .bannerLink .text::before {
        right: -53px;
        width: 54px;
        background-image: url(../img/flight/flight-bg-sp.png);
    }

    .bannerLink .text .sub {
        font-size: 13px;
        line-height: 1.4;
    }

    .bannerLink .text .kai {
        display: block;
    }

    .bannerLink .text .title {
        font-size: 18px;
        white-space: nowrap;
    }

    .bannerLink .text .title .line {
        padding-bottom: 2px;
    }

    .bannerLink .text .title .line1 {
        margin-bottom: 3px;
    }

    .bannerLink .text .title .line2,
    .bannerLink:hover .text .title .line2 {
        padding-right: 0;
        background: none;
    }

}