@charset "utf-8";
/*-------------------------------------------------
   スライダー　[内容はowl.carousel.cssに記載]
-------------------------------------------------*/
#mainSlider {
	width: 100%;
}
#mainSlider #sync1.owl-carousel .owl-stage-outer {
    padding-bottom: 10vw;
}
#mainSlider #sync1 .item span {
	bottom: -8.8vw!important;
	font-size: 2.8vw!important;
	text-align: left!important;
    background-color: #5a5a5a!important;
}
#mainSlider #sync2 .current .item {
	background: #603f8a;
}
.owl-carousel.owl-drag .owl-item img{
	height: 100%;
}
/*-----------------------------------------
最新のお知らせ
-----------------------------------------*/
#newsWrap {
	width: 100%;
	padding: 8vw 0;
    & h2 {
        padding: 0;
        color: #333;
        font-size: 5vw;
        font-weight: bold;
        margin-bottom: 3vw;
        text-align: center;
        &::before {
            content: "";
            display: inline-block;
            width: 6vw;
            height: 6vw;
            background: url("../../../../kansai/common/img/icon/purple/icon-news.svg") no-repeat;
            background-size: contain;
            margin-right: 1vw;
            vertical-align: middle;
        }
    }
}
#newsWrap .newslist {
	padding: 0 5%;
    & li {
        border-top: dotted 1px #ccc;
        padding: 1vw 0;
        &:first-child {
            border-top: none;
        }
        &:empty {
            display: none;
        }
        & .date {
            display: flex;
            align-items: center;
            margin-bottom: 1vw;
            & time {
                font-size: 3.0vw;
                color: #666;
                margin-right: 2vw;
            }
            & p {
                font-size: 3.0vw;
                color: #fff;
                padding: 0 1vw;
            }
        }
        & .text {
            font-size: 3.4vw;
            line-height: 1.5;
            & a {
                color: #333;
                text-decoration: none;
            }
            & .price {
                color: red;
            }
            & .red {
                color: red;
            }
        }
    }
}

/*-----------------------------------------
検索ボックス
-----------------------------------------*/
#searchBox {
	width: 100%;
	background-color: #f2f2f2;
	padding: 8vw 5vw;
    & .tab {
        width: 100%;
        display: flex;
        justify-content: space-between;
        & li {
            font-size: 3.2vw;
            line-height: 3.5em;
            text-align: center;
            width: 100%;
            margin-right: 1vw;
            background-color: #fff;
            border-radius: 2vw 2vw 0 0;
            &:first-child {
                background-color: #0446a4;
                color: #fff;
            }
            & a {
                display: block;
                width: 100%;
                height: 100%;
                text-decoration: none;
                color: #0446a4;
                border-radius: 2vw 2vw 0 0;
            }
        }
    }
    & .search-content {
        width: 100%;
        border: solid 1px #0446a4;
        padding: 20px;
        background-color: #fff;
    }
}

/*---------------------------------------------
   国から探す
---------------------------------------------*/
.country-link-box {
	width: 100%;
	margin: 8vw 0 3vw;
	background-color: #f3f3f3;
	padding: 3vw;
    & h3 {
        font-size: 4.0vw;
        font-weight: bold;
        color: #333;
        margin-bottom: 1vw;
        &::before {
            font-family: FontAwesome;
            content: "\f002";
            padding: 0 1vw;
        }
    }
    & ul {
        display: flex;
        flex-wrap: wrap;
        & li {
            line-height: 2.4;
            text-align: center;
            font-size: 3.3vw;
            margin: 0 1vw 1vw 0;
            & a {
                display: inline-block;
                background-color: #767e04;
                border-radius: 5vw;
                color: #fff;
                text-decoration: none;
                padding: 0 4vw;
                &::after {
                    font-family: "FontAwesome";
                    content: "\f105";
                    margin-left: 2vw;
                }
            }
        }
    }
}

/*---------------------------------------------
  おすすめ特集
---------------------------------------------*/
#specialWrap {
	width: 100%;
	padding: 8vw 0;
	background-color: #f7f5f0;
    & h2 {
        font-size: 5vw;
        font-weight: bold;
        color: #333;
        margin-bottom: 5vw;
    }
    & ul {
        width: 90%;
        margin: 0 auto;
        display: flex;
        flex-wrap: wrap;
        & li {
            width: 48%;
            margin: 0 1% 2%;
            & a {
                display: block;
            }
            & img {
                width: 100%;
                height: 100%;
            }
        }
        
    }
}

/*---------------------------------------------
  マップ
---------------------------------------------*/
#map {
	width: 100%;
	background: url("../img/map/map-bg.jpg");
	background-size: 241px 241px;
	padding: 5vw 0 2vw;
}
#map h2 {
    width: 90%;
    margin: 0 auto 2vw;
}
#map h2 img {
	width: 60%;
	height: 100%;
}
#map .intro {
	width: 90%;
	margin: 0 auto 3vw;
	font-size: 3.6vw;
	color: #663f14;
	line-height: 1.5em;
}
#map .intro .nosp {
    display: none;
}
#map .mapBox {
}
#map .mapBox .detailBox {
    width: 100%;
    background: url(../img/map/mapSpEurope.png) no-repeat top center;
    background-size: 100%;
}
#map .mapBox .detailBox .inner {
    width: 100%;
}
#map .mapBox .countryList {
    width: 100%;
	height: 90vw;
	position: relative;
}
#map .mapBox .countryList .btn {
    position: absolute;
}
#map .mapBox .countryList .btn span {
	display: inline-block;
	background: #868f0b;
	font-size: 3.2vw;
	line-height: 1;
	padding: 1.5vw 1vw;
	color: #fff;
}
#map .mapBox .countryList .btn.active span, #map .mapBox .countryList .btn span:hover {
	background: #333;
}
#map .mapBox .countryList .btn span::after {
    font-family: FontAwesome;
    content: "\f0d7";
    padding-left: 1vw;
}
#map .mapBox .countryList .nearCountryBox {
	width: 48vw;
	text-align: center;
	background: #fff;
	border: 2px solid #c9b48a;
	padding: 1vw;
	position: absolute;
    bottom: 3vw;
	right: 3vw;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
#map .mapBox .countryList .nearCountryBox .boxttl {
	font-size: 3.0vw;
	line-height: 1;
	font-weight: bold;
    margin-bottom: 1vw;
	width: 100%;
}
#map .mapBox .countryList .nearCountryBox .btn {
	position: static;
}
#map .mapBox .countryList .nearCountryBox .btn + .btn {
	margin-left: 2vw
}

/* //// ↓ボタン位置↓ //// */
#map .mapBox .countryList .btn.GBR {top: 23vw;	left: 14vw;}
#map .mapBox .countryList .btn.FRA {top: 46vw;	left: 13vw;}
#map .mapBox .countryList .btn.ESP {top: 58vw;	left: 14vw;}
#map .mapBox .countryList .btn.ITA {top: 59vw;	left: 38vw;}
#map .mapBox .countryList .btn.NLD {top: 30vw;	left: 19vw;}
#map .mapBox .countryList .btn.BEL {top: 37vw;	left: 14vw;}
#map .mapBox .countryList .btn.DEU {top: 37vw;	left: 37vw;}
#map .mapBox .countryList .btn.FIN {top: 3vw; left: 60vw;}
#map .mapBox .countryList .btn.CHE {top: 45vw; left: 35vw;}
#map .mapBox .countryList .btn.HRV {top: 52vw; left: 45vw;}
#map .mapBox .countryList .btn.AUT {top: 42vw; left: 55vw;}
#map .mapBox .countryList .btn.GRC {top: 65vw; left: 56vw;}
#map .mapBox .countryList .btn.TUR {top: 62vw; left: 80vw;}
#map .mapBox .countryList .btn.RUS {top: 17vw; left: 80vw;}
#map .mapBox .countryList .btn.MAR {top: 75vw; left: 3vw;}
#map .mapBox .countryList .btn.NOR {top: 6vw;	left: 26vw;}
#map .mapBox .countryList .btn.SWE {top: 14vw;	left: 39vw;}
#map .mapBox .countryList .btn.DNK {top: 22vw;	left: 35vw;}
#map .mapBox .countryList .btn.POL {top: 28vw;	left: 59vw;}
#map .mapBox .countryList .btn.CZE {top: 35vw;	left: 57vw;}
#map .mapBox .countryList .btn.HUN {top: 49vw;	left: 68vw;}
#map .mapBox .countryList .btn.PRT {top: 65vw;	left: 2vw;}

/* //// ↓詳細ボックス↓ //// */
#map .mapBox .switchConts  {
    width: 100%;
    padding-bottom: 5vw;
}
#map .mapBox .switchConts .conts {
	width: 80vw;
    margin: 0 auto;
	border: 2px solid #333;
    box-sizing: content-box;
    background-color: #fff;
	box-shadow: 0px 0px 6px 0px rgba(0,0,0,.4);
}
#map .mapBox .switchConts .conts .img img {
	width: 100%;
	height: 100%;
}
#map .mapBox .switchConts .conts .text {
    padding: 2vw 2vw 1vw;
}
#map .mapBox .switchConts .conts .subttl {
	font-size: 4.6vw;
	line-height: 1.5em;
	margin-bottom: 0.5vw;
	font-weight: bold;
}
#map .mapBox .switchConts .conts .txt {
    font-size: 3.4vw;
	line-height: 1.5;
}

/* //// ↓リンクボタン↓ //// */
#map .mapBox .linkBtn {
	text-align: right;
	margin-top: 5vw;
}
#map .mapBox .linkBtn a {
    display: inline-block;
    color: #333;
    text-decoration: none;
	font-size: 3.3vw;
	padding: 1vw 2vw;
	margin: 0 0 2vw 2vw;
}
#map .mapBox .linkBtn a:after {
    font-family: FontAwesome;
    content: "\f0da";
    font-size: 3.6vw;
    margin-left: 1vw;
}
#map .mapBox .linkBtn a.typeA {
	background: #efe4ca;
}
#map .mapBox .linkBtn a.typeB {
	background: #f6d8d7;
}
#map .mapBox .linkBtn a.typeC {
	background: #cbeef5;
}
#map .mapBox .linkBtn a.typeA:hover {
    color: #fff;
	background: #bc9a4d;
}
#map .mapBox .linkBtn a.typeB:hover {
    color: #fff;
	background: #d56964;
}
#map .mapBox .linkBtn a.typeC:hover {
    color: #fff;
	background: #1889a0;
}

/*---------------------------------------------
      フッター検索ナビ
---------------------------------------------*/
#footSearchNavi {
	position: fixed;
	bottom: 0;
	width: 100%;
	z-index: 1000;
    & ul {
        display: flex;
        width: 100%;
        height: 50px;
        align-items: center;
        justify-content:space-between;
        background-color: #f9f4ff;
        box-shadow:0px -1px 2px 0px rgba(0,0,0,0.2);
        & li {
            font-size: 10px;
            line-height: 1.2em;
            text-align: center;
            height: 100%;
            border-right: solid 1px #fff;
            &:nth-child(1) {width: 28%; background: url(../../../../kansai/common/img/icon/purple/search-tour.svg) no-repeat top 4px center;background-size: 26px auto;}
            &:nth-child(2) {width: 28%; background: url(../../../../kansai/common/img/icon/purple/search-airhotel.svg) no-repeat top 4px center;background-size: 26px auto;}
            &:nth-child(3) {width: 28%; background: url(../../../../kansai/common/img/icon/purple/search-air.svg) no-repeat top 4px center;background-size: 26px auto;}
            & a {
                display: flex;
                width: 100%;
                height: 100%;
                text-decoration: none;
                align-items: flex-end;
                justify-content: center;
                color: #333;
                padding: 5px 0;
            }
            &:last-child {
                width: 16%;
                border: 0;
                background-color: #777;
                & a {
                    color: #fff;
                    position: relative;
                    &::before {
                        font-family: FontAwesome;
                        content: "\f106";
                        font-size: 14px;
                        position: absolute;
                        top: 5px;
                    }
                }
            }
        }
    }
}

/*---------------------------------------------
      発着地から選ぶ
---------------------------------------------*/
#dptWrap {
	width: 100%;
	background-color: #fff;
    & h2 {
        font-size: 4.2vw;
        font-weight: normal;
        padding: 2vw 0;
        text-align: center;
        color: #fff;
        background-color: #023b95;
    }
    & ul {
        display: flex;
        & li {
            width: 33.3%;
            border-right: dotted 1px #ccc;
            border-bottom: dotted 1px #ccc;
            &:nth-child(3n) {
                border-right: none;
            }
            &:nth-child(16),&:nth-child(17) {
                border-bottom: none;
            }
            & a {
                font-size: 3.4vw;
                padding: 2.5vw 2vw;
                display: block;
                width: 100%;
                height: 100%;
                color: #333;
                text-decoration: none;
                position: relative;
                letter-spacing: -1px;
                &::after {
                    font-family: FontAwesome;
                    content: "\f105";
                    color: #023b95;
                    position: absolute;
                    right: 2vw;
                }
            }
        }
    }
}